refactor: update hopp-ui to be independent (#2927)

Co-authored-by: Anwarul Islam <anwaarulislaam@gmail.com>
This commit is contained in:
Andrew Bastin
2023-02-24 13:20:12 +05:30
committed by GitHub
parent 82c6f6f6bc
commit cae1840506
165 changed files with 2134 additions and 2069 deletions

View File

@@ -1,5 +1,5 @@
<template>
<SmartModal
<HoppSmartModal
v-if="show"
dialog
:title="t(`environment.${action}`)"
@@ -29,13 +29,13 @@
{{ t("environment.variable_list") }}
</label>
<div v-if="!isViewer" class="flex">
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.clear_all')"
:icon="clearIcon"
@click="clearContent()"
/>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:icon="IconPlus"
:title="t('add.new')"
@@ -73,7 +73,7 @@
:readonly="isViewer"
/>
<div v-if="!isViewer" class="flex">
<ButtonSecondary
<HoppButtonSecondary
id="variable"
v-tippy="{ theme: 'tooltip' }"
:title="t('action.remove')"
@@ -96,14 +96,14 @@
<span class="pb-4 text-center">
{{ t("empty.environments") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
v-if="isViewer"
disabled
:label="`${t('add.new')}`"
filled
class="mb-4"
/>
<ButtonSecondary
<HoppButtonSecondary
v-else
:label="`${t('add.new')}`"
filled
@@ -116,13 +116,13 @@
</template>
<template v-if="!isViewer" #footer>
<span class="flex space-x-2">
<ButtonPrimary
<HoppButtonPrimary
:label="`${t('action.save')}`"
:loading="isLoading"
outline
@click="saveEnvironment"
/>
<ButtonSecondary
<HoppButtonSecondary
:label="`${t('action.cancel')}`"
outline
filled
@@ -130,7 +130,7 @@
/>
</span>
</template>
</SmartModal>
</HoppSmartModal>
</template>
<script setup lang="ts">

View File

@@ -26,7 +26,7 @@
theme="popover"
:on-shown="() => tippyActions!.focus()"
>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.more')"
:icon="IconMoreVertical"
@@ -42,7 +42,7 @@
@keyup.delete="deleteAction!.$el.click()"
@keyup.escape="options!.tippy().hide()"
>
<SmartItem
<HoppSmartItem
ref="edit"
:icon="IconEdit"
:label="`${t('action.edit')}`"
@@ -54,7 +54,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
ref="duplicate"
:icon="IconCopy"
:label="`${t('action.duplicate')}`"
@@ -66,7 +66,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
ref="deleteAction"
:icon="IconTrash2"
:label="`${t('action.delete')}`"
@@ -82,7 +82,7 @@
</template>
</tippy>
</span>
<SmartConfirmModal
<HoppSmartConfirmModal
:show="confirmRemove"
:title="`${t('confirm.remove_environment')}`"
@hide-modal="confirmRemove = false"
@@ -108,7 +108,7 @@ import IconCopy from "~icons/lucide/copy"
import IconTrash2 from "~icons/lucide/trash-2"
import IconMoreVertical from "~icons/lucide/more-vertical"
import { TippyComponent } from "vue-tippy"
import SmartItem from "@hoppscotch/ui/src/components/smart/Item.vue"
import { HoppSmartItem } from "@hoppscotch/ui"
const t = useI18n()
const toast = useToast()
@@ -126,9 +126,9 @@ const confirmRemove = ref(false)
const tippyActions = ref<TippyComponent | null>(null)
const options = ref<TippyComponent | null>(null)
const edit = ref<typeof SmartItem>()
const duplicate = ref<typeof SmartItem>()
const deleteAction = ref<typeof SmartItem>()
const edit = ref<typeof HoppSmartItem>()
const duplicate = ref<typeof HoppSmartItem>()
const deleteAction = ref<typeof HoppSmartItem>()
const removeEnvironment = () => {
pipe(

View File

@@ -3,7 +3,7 @@
<div
class="sticky z-10 flex justify-between flex-1 flex-shrink-0 overflow-x-auto border-b top-upperSecondaryStickyFold border-dividerLight bg-primary"
>
<ButtonSecondary
<HoppButtonSecondary
v-if="team === undefined || team.myRole === 'VIEWER'"
v-tippy="{ theme: 'tooltip' }"
disabled
@@ -12,7 +12,7 @@
:title="t('team.no_access')"
:label="t('action.new')"
/>
<ButtonSecondary
<HoppButtonSecondary
v-else
:icon="IconPlus"
:label="`${t('action.new')}`"
@@ -20,21 +20,21 @@
@click="displayModalAdd(true)"
/>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
to="https://docs.hoppscotch.io/features/environments"
blank
:title="t('app.wiki')"
:icon="IconHelpCircle"
/>
<ButtonSecondary
<HoppButtonSecondary
v-if="team !== undefined && team.myRole === 'VIEWER'"
v-tippy="{ theme: 'tooltip' }"
disabled
:icon="IconArchive"
:title="t('modal.import_export')"
/>
<ButtonSecondary
<HoppButtonSecondary
v-else
v-tippy="{ theme: 'tooltip' }"
:icon="IconArchive"
@@ -56,7 +56,7 @@
<span class="pb-4 text-center">
{{ t("empty.environments") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
v-if="team === undefined || team.myRole === 'VIEWER'"
v-tippy="{ theme: 'tooltip' }"
disabled
@@ -66,7 +66,7 @@
:title="t('team.no_access')"
:label="t('action.new')"
/>
<ButtonSecondary
<HoppButtonSecondary
v-else
:label="`${t('add.new')}`"
filled
@@ -87,7 +87,7 @@
/>
</div>
<div v-if="loading" class="flex flex-col items-center justify-center p-4">
<SmartSpinner class="my-4" />
<HoppSmartSpinner class="my-4" />
<span class="text-secondaryLight">{{ t("state.loading") }}</span>
</div>
<div