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

feat: improve import-export UI (#3452)

Browse Source 
* chore: uniform styles across components

* chore: removed absolute wrapper divs

* feat: add import button when graphql collections are empty

* chore: add icon for button

---------

Co-authored-by: nivedin <nivedinp@gmail.com>
This commit is contained in:
Liyas Thomas
2023-10-13 17:57:14 +05:30
committed by GitHub
parent 016a18d3b2
commit 73b3ff8e41
5 changed files with 77 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
packages/hoppscotch-common/src/components/environments/my/index.vue
View File

@@ -32,12 +32,17 @@
:environment="environment"
@edit-environment="editEnvironment(index)"
/>
<div v-if="!environments.length" class="p-5 space-y-25 flex flex-col">
<HoppSmartPlaceholder
v-if="!environments.length"
:src="`/images/states/${colorMode.value}/blockchain.svg`"
:alt="`${t('empty.environments')}`"
:text="t('empty.environments')"
>
<div class="flex flex-col items-center space-y-4">
<span class="text-secondaryLight text-center">
{{ t("environment.import_or_create") }}
</span>
<div class="flex gap-4 flex-col items-center">
<div class="flex gap-4 flex-col items-stretch">
<HoppButtonPrimary
:icon="IconImport"
:label="t('import.title')"
@@ -54,13 +59,7 @@
/>
</div>
</div>
<HoppSmartPlaceholder
:src="`/images/states/${colorMode.value}/blockchain.svg`"
:alt="`${t('empty.environments')}`"
:text="t('empty.environments')"
/>
</div>
</HoppSmartPlaceholder>
<EnvironmentsMyDetails
:show="showModalDetails"
:action="action"

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

@@ -43,15 +43,17 @@
/>
</div>
</div>
<div
<HoppSmartPlaceholder
v-if="!loading && !teamEnvironments.length && !adapterError"
class="p-5 space-y-25 flex flex-col"
:src="`/images/states/${colorMode.value}/blockchain.svg`"
:alt="`${t('empty.environments')}`"
:text="t('empty.environments')"
>
<div class="flex flex-col items-center space-y-4">
<span class="text-secondaryLight text-center">
{{ t("environment.import_or_create") }}
</span>
<div class="flex gap-4 flex-col items-center">
<div class="flex gap-4 flex-col items-stretch">
<HoppButtonPrimary
:icon="IconImport"
:label="t('import.title')"
@@ -72,13 +74,7 @@
/>
</div>
</div>
<HoppSmartPlaceholder
:src="`/images/states/${colorMode.value}/blockchain.svg`"
:alt="`${t('empty.environments')}`"
:text="t('empty.environments')"
/>
</div>
</HoppSmartPlaceholder>
<div v-else-if="!loading">
<EnvironmentsTeamsEnvironment
v-for="(environment, index) in JSON.parse(