Compare commits
4 Commits
feat/reque
...
improve/pl
| Author | SHA1 | Date | |
|---|---|---|---|
|
019c2cec46 | ||
|
40b9508361 | ||
|
|
85285a5204 | ||
|
|
c0c0c37a67 |
@@ -17,9 +17,10 @@
|
|||||||
v-if="isEmpty(shortcutsResults)"
|
v-if="isEmpty(shortcutsResults)"
|
||||||
:text="`${t('state.nothing_found')} ‟${filterText}”`"
|
:text="`${t('state.nothing_found')} ‟${filterText}”`"
|
||||||
>
|
>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<template #icon>
|
||||||
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
|
|
||||||
<details
|
<details
|
||||||
v-for="(sectionResults, sectionTitle) in shortcutsResults"
|
v-for="(sectionResults, sectionTitle) in shortcutsResults"
|
||||||
v-else
|
v-else
|
||||||
|
|||||||
@@ -49,13 +49,15 @@
|
|||||||
:text="`${t('state.nothing_found')} ‟${search}”`"
|
:text="`${t('state.nothing_found')} ‟${search}”`"
|
||||||
>
|
>
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
|
</template>
|
||||||
|
<template #body>
|
||||||
|
<HoppButtonSecondary
|
||||||
|
:label="t('action.clear')"
|
||||||
|
outline
|
||||||
|
@click="search = ''"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
<HoppButtonSecondary
|
|
||||||
:label="t('action.clear')"
|
|
||||||
outline
|
|
||||||
@click="search = ''"
|
|
||||||
/>
|
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -254,7 +254,7 @@
|
|||||||
:text="`${t('state.nothing_found')} ‟${filterText}”`"
|
:text="`${t('state.nothing_found')} ‟${filterText}”`"
|
||||||
>
|
>
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
</template>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
@@ -263,27 +263,29 @@
|
|||||||
:alt="`${t('empty.collections')}`"
|
:alt="`${t('empty.collections')}`"
|
||||||
:text="t('empty.collections')"
|
:text="t('empty.collections')"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col items-center space-y-4">
|
<template #body>
|
||||||
<span class="text-center text-secondaryLight">
|
<div class="flex flex-col items-center space-y-4">
|
||||||
{{ t("collection.import_or_create") }}
|
<span class="text-center text-secondaryLight">
|
||||||
</span>
|
{{ t("collection.import_or_create") }}
|
||||||
<div class="flex flex-col items-stretch gap-4">
|
</span>
|
||||||
<HoppButtonPrimary
|
<div class="flex flex-col items-stretch gap-4">
|
||||||
:icon="IconImport"
|
<HoppButtonPrimary
|
||||||
:label="t('import.title')"
|
:icon="IconImport"
|
||||||
filled
|
:label="t('import.title')"
|
||||||
outline
|
filled
|
||||||
@click="emit('display-modal-import-export')"
|
outline
|
||||||
/>
|
@click="emit('display-modal-import-export')"
|
||||||
<HoppButtonSecondary
|
/>
|
||||||
:icon="IconPlus"
|
<HoppButtonSecondary
|
||||||
:label="t('add.new')"
|
:icon="IconPlus"
|
||||||
filled
|
:label="t('add.new')"
|
||||||
outline
|
filled
|
||||||
@click="emit('display-modal-add')"
|
outline
|
||||||
/>
|
@click="emit('display-modal-add')"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-else-if="node.data.type === 'collections'"
|
v-else-if="node.data.type === 'collections'"
|
||||||
@@ -291,18 +293,20 @@
|
|||||||
:alt="`${t('empty.collections')}`"
|
:alt="`${t('empty.collections')}`"
|
||||||
:text="t('empty.collections')"
|
:text="t('empty.collections')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="t('add.new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('add.new')"
|
||||||
outline
|
filled
|
||||||
@click="
|
outline
|
||||||
node.data.type === 'collections' &&
|
@click="
|
||||||
emit('add-folder', {
|
node.data.type === 'collections' &&
|
||||||
path: node.id,
|
emit('add-folder', {
|
||||||
folder: node.data.data.data,
|
path: node.id,
|
||||||
})
|
folder: node.data.data.data,
|
||||||
"
|
})
|
||||||
/>
|
"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-else-if="node.data.type === 'folders'"
|
v-else-if="node.data.type === 'folders'"
|
||||||
|
|||||||
@@ -274,33 +274,37 @@
|
|||||||
:text="t('empty.collections')"
|
:text="t('empty.collections')"
|
||||||
@drop.stop
|
@drop.stop
|
||||||
>
|
>
|
||||||
<div class="flex flex-col items-center space-y-4">
|
<template #body>
|
||||||
<span class="text-center text-secondaryLight">
|
<div class="flex flex-col items-center space-y-4">
|
||||||
{{ t("collection.import_or_create") }}
|
<span class="text-center text-secondaryLight">
|
||||||
</span>
|
{{ t("collection.import_or_create") }}
|
||||||
<div class="flex flex-col items-stretch gap-4">
|
</span>
|
||||||
<HoppButtonPrimary
|
<div class="flex flex-col items-stretch gap-4">
|
||||||
:icon="IconImport"
|
<HoppButtonPrimary
|
||||||
:label="t('import.title')"
|
:icon="IconImport"
|
||||||
filled
|
:label="t('import.title')"
|
||||||
outline
|
filled
|
||||||
:disabled="hasNoTeamAccess"
|
outline
|
||||||
:title="hasNoTeamAccess ? t('team.no_access') : ''"
|
:disabled="hasNoTeamAccess"
|
||||||
@click="
|
:title="hasNoTeamAccess ? t('team.no_access') : ''"
|
||||||
hasNoTeamAccess ? null : emit('display-modal-import-export')
|
@click="
|
||||||
"
|
hasNoTeamAccess
|
||||||
/>
|
? null
|
||||||
<HoppButtonSecondary
|
: emit('display-modal-import-export')
|
||||||
:icon="IconPlus"
|
"
|
||||||
:label="t('add.new')"
|
/>
|
||||||
filled
|
<HoppButtonSecondary
|
||||||
outline
|
:icon="IconPlus"
|
||||||
:disabled="hasNoTeamAccess"
|
:label="t('add.new')"
|
||||||
:title="hasNoTeamAccess ? t('team.no_access') : ''"
|
filled
|
||||||
@click="hasNoTeamAccess ? null : emit('display-modal-add')"
|
outline
|
||||||
/>
|
:disabled="hasNoTeamAccess"
|
||||||
|
:title="hasNoTeamAccess ? t('team.no_access') : ''"
|
||||||
|
@click="hasNoTeamAccess ? null : emit('display-modal-add')"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-else-if="node.data.type === 'collections'"
|
v-else-if="node.data.type === 'collections'"
|
||||||
@@ -309,18 +313,20 @@
|
|||||||
:text="t('empty.collections')"
|
:text="t('empty.collections')"
|
||||||
@drop.stop
|
@drop.stop
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="t('add.new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('add.new')"
|
||||||
outline
|
filled
|
||||||
@click="
|
outline
|
||||||
node.data.type === 'collections' &&
|
@click="
|
||||||
emit('add-folder', {
|
node.data.type === 'collections' &&
|
||||||
path: node.id,
|
emit('add-folder', {
|
||||||
folder: node.data.data.data,
|
path: node.id,
|
||||||
})
|
folder: node.data.data.data,
|
||||||
"
|
})
|
||||||
/>
|
"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-else-if="node.data.type === 'folders'"
|
v-else-if="node.data.type === 'folders'"
|
||||||
|
|||||||
@@ -180,16 +180,18 @@
|
|||||||
:alt="`${t('empty.collection')}`"
|
:alt="`${t('empty.collection')}`"
|
||||||
:text="t('empty.collection')"
|
:text="t('empty.collection')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="t('add.new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('add.new')"
|
||||||
outline
|
filled
|
||||||
@click="
|
outline
|
||||||
emit('add-folder', {
|
@click="
|
||||||
path: `${collectionIndex}`,
|
emit('add-folder', {
|
||||||
})
|
path: `${collectionIndex}`,
|
||||||
"
|
})
|
||||||
/>
|
"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -176,8 +176,7 @@
|
|||||||
:src="`/images/states/${colorMode.value}/pack.svg`"
|
:src="`/images/states/${colorMode.value}/pack.svg`"
|
||||||
:alt="`${t('empty.folder')}`"
|
:alt="`${t('empty.folder')}`"
|
||||||
:text="t('empty.folder')"
|
:text="t('empty.folder')"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<HoppSmartConfirmModal
|
<HoppSmartConfirmModal
|
||||||
|
|||||||
@@ -11,7 +11,7 @@
|
|||||||
type="search"
|
type="search"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
:placeholder="t('action.search')"
|
:placeholder="t('action.search')"
|
||||||
class="!border-0 bg-transparent py-2 pl-4 pr-2"
|
class="flex w-full bg-transparent px-4 py-2 h-8"
|
||||||
/>
|
/>
|
||||||
<div
|
<div
|
||||||
class="flex flex-1 flex-shrink-0 justify-between border-y border-dividerLight bg-primary"
|
class="flex flex-1 flex-shrink-0 justify-between border-y border-dividerLight bg-primary"
|
||||||
@@ -66,34 +66,36 @@
|
|||||||
:alt="`${t('empty.collections')}`"
|
:alt="`${t('empty.collections')}`"
|
||||||
:text="t('empty.collections')"
|
:text="t('empty.collections')"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col items-center space-y-4">
|
<template #body>
|
||||||
<span class="text-center text-secondaryLight">
|
<div class="flex flex-col items-center space-y-4">
|
||||||
{{ t("collection.import_or_create") }}
|
<span class="text-center text-secondaryLight">
|
||||||
</span>
|
{{ t("collection.import_or_create") }}
|
||||||
<div class="flex flex-col items-stretch gap-4">
|
</span>
|
||||||
<HoppButtonPrimary
|
<div class="flex flex-col items-stretch gap-4">
|
||||||
:icon="IconImport"
|
<HoppButtonPrimary
|
||||||
:label="t('import.title')"
|
:icon="IconImport"
|
||||||
filled
|
:label="t('import.title')"
|
||||||
outline
|
filled
|
||||||
@click="displayModalImportExport(true)"
|
outline
|
||||||
/>
|
@click="displayModalImportExport(true)"
|
||||||
<HoppButtonSecondary
|
/>
|
||||||
:label="t('add.new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('add.new')"
|
||||||
outline
|
filled
|
||||||
:icon="IconPlus"
|
outline
|
||||||
@click="displayModalAdd(true)"
|
:icon="IconPlus"
|
||||||
/>
|
@click="displayModalAdd(true)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-if="!(filteredCollections.length !== 0 || collections.length === 0)"
|
v-if="!(filteredCollections.length !== 0 || collections.length === 0)"
|
||||||
:text="`${t('state.nothing_found')} ‟${filterText}”`"
|
:text="`${t('state.nothing_found')} ‟${filterText}”`"
|
||||||
>
|
>
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
</template>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<CollectionsGraphqlAdd
|
<CollectionsGraphqlAdd
|
||||||
|
|||||||
@@ -22,7 +22,7 @@
|
|||||||
v-model="filterTexts"
|
v-model="filterTexts"
|
||||||
type="search"
|
type="search"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
class="flex w-full bg-transparent px-4 py-2"
|
class="flex w-full bg-transparent px-4 py-2 h-8"
|
||||||
:placeholder="t('action.search')"
|
:placeholder="t('action.search')"
|
||||||
:disabled="collectionsType.type === 'team-collections'"
|
:disabled="collectionsType.type === 'team-collections'"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -11,7 +11,9 @@
|
|||||||
v-if="!currentInterceptorSupportsCookies"
|
v-if="!currentInterceptorSupportsCookies"
|
||||||
:text="t('cookies.modal.interceptor_no_support')"
|
:text="t('cookies.modal.interceptor_no_support')"
|
||||||
>
|
>
|
||||||
<AppInterceptor class="rounded border border-dividerLight p-2" />
|
<template #body>
|
||||||
|
<AppInterceptor class="rounded border border-dividerLight p-2" />
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else class="flex flex-col">
|
<div v-else class="flex flex-col">
|
||||||
<div
|
<div
|
||||||
@@ -38,8 +40,7 @@
|
|||||||
:alt="`${t('cookies.modal.empty_domains')}`"
|
:alt="`${t('cookies.modal.empty_domains')}`"
|
||||||
:text="t('cookies.modal.empty_domains')"
|
:text="t('cookies.modal.empty_domains')"
|
||||||
class="mt-6"
|
class="mt-6"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
<div
|
<div
|
||||||
v-for="[domain, entries] in workingCookieJar.entries()"
|
v-for="[domain, entries] in workingCookieJar.entries()"
|
||||||
v-else
|
v-else
|
||||||
|
|||||||
@@ -93,20 +93,12 @@
|
|||||||
}
|
}
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
<div
|
<HoppSmartPlaceholder
|
||||||
v-if="myEnvironments.length === 0"
|
v-if="myEnvironments.length === 0"
|
||||||
class="flex flex-col items-center justify-center text-secondaryLight"
|
:src="`/images/states/${colorMode.value}/blockchain.svg`"
|
||||||
>
|
:alt="`${t('empty.environments')}`"
|
||||||
<img
|
:text="t('empty.environments')"
|
||||||
:src="`/images/states/${colorMode.value}/blockchain.svg`"
|
/>
|
||||||
loading="lazy"
|
|
||||||
class="mb-2 inline-flex h-16 w-16 flex-col object-contain object-center"
|
|
||||||
:alt="`${t('empty.environments')}`"
|
|
||||||
/>
|
|
||||||
<span class="pb-2 text-center">
|
|
||||||
{{ t("empty.environments") }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</HoppSmartTab>
|
</HoppSmartTab>
|
||||||
<HoppSmartTab
|
<HoppSmartTab
|
||||||
:id="'team-environments'"
|
:id="'team-environments'"
|
||||||
@@ -140,20 +132,12 @@
|
|||||||
}
|
}
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
<div
|
<HoppSmartPlaceholder
|
||||||
v-if="teamEnvironmentList.length === 0"
|
v-if="teamEnvironmentList.length === 0"
|
||||||
class="flex flex-col items-center justify-center text-secondaryLight"
|
:src="`/images/states/${colorMode.value}/blockchain.svg`"
|
||||||
>
|
:alt="`${t('empty.environments')}`"
|
||||||
<img
|
:text="t('empty.environments')"
|
||||||
:src="`/images/states/${colorMode.value}/blockchain.svg`"
|
/>
|
||||||
loading="lazy"
|
|
||||||
class="mb-2 inline-flex h-16 w-16 flex-col object-contain object-center"
|
|
||||||
:alt="`${t('empty.environments')}`"
|
|
||||||
/>
|
|
||||||
<span class="pb-2 text-center">
|
|
||||||
{{ t("empty.environments") }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-if="!teamListLoading && teamAdapterError"
|
v-if="!teamListLoading && teamAdapterError"
|
||||||
|
|||||||
@@ -78,11 +78,13 @@
|
|||||||
:alt="`${t('empty.environments')}`"
|
:alt="`${t('empty.environments')}`"
|
||||||
:text="t('empty.environments')"
|
:text="t('empty.environments')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="`${t('add.new')}`"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
@click="addEnvironmentVariable"
|
filled
|
||||||
/>
|
@click="addEnvironmentVariable"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -38,27 +38,29 @@
|
|||||||
:alt="`${t('empty.environments')}`"
|
:alt="`${t('empty.environments')}`"
|
||||||
:text="t('empty.environments')"
|
:text="t('empty.environments')"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col items-center space-y-4">
|
<template #body>
|
||||||
<span class="text-center text-secondaryLight">
|
<div class="flex flex-col items-center space-y-4">
|
||||||
{{ t("environment.import_or_create") }}
|
<span class="text-center text-secondaryLight">
|
||||||
</span>
|
{{ t("environment.import_or_create") }}
|
||||||
<div class="flex flex-col items-stretch gap-4">
|
</span>
|
||||||
<HoppButtonPrimary
|
<div class="flex flex-col items-stretch gap-4">
|
||||||
:icon="IconImport"
|
<HoppButtonPrimary
|
||||||
:label="t('import.title')"
|
:icon="IconImport"
|
||||||
filled
|
:label="t('import.title')"
|
||||||
outline
|
filled
|
||||||
@click="displayModalImportExport(true)"
|
outline
|
||||||
/>
|
@click="displayModalImportExport(true)"
|
||||||
<HoppButtonSecondary
|
/>
|
||||||
:icon="IconPlus"
|
<HoppButtonSecondary
|
||||||
:label="`${t('add.new')}`"
|
:icon="IconPlus"
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
outline
|
filled
|
||||||
@click="displayModalAdd(true)"
|
outline
|
||||||
/>
|
@click="displayModalAdd(true)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<EnvironmentsMyDetails
|
<EnvironmentsMyDetails
|
||||||
:show="showModalDetails"
|
:show="showModalDetails"
|
||||||
|
|||||||
@@ -81,18 +81,20 @@
|
|||||||
:alt="`${t('empty.environments')}`"
|
:alt="`${t('empty.environments')}`"
|
||||||
:text="t('empty.environments')"
|
:text="t('empty.environments')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
v-if="isViewer"
|
<HoppButtonSecondary
|
||||||
disabled
|
v-if="isViewer"
|
||||||
:label="`${t('add.new')}`"
|
disabled
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
/>
|
filled
|
||||||
<HoppButtonSecondary
|
/>
|
||||||
v-else
|
<HoppButtonSecondary
|
||||||
:label="`${t('add.new')}`"
|
v-else
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
@click="addEnvironmentVariable"
|
filled
|
||||||
/>
|
@click="addEnvironmentVariable"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -49,31 +49,33 @@
|
|||||||
:alt="`${t('empty.environments')}`"
|
:alt="`${t('empty.environments')}`"
|
||||||
:text="t('empty.environments')"
|
:text="t('empty.environments')"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col items-center space-y-4">
|
<template #body>
|
||||||
<span class="text-center text-secondaryLight">
|
<div class="flex flex-col items-center space-y-4">
|
||||||
{{ t("environment.import_or_create") }}
|
<span class="text-center text-secondaryLight">
|
||||||
</span>
|
{{ t("environment.import_or_create") }}
|
||||||
<div class="flex flex-col items-stretch gap-4">
|
</span>
|
||||||
<HoppButtonPrimary
|
<div class="flex flex-col items-stretch gap-4">
|
||||||
:icon="IconImport"
|
<HoppButtonPrimary
|
||||||
:label="t('import.title')"
|
:icon="IconImport"
|
||||||
filled
|
:label="t('import.title')"
|
||||||
outline
|
filled
|
||||||
:title="isTeamViewer ? t('team.no_access') : ''"
|
outline
|
||||||
:disabled="isTeamViewer"
|
:title="isTeamViewer ? t('team.no_access') : ''"
|
||||||
@click="isTeamViewer ? null : displayModalImportExport(true)"
|
:disabled="isTeamViewer"
|
||||||
/>
|
@click="isTeamViewer ? null : displayModalImportExport(true)"
|
||||||
<HoppButtonSecondary
|
/>
|
||||||
:label="`${t('add.new')}`"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
outline
|
filled
|
||||||
:icon="IconPlus"
|
outline
|
||||||
:title="isTeamViewer ? t('team.no_access') : ''"
|
:icon="IconPlus"
|
||||||
:disabled="isTeamViewer"
|
:title="isTeamViewer ? t('team.no_access') : ''"
|
||||||
@click="isTeamViewer ? null : displayModalAdd(true)"
|
:disabled="isTeamViewer"
|
||||||
/>
|
@click="isTeamViewer ? null : displayModalAdd(true)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else-if="!loading">
|
<div v-else-if="!loading">
|
||||||
<EnvironmentsTeamsEnvironment
|
<EnvironmentsTeamsEnvironment
|
||||||
|
|||||||
@@ -120,14 +120,16 @@
|
|||||||
:alt="`${t('empty.authorization')}`"
|
:alt="`${t('empty.authorization')}`"
|
||||||
:text="t('empty.authorization')"
|
:text="t('empty.authorization')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
outline
|
<HoppButtonSecondary
|
||||||
:label="t('app.documentation')"
|
outline
|
||||||
to="https://docs.hoppscotch.io/documentation/features/authorization"
|
:label="t('app.documentation')"
|
||||||
blank
|
to="https://docs.hoppscotch.io/documentation/features/authorization"
|
||||||
:icon="IconExternalLink"
|
blank
|
||||||
reverse
|
:icon="IconExternalLink"
|
||||||
/>
|
reverse
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else class="flex flex-1 border-b border-dividerLight">
|
<div v-else class="flex flex-1 border-b border-dividerLight">
|
||||||
<div class="w-2/3 border-r border-dividerLight">
|
<div class="w-2/3 border-r border-dividerLight">
|
||||||
|
|||||||
@@ -162,12 +162,14 @@
|
|||||||
:alt="`${t('empty.headers')}`"
|
:alt="`${t('empty.headers')}`"
|
||||||
:text="t('empty.headers')"
|
:text="t('empty.headers')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="`${t('add.new')}`"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
:icon="IconPlus"
|
filled
|
||||||
@click="addHeader"
|
:icon="IconPlus"
|
||||||
/>
|
@click="addHeader"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -20,8 +20,7 @@
|
|||||||
:src="`/images/states/${colorMode.value}/add_comment.svg`"
|
:src="`/images/states/${colorMode.value}/add_comment.svg`"
|
||||||
:alt="`${t('empty.documentation')}`"
|
:alt="`${t('empty.documentation')}`"
|
||||||
:text="t('empty.documentation')"
|
:text="t('empty.documentation')"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div
|
<div
|
||||||
class="sticky top-0 z-10 flex flex-shrink-0 overflow-x-auto bg-primary"
|
class="sticky top-0 z-10 flex flex-shrink-0 overflow-x-auto bg-primary"
|
||||||
@@ -30,7 +29,7 @@
|
|||||||
v-model="graphqlFieldsFilterText"
|
v-model="graphqlFieldsFilterText"
|
||||||
type="search"
|
type="search"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
class="flex w-full bg-transparent px-4 py-2"
|
class="flex w-full bg-transparent px-4 py-2 h-8"
|
||||||
:placeholder="`${t('action.search')}`"
|
:placeholder="`${t('action.search')}`"
|
||||||
/>
|
/>
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
v-model="filterText"
|
v-model="filterText"
|
||||||
type="search"
|
type="search"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
class="flex w-full bg-transparent px-4 py-2"
|
class="flex w-full bg-transparent px-4 py-2 h-8"
|
||||||
:placeholder="`${t('action.search')}`"
|
:placeholder="`${t('action.search')}`"
|
||||||
/>
|
/>
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
@@ -114,8 +114,7 @@
|
|||||||
:src="`/images/states/${colorMode.value}/history.svg`"
|
:src="`/images/states/${colorMode.value}/history.svg`"
|
||||||
:alt="`${t('empty.history')}`"
|
:alt="`${t('empty.history')}`"
|
||||||
:text="t('empty.history')"
|
:text="t('empty.history')"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-else-if="
|
v-else-if="
|
||||||
Object.keys(filteredHistoryGroups).length === 0 ||
|
Object.keys(filteredHistoryGroups).length === 0 ||
|
||||||
@@ -124,18 +123,20 @@
|
|||||||
:text="`${t('state.nothing_found')} ‟${filterText || filterSelection}”`"
|
:text="`${t('state.nothing_found')} ‟${filterText || filterSelection}”`"
|
||||||
>
|
>
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
|
</template>
|
||||||
|
<template #body>
|
||||||
|
<HoppButtonSecondary
|
||||||
|
:label="t('action.clear')"
|
||||||
|
outline
|
||||||
|
@click="
|
||||||
|
() => {
|
||||||
|
filterText = ''
|
||||||
|
filterSelection = 'ALL'
|
||||||
|
}
|
||||||
|
"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
<HoppButtonSecondary
|
|
||||||
:label="t('action.clear')"
|
|
||||||
outline
|
|
||||||
@click="
|
|
||||||
() => {
|
|
||||||
filterText = ''
|
|
||||||
filterSelection = 'ALL'
|
|
||||||
}
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartConfirmModal
|
<HoppSmartConfirmModal
|
||||||
:show="confirmRemove"
|
:show="confirmRemove"
|
||||||
|
|||||||
@@ -119,14 +119,16 @@
|
|||||||
:alt="`${t('empty.authorization')}`"
|
:alt="`${t('empty.authorization')}`"
|
||||||
:text="t('empty.authorization')"
|
:text="t('empty.authorization')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
outline
|
<HoppButtonSecondary
|
||||||
:label="t('app.documentation')"
|
outline
|
||||||
to="https://docs.hoppscotch.io/documentation/features/authorization"
|
:label="t('app.documentation')"
|
||||||
blank
|
to="https://docs.hoppscotch.io/documentation/features/authorization"
|
||||||
:icon="IconExternalLink"
|
blank
|
||||||
reverse
|
:icon="IconExternalLink"
|
||||||
/>
|
reverse
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else class="flex flex-1 border-b border-dividerLight">
|
<div v-else class="flex flex-1 border-b border-dividerLight">
|
||||||
<div class="w-2/3 border-r border-dividerLight">
|
<div class="w-2/3 border-r border-dividerLight">
|
||||||
|
|||||||
@@ -112,14 +112,16 @@
|
|||||||
:alt="`${t('empty.body')}`"
|
:alt="`${t('empty.body')}`"
|
||||||
:text="t('empty.body')"
|
:text="t('empty.body')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
outline
|
<HoppButtonSecondary
|
||||||
:label="`${t('app.documentation')}`"
|
outline
|
||||||
to="https://docs.hoppscotch.io/documentation/getting-started/rest/uploading-data"
|
:label="`${t('app.documentation')}`"
|
||||||
blank
|
to="https://docs.hoppscotch.io/documentation/getting-started/rest/uploading-data"
|
||||||
:icon="IconExternalLink"
|
blank
|
||||||
reverse
|
:icon="IconExternalLink"
|
||||||
/>
|
reverse
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -158,12 +158,14 @@
|
|||||||
:alt="`${t('empty.body')}`"
|
:alt="`${t('empty.body')}`"
|
||||||
:text="t('empty.body')"
|
:text="t('empty.body')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="`${t('add.new')}`"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="`${t('add.new')}`"
|
||||||
:icon="IconPlus"
|
filled
|
||||||
@click="addBodyParam"
|
:icon="IconPlus"
|
||||||
/>
|
@click="addBodyParam"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -61,7 +61,7 @@
|
|||||||
:text="`${t('state.nothing_found')} ‟${searchQuery}”`"
|
:text="`${t('state.nothing_found')} ‟${searchQuery}”`"
|
||||||
>
|
>
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
</template>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -209,12 +209,14 @@
|
|||||||
:alt="`${t('empty.headers')}`"
|
:alt="`${t('empty.headers')}`"
|
||||||
:text="t('empty.headers')"
|
:text="t('empty.headers')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
filled
|
<HoppButtonSecondary
|
||||||
:label="`${t('add.new')}`"
|
filled
|
||||||
:icon="IconPlus"
|
:label="`${t('add.new')}`"
|
||||||
@click="addHeader"
|
:icon="IconPlus"
|
||||||
/>
|
@click="addHeader"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -157,12 +157,14 @@
|
|||||||
:alt="`${t('empty.parameters')}`"
|
:alt="`${t('empty.parameters')}`"
|
||||||
:text="t('empty.parameters')"
|
:text="t('empty.parameters')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="`${t('add.new')}`"
|
<HoppButtonSecondary
|
||||||
:icon="IconPlus"
|
:label="`${t('add.new')}`"
|
||||||
filled
|
:icon="IconPlus"
|
||||||
@click="addParam"
|
filled
|
||||||
/>
|
@click="addParam"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -37,7 +37,9 @@
|
|||||||
:text="t('helpers.network_fail')"
|
:text="t('helpers.network_fail')"
|
||||||
large
|
large
|
||||||
>
|
>
|
||||||
<AppInterceptor class="rounded border border-dividerLight p-2" />
|
<template #body>
|
||||||
|
<AppInterceptor class="rounded border border-dividerLight p-2" />
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-if="response.type === 'script_fail'"
|
v-if="response.type === 'script_fail'"
|
||||||
@@ -47,12 +49,14 @@
|
|||||||
:text="t('helpers.script_fail')"
|
:text="t('helpers.script_fail')"
|
||||||
large
|
large
|
||||||
>
|
>
|
||||||
<div
|
<template #body>
|
||||||
class="mt-2 w-full overflow-auto whitespace-normal rounded bg-primaryLight px-4 py-2 font-mono text-red-400"
|
<div
|
||||||
>
|
class="mt-2 w-full overflow-auto whitespace-normal rounded bg-primaryLight px-4 py-2 font-mono text-red-400"
|
||||||
{{ response.error.name }}: {{ response.error.message }}<br />
|
>
|
||||||
{{ response.error.stack }}
|
{{ response.error.name }}: {{ response.error.message }}<br />
|
||||||
</div>
|
{{ response.error.stack }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div
|
<div
|
||||||
v-if="response.type === 'success' || response.type === 'fail'"
|
v-if="response.type === 'success' || response.type === 'fail'"
|
||||||
|
|||||||
@@ -159,8 +159,7 @@
|
|||||||
:alt="`${t('error.test_script_fail')}`"
|
:alt="`${t('error.test_script_fail')}`"
|
||||||
:heading="t('error.test_script_fail')"
|
:heading="t('error.test_script_fail')"
|
||||||
:text="t('helpers.test_script_fail')"
|
:text="t('helpers.test_script_fail')"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
<HoppSmartPlaceholder
|
<HoppSmartPlaceholder
|
||||||
v-else
|
v-else
|
||||||
:src="`/images/states/${colorMode.value}/validation.svg`"
|
:src="`/images/states/${colorMode.value}/validation.svg`"
|
||||||
@@ -168,15 +167,16 @@
|
|||||||
:heading="t('empty.tests')"
|
:heading="t('empty.tests')"
|
||||||
:text="t('helpers.tests')"
|
:text="t('helpers.tests')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
outline
|
<HoppButtonSecondary
|
||||||
:label="`${t('action.learn_more')}`"
|
outline
|
||||||
to="https://docs.hoppscotch.io/documentation/getting-started/rest/tests"
|
:label="`${t('action.learn_more')}`"
|
||||||
blank
|
to="https://docs.hoppscotch.io/documentation/getting-started/rest/tests"
|
||||||
:icon="IconExternalLink"
|
blank
|
||||||
reverse
|
:icon="IconExternalLink"
|
||||||
class="my-4"
|
reverse
|
||||||
/>
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<EnvironmentsMyDetails
|
<EnvironmentsMyDetails
|
||||||
:show="showMyEnvironmentDetailsModal"
|
:show="showMyEnvironmentDetailsModal"
|
||||||
|
|||||||
@@ -149,12 +149,14 @@
|
|||||||
:alt="`${t('empty.body')}`"
|
:alt="`${t('empty.body')}`"
|
||||||
:text="t('empty.body')"
|
:text="t('empty.body')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
filled
|
<HoppButtonSecondary
|
||||||
:label="`${t('add.new')}`"
|
filled
|
||||||
:icon="IconPlus"
|
:label="`${t('add.new')}`"
|
||||||
@click="addUrlEncodedParam"
|
:icon="IconPlus"
|
||||||
/>
|
@click="addUrlEncodedParam"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -5,55 +5,57 @@
|
|||||||
:heading="t('error.network_fail')"
|
:heading="t('error.network_fail')"
|
||||||
large
|
large
|
||||||
>
|
>
|
||||||
<div class="my-1 flex flex-col items-center text-secondaryLight">
|
<template #body>
|
||||||
<span>
|
<div class="my-1 flex flex-col items-center text-secondaryLight">
|
||||||
{{ t("error.please_install_extension") }}
|
<span>
|
||||||
</span>
|
{{ t("error.please_install_extension") }}
|
||||||
<span>
|
</span>
|
||||||
{{ t("error.check_how_to_add_origin") }}
|
<span>
|
||||||
<HoppSmartLink
|
{{ t("error.check_how_to_add_origin") }}
|
||||||
blank
|
<HoppSmartLink
|
||||||
to="https://docs.hoppscotch.io/documentation/features/interceptor#browser-extension"
|
blank
|
||||||
class="text-accent hover:text-accentDark"
|
to="https://docs.hoppscotch.io/documentation/features/interceptor#browser-extension"
|
||||||
>
|
class="text-accent hover:text-accentDark"
|
||||||
here
|
>
|
||||||
</HoppSmartLink>
|
here
|
||||||
</span>
|
</HoppSmartLink>
|
||||||
</div>
|
</span>
|
||||||
<div class="flex flex-col space-y-2 py-4">
|
|
||||||
<span>
|
|
||||||
<HoppSmartItem
|
|
||||||
to="https://chrome.google.com/webstore/detail/hoppscotch-browser-extens/amknoiejhlmhancpahfcfcfhllgkpbld"
|
|
||||||
blank
|
|
||||||
:icon="IconChrome"
|
|
||||||
label="Chrome"
|
|
||||||
:info-icon="hasChromeExtInstalled ? IconCheckCircle : null"
|
|
||||||
:active-info-icon="hasChromeExtInstalled"
|
|
||||||
outline
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
<span>
|
|
||||||
<HoppSmartItem
|
|
||||||
to="https://addons.mozilla.org/en-US/firefox/addon/hoppscotch"
|
|
||||||
blank
|
|
||||||
:icon="IconFirefox"
|
|
||||||
label="Firefox"
|
|
||||||
:info-icon="hasFirefoxExtInstalled ? IconCheckCircle : null"
|
|
||||||
:active-info-icon="hasFirefoxExtInstalled"
|
|
||||||
outline
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-4 py-4">
|
|
||||||
<div class="flex items-center">
|
|
||||||
<HoppSmartToggle
|
|
||||||
:on="extensionEnabled"
|
|
||||||
@change="extensionEnabled = !extensionEnabled"
|
|
||||||
>
|
|
||||||
{{ t("settings.extensions_use_toggle") }}
|
|
||||||
</HoppSmartToggle>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="flex flex-col space-y-2 py-4">
|
||||||
|
<span>
|
||||||
|
<HoppSmartItem
|
||||||
|
to="https://chrome.google.com/webstore/detail/hoppscotch-browser-extens/amknoiejhlmhancpahfcfcfhllgkpbld"
|
||||||
|
blank
|
||||||
|
:icon="IconChrome"
|
||||||
|
label="Chrome"
|
||||||
|
:info-icon="hasChromeExtInstalled ? IconCheckCircle : null"
|
||||||
|
:active-info-icon="hasChromeExtInstalled"
|
||||||
|
outline
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
<span>
|
||||||
|
<HoppSmartItem
|
||||||
|
to="https://addons.mozilla.org/en-US/firefox/addon/hoppscotch"
|
||||||
|
blank
|
||||||
|
:icon="IconFirefox"
|
||||||
|
label="Firefox"
|
||||||
|
:info-icon="hasFirefoxExtInstalled ? IconCheckCircle : null"
|
||||||
|
:active-info-icon="hasFirefoxExtInstalled"
|
||||||
|
outline
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-4 py-4">
|
||||||
|
<div class="flex items-center">
|
||||||
|
<HoppSmartToggle
|
||||||
|
:on="extensionEnabled"
|
||||||
|
@change="extensionEnabled = !extensionEnabled"
|
||||||
|
>
|
||||||
|
{{ t("settings.extensions_use_toggle") }}
|
||||||
|
</HoppSmartToggle>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -32,10 +32,12 @@
|
|||||||
:alt="`${t('empty.shared_requests_logout')}`"
|
:alt="`${t('empty.shared_requests_logout')}`"
|
||||||
:text="`${t('empty.shared_requests_logout')}`"
|
:text="`${t('empty.shared_requests_logout')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonPrimary
|
<template #body>
|
||||||
:label="t('auth.login')"
|
<HoppButtonPrimary
|
||||||
@click="invokeAction('modals.login.toggle')"
|
:label="t('auth.login')"
|
||||||
/>
|
@click="invokeAction('modals.login.toggle')"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
|
|
||||||
<template v-else-if="sharedRequests.length">
|
<template v-else-if="sharedRequests.length">
|
||||||
|
|||||||
@@ -60,7 +60,7 @@
|
|||||||
:text="`${t('state.nothing_found')} ‟${searchQuery}”`"
|
:text="`${t('state.nothing_found')} ‟${searchQuery}”`"
|
||||||
>
|
>
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<icon-lucide-search class="svg-icons pb-2 opacity-75" />
|
<icon-lucide-search class="svg-icons opacity-75" />
|
||||||
</template>
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -45,15 +45,17 @@
|
|||||||
:alt="`${t('empty.members')}`"
|
:alt="`${t('empty.members')}`"
|
||||||
:text="t('empty.members')"
|
:text="t('empty.members')"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:icon="IconUserPlus"
|
<HoppButtonSecondary
|
||||||
:label="t('team.invite')"
|
:icon="IconUserPlus"
|
||||||
@click="
|
:label="t('team.invite')"
|
||||||
() => {
|
@click="
|
||||||
emit('invite-team')
|
() => {
|
||||||
}
|
emit('invite-team')
|
||||||
"
|
}
|
||||||
/>
|
"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else class="divide-y divide-dividerLight">
|
<div v-else class="divide-y divide-dividerLight">
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -125,8 +125,7 @@
|
|||||||
pendingInvites.data.right.team?.teamInvitations.length === 0
|
pendingInvites.data.right.team?.teamInvitations.length === 0
|
||||||
"
|
"
|
||||||
:text="t('empty.pending_invites')"
|
:text="t('empty.pending_invites')"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
<div
|
<div
|
||||||
v-if="!pendingInvites.loading && E.isLeft(pendingInvites.data)"
|
v-if="!pendingInvites.loading && E.isLeft(pendingInvites.data)"
|
||||||
class="flex flex-col items-center p-4"
|
class="flex flex-col items-center p-4"
|
||||||
@@ -245,11 +244,13 @@
|
|||||||
:alt="`${t('empty.invites')}`"
|
:alt="`${t('empty.invites')}`"
|
||||||
:text="`${t('empty.invites')}`"
|
:text="`${t('empty.invites')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="t('add.new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('add.new')"
|
||||||
@click="addNewInvitee"
|
filled
|
||||||
/>
|
@click="addNewInvitee"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -16,11 +16,13 @@
|
|||||||
:alt="`${t('empty.teams')}`"
|
:alt="`${t('empty.teams')}`"
|
||||||
:text="`${t('empty.teams')}`"
|
:text="`${t('empty.teams')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="`${t('team.create_new')}`"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="`${t('team.create_new')}`"
|
||||||
@click="displayModalAdd(true)"
|
filled
|
||||||
/>
|
@click="displayModalAdd(true)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div
|
<div
|
||||||
v-else-if="!loading"
|
v-else-if="!loading"
|
||||||
|
|||||||
@@ -21,13 +21,15 @@
|
|||||||
:alt="`${t('empty.teams')}`"
|
:alt="`${t('empty.teams')}`"
|
||||||
:text="`${t('empty.teams')}`"
|
:text="`${t('empty.teams')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="t('team.create_new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('team.create_new')"
|
||||||
outline
|
filled
|
||||||
:icon="IconPlus"
|
outline
|
||||||
@click="displayModalAdd(true)"
|
:icon="IconPlus"
|
||||||
/>
|
@click="displayModalAdd(true)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else-if="!loading" class="flex flex-col">
|
<div v-else-if="!loading" class="flex flex-col">
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -14,10 +14,12 @@
|
|||||||
:alt="`${t('empty.profile')}`"
|
:alt="`${t('empty.profile')}`"
|
||||||
:text="`${t('empty.profile')}`"
|
:text="`${t('empty.profile')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonPrimary
|
<template #body>
|
||||||
:label="t('auth.login')"
|
<HoppButtonPrimary
|
||||||
@click="invokeAction('modals.login.toggle')"
|
:label="t('auth.login')"
|
||||||
/>
|
@click="invokeAction('modals.login.toggle')"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else class="space-y-8">
|
<div v-else class="space-y-8">
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -142,12 +142,14 @@
|
|||||||
:alt="`${t('empty.subscription')}`"
|
:alt="`${t('empty.subscription')}`"
|
||||||
:text="`${t('empty.subscription')}`"
|
:text="`${t('empty.subscription')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:label="t('mqtt.new')"
|
<HoppButtonSecondary
|
||||||
filled
|
:label="t('mqtt.new')"
|
||||||
outline
|
filled
|
||||||
@click="showSubscriptionModal(true)"
|
outline
|
||||||
/>
|
@click="showSubscriptionModal(true)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -197,14 +197,16 @@
|
|||||||
:alt="`${t('socketio.connection_not_authorized')}`"
|
:alt="`${t('socketio.connection_not_authorized')}`"
|
||||||
:text="`${t('socketio.connection_not_authorized')}`"
|
:text="`${t('socketio.connection_not_authorized')}`"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
outline
|
<HoppButtonSecondary
|
||||||
:label="t('app.documentation')"
|
outline
|
||||||
to="https://docs.hoppscotch.io/documentation/features/authorization"
|
:label="t('app.documentation')"
|
||||||
blank
|
to="https://docs.hoppscotch.io/documentation/features/authorization"
|
||||||
:icon="IconExternalLink"
|
blank
|
||||||
reverse
|
:icon="IconExternalLink"
|
||||||
/>
|
reverse
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div
|
<div
|
||||||
v-if="authType === 'Bearer'"
|
v-if="authType === 'Bearer'"
|
||||||
|
|||||||
@@ -163,8 +163,7 @@
|
|||||||
:src="`/images/states/${colorMode.value}/add_category.svg`"
|
:src="`/images/states/${colorMode.value}/add_category.svg`"
|
||||||
:alt="`${t('empty.protocols')}`"
|
:alt="`${t('empty.protocols')}`"
|
||||||
:text="`${t('empty.protocols')}`"
|
:text="`${t('empty.protocols')}`"
|
||||||
>
|
/>
|
||||||
</HoppSmartPlaceholder>
|
|
||||||
</HoppSmartTab>
|
</HoppSmartTab>
|
||||||
</HoppSmartTabs>
|
</HoppSmartTabs>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -117,7 +117,13 @@
|
|||||||
alt="No invites"
|
alt="No invites"
|
||||||
text="No invites"
|
text="No invites"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary label="Add new" filled @click="addNewMember" />
|
<template #body>
|
||||||
|
<HoppButtonSecondary
|
||||||
|
label="Add new"
|
||||||
|
filled
|
||||||
|
@click="addNewMember"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -15,15 +15,17 @@
|
|||||||
v-if="team?.teamMembers?.length === 0"
|
v-if="team?.teamMembers?.length === 0"
|
||||||
text="No members in this team. Add members to this team to collaborate"
|
text="No members in this team. Add members to this team to collaborate"
|
||||||
>
|
>
|
||||||
<HoppButtonSecondary
|
<template #body>
|
||||||
:icon="IconUserPlus"
|
<HoppButtonSecondary
|
||||||
:label="t('teams.add_members')"
|
:icon="IconUserPlus"
|
||||||
@click="
|
:label="t('teams.add_members')"
|
||||||
() => {
|
@click="
|
||||||
showInvite = !showInvite;
|
() => {
|
||||||
}
|
showInvite = !showInvite;
|
||||||
"
|
}
|
||||||
/>
|
"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
<div v-else class="divide-y divide-dividerLight">
|
<div v-else class="divide-y divide-dividerLight">
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -41,10 +41,12 @@
|
|||||||
v-if="team && pendingInvites?.length === 0"
|
v-if="team && pendingInvites?.length === 0"
|
||||||
text="No pending invites"
|
text="No pending invites"
|
||||||
>
|
>
|
||||||
<div v-if="!fetching && error" class="flex flex-col items-center p-4">
|
<template #body>
|
||||||
<icon-lucide-help-circle class="mb-4 svg-icons" />
|
<div v-if="!fetching && error" class="flex flex-col items-center p-4">
|
||||||
Something went wrong. Please try again later.
|
<icon-lucide-help-circle class="mb-4 svg-icons" />
|
||||||
</div>
|
{{ t('error.something_went_wrong') }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</HoppSmartPlaceholder>
|
</HoppSmartPlaceholder>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -4,24 +4,29 @@
|
|||||||
v-if="src"
|
v-if="src"
|
||||||
:src="src"
|
:src="src"
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
class="inline-flex flex-col object-contain object-center mb-4"
|
class="inline-flex flex-col object-contain object-center"
|
||||||
:class="large ? 'w-32 h-32' : 'w-16 h-16'"
|
:class="large ? 'w-32 h-32' : 'w-16 h-16'"
|
||||||
:alt="alt"
|
:alt="alt"
|
||||||
/>
|
/>
|
||||||
<slot name="icon"></slot>
|
<slot name="icon"></slot>
|
||||||
<span v-if="heading" class="mb-2 font-semibold text-center">
|
<span v-if="heading" class="font-semibold mt-2 text-center">
|
||||||
{{ heading }}
|
{{ heading }}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="max-w-sm mb-4 text-center whitespace-normal text-secondaryLight"
|
v-if="text"
|
||||||
|
class="max-w-sm mt-2 text-center whitespace-normal text-secondaryLight text-tiny"
|
||||||
>
|
>
|
||||||
{{ text }}
|
{{ text }}
|
||||||
</span>
|
</span>
|
||||||
<slot></slot>
|
<div v-if="hasBody" class="mt-4">
|
||||||
|
<slot name="body"></slot>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { computed, useSlots } from "vue"
|
||||||
|
|
||||||
withDefaults(
|
withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
src?: string
|
src?: string
|
||||||
@@ -35,4 +40,10 @@ withDefaults(
|
|||||||
text: "",
|
text: "",
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const slots = useSlots()
|
||||||
|
|
||||||
|
const hasBody = computed(() => {
|
||||||
|
return !!slots.body
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user