btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/hoppscotch-common/src/components/teams/Add.vue
View File

@@ -1,5 +1,5 @@
<template>
<SmartModal v-if="show" dialog :title="t('team.new')" @close="hideModal">
<HoppSmartModal v-if="show" dialog :title="t('team.new')" @close="hideModal">
<template #body>
<div class="flex flex-col">
<input
@@ -19,13 +19,13 @@
</template>
<template #footer>
<span class="flex space-x-2">
<ButtonPrimary
<HoppButtonPrimary
:label="t('action.save')"
:loading="isLoading"
outline
@click="addNewTeam"
/>
<ButtonSecondary
<HoppButtonSecondary
:label="t('action.cancel')"
outline
filled
@@ -33,7 +33,7 @@
/>
</span>
</template>
</SmartModal>
</HoppSmartModal>
</template>
<script setup lang="ts">

22
packages/hoppscotch-common/src/components/teams/Edit.vue
View File

@@ -1,5 +1,5 @@
<template>
<SmartModal v-if="show" dialog :title="t('team.edit')" @close="hideModal">
<HoppSmartModal v-if="show" dialog :title="t('team.edit')" @close="hideModal">
<template #body>
<div class="flex flex-col">
<div class="relative flex">
@@ -22,7 +22,7 @@
{{ t("team.members") }}
</label>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
:icon="IconUserPlus"
:label="t('team.invite')"
filled
@@ -36,7 +36,7 @@
</div>
<div v-if="teamDetails.loading" class="border rounded border-divider">
<div class="flex items-center justify-center p-4">
<SmartSpinner />
<HoppSmartSpinner />
</div>
</div>
<div
@@ -60,7 +60,7 @@
<span class="pb-4 text-center">
{{ t("empty.members") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
:icon="IconUserPlus"
:label="t('team.invite')"
@click="
@@ -106,7 +106,7 @@
tabindex="0"
@keyup.escape="hide()"
>
<SmartItem
<HoppSmartItem
label="OWNER"
:icon="
member.role === 'OWNER' ? IconCircleDot : IconCircle
@@ -119,7 +119,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
label="EDITOR"
:icon="
member.role === 'EDITOR' ? IconCircleDot : IconCircle
@@ -132,7 +132,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
label="VIEWER"
:icon="
member.role === 'VIEWER' ? IconCircleDot : IconCircle
@@ -150,7 +150,7 @@
</tippy>
</span>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
id="member"
v-tippy="{ theme: 'tooltip' }"
:title="t('action.remove')"
@@ -174,13 +174,13 @@
</template>
<template #footer>
<span class="flex space-x-2">
<ButtonPrimary
<HoppButtonPrimary
:label="t('action.save')"
:loading="isLoading"
outline
@click="saveTeam"
/>
<ButtonSecondary
<HoppButtonSecondary
:label="t('action.cancel')"
outline
filled
@@ -188,7 +188,7 @@
/>
</span>
</template>
</SmartModal>
</HoppSmartModal>
</template>
<script setup lang="ts">

39
packages/hoppscotch-common/src/components/teams/Invite.vue
View File

@@ -1,5 +1,10 @@
<template>
<SmartModal v-if="show" dialog :title="t('team.invite')" @close="hideModal">
<HoppSmartModal
v-if="show"
dialog
:title="t('team.invite')"
@close="hideModal"
>
<template #body>
<div v-if="sendInvitesResult.length" class="flex flex-col px-4">
<div class="flex flex-col items-center justify-center max-w-md">
@@ -40,7 +45,7 @@
v-else-if="sendingInvites"
class="flex items-center justify-center p-4"
>
<SmartSpinner />
<HoppSmartSpinner />
</div>
<div v-else class="flex flex-col">
<div class="flex items-center justify-between flex-1">
@@ -53,7 +58,7 @@
v-if="pendingInvites.loading"
class="flex items-center justify-center p-4"
>
<SmartSpinner />
<HoppSmartSpinner />
</div>
<div v-else>
<div
@@ -82,7 +87,7 @@
readonly
/>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.remove')"
:icon="IconTrash"
@@ -118,7 +123,7 @@
{{ t("team.invite_tooltip") }}
</label>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
:icon="IconPlus"
:label="t('add.new')"
filled
@@ -162,7 +167,7 @@
tabindex="0"
@keyup.escape="hide()"
>
<SmartItem
<HoppSmartItem
label="OWNER"
:icon="
invitee.value === 'OWNER' ? IconCircleDot : IconCircle
@@ -175,7 +180,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
label="EDITOR"
:icon="
invitee.value === 'EDITOR' ? IconCircleDot : IconCircle
@@ -188,7 +193,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
label="VIEWER"
:icon="
invitee.value === 'VIEWER' ? IconCircleDot : IconCircle
@@ -206,7 +211,7 @@
</tippy>
</span>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
id="member"
v-tippy="{ theme: 'tooltip' }"
:title="t('action.remove')"
@@ -229,7 +234,7 @@
<span class="pb-4 text-center">
{{ t("empty.invites") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
:label="t('add.new')"
filled
@click="addNewInvitee"
@@ -294,7 +299,7 @@
v-if="sendInvitesResult.length"
class="flex justify-between flex-1 text-secondaryLight"
>
<ButtonSecondary
<HoppButtonSecondary
class="link !p-0"
:label="t('team.invite_more')"
:icon="IconArrowLeft"
@@ -310,15 +315,19 @@
}
"
/>
<ButtonSecondary
<HoppButtonSecondary
class="link !p-0"
:label="`${t('action.dismiss')}`"
@click="hideModal"
/>
</p>
<span v-else class="flex space-x-2">
<ButtonPrimary :label="t('team.invite')" outline @click="sendInvites" />
<ButtonSecondary
<HoppButtonPrimary
:label="t('team.invite')"
outline
@click="sendInvites"
/>
<HoppButtonSecondary
:label="t('action.cancel')"
outline
filled
@@ -326,7 +335,7 @@
/>
</span>
</template>
</SmartModal>
</HoppSmartModal>
</template>
<script setup lang="ts">

4
packages/hoppscotch-common/src/components/teams/Modal.vue
View File

@@ -1,5 +1,5 @@
<template>
<SmartModal
<HoppSmartModal
v-if="show"
dialog
:title="t('team.select_a_team')"
@@ -8,7 +8,7 @@
<template #body>
<Teams :modal="true" />
</template>
</SmartModal>
</HoppSmartModal>
</template>
<script setup lang="ts">

16
packages/hoppscotch-common/src/components/teams/Team.vue
View File

@@ -56,7 +56,7 @@
</div>
<div v-if="!compact" class="flex items-end justify-between flex-shrink-0">
<span>
<ButtonSecondary
<HoppButtonSecondary
v-if="team.myRole === 'OWNER'"
:icon="IconEdit"
class="rounded-none"
@@ -67,7 +67,7 @@
}
"
/>
<ButtonSecondary
<HoppButtonSecondary
v-if="team.myRole === 'OWNER'"
:icon="IconUserPlus"
class="rounded-none"
@@ -87,7 +87,7 @@
theme="popover"
:on-shown="() => tippyActions.focus()"
>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.more')"
:icon="IconMoreVertical"
@@ -108,7 +108,7 @@
"
@keyup.escape="hide()"
>
<SmartItem
<HoppSmartItem
v-if="team.myRole === 'OWNER'"
ref="edit"
:icon="IconEdit"
@@ -121,7 +121,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
v-if="!(team.myRole === 'OWNER' && team.ownersCount == 1)"
ref="exit"
:icon="IconUserX"
@@ -134,7 +134,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
v-if="team.myRole === 'OWNER'"
ref="deleteAction"
:icon="IconTrash2"
@@ -152,13 +152,13 @@
</tippy>
</span>
</div>
<SmartConfirmModal
<HoppSmartConfirmModal
:show="confirmRemove"
:title="t('confirm.remove_team')"
@hide-modal="confirmRemove = false"
@resolve="deleteTeam()"
/>
<SmartConfirmModal
<HoppSmartConfirmModal
:show="confirmExit"
:title="t('confirm.exit_team')"
@hide-modal="confirmExit = false"

6
packages/hoppscotch-common/src/components/teams/index.vue
View File

@@ -1,13 +1,13 @@
<template>
<div>
<div class="space-y-4">
<ButtonSecondary
<HoppButtonSecondary
:label="`${t('team.create_new')}`"
outline
@click="displayModalAdd(true)"
/>
<div v-if="loading" class="flex flex-col items-center justify-center">
<SmartSpinner class="mb-4" />
<HoppSmartSpinner class="mb-4" />
<span class="text-secondaryLight">{{ t("state.loading") }}</span>
</div>
<div
@@ -23,7 +23,7 @@
<span class="mb-4 text-center">
{{ t("empty.teams") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
:label="`${t('team.create_new')}`"
filled
@click="displayModalAdd(true)"