mirror of
https://github.com/t8y2/dbx.git
synced 2026-10-23 22:48:18 +00:00
fix(desktop): swap import/export connection icons and add import tooltip
Import now uses Download icon and Export uses Upload icon (they were reversed). Also wrapped the import dropdown in a styled Tooltip to match the export button's hover behavior.
This commit is contained in:
@@ -66,26 +66,32 @@ defineExpose({ focusSearch });
|
||||
t("sidebar.connections")
|
||||
}}</span>
|
||||
<span class="flex-1 self-stretch" data-tauri-drag-region />
|
||||
<LightDropdown
|
||||
model-value=""
|
||||
:items="importSourceItems"
|
||||
:aria-label="t('sidebar.import')"
|
||||
:trigger-title="t('sidebar.import')"
|
||||
:trigger-icon="Upload"
|
||||
trigger-class="inline-flex h-6 w-5 items-center justify-center rounded-md outline-none hover:bg-muted hover:text-foreground focus-visible:ring-0"
|
||||
trigger-icon-class="h-4 w-4"
|
||||
content-class="w-44"
|
||||
:show-trigger-label="false"
|
||||
:show-chevron="false"
|
||||
:highlight-selected="false"
|
||||
check-position="none"
|
||||
align="end"
|
||||
@update:model-value="(source) => emit('import', source as 'dbx' | 'navicat' | 'dbeaver')"
|
||||
/>
|
||||
<Tooltip>
|
||||
<TooltipTrigger as-child>
|
||||
<span class="inline-flex">
|
||||
<LightDropdown
|
||||
model-value=""
|
||||
:items="importSourceItems"
|
||||
:aria-label="t('sidebar.import')"
|
||||
:trigger-icon="Download"
|
||||
trigger-class="inline-flex h-6 w-5 items-center justify-center rounded-md outline-none hover:bg-muted hover:text-foreground focus-visible:ring-0"
|
||||
trigger-icon-class="h-4 w-4"
|
||||
content-class="w-44"
|
||||
:show-trigger-label="false"
|
||||
:show-chevron="false"
|
||||
:highlight-selected="false"
|
||||
check-position="none"
|
||||
align="end"
|
||||
@update:model-value="(source) => emit('import', source as 'dbx' | 'navicat' | 'dbeaver')"
|
||||
/>
|
||||
</span>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>{{ t("sidebar.import") }}</TooltipContent>
|
||||
</Tooltip>
|
||||
<Tooltip>
|
||||
<TooltipTrigger as-child>
|
||||
<Button variant="ghost" size="icon" class="h-5 w-5" @click="emit('export')">
|
||||
<Download class="h-3 w-3" />
|
||||
<Upload class="h-3 w-3" />
|
||||
</Button>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>{{ t("sidebar.export") }}</TooltipContent>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { FilePlus2, Plus, History, Upload, Database, Search, ShieldCheck, Sparkles } from "@lucide/vue";
|
||||
import { FilePlus2, Plus, History, Download, Database, Search, ShieldCheck, Sparkles } from "@lucide/vue";
|
||||
import DatabaseIcon from "@/components/icons/DatabaseIcon.vue";
|
||||
import {
|
||||
connectionDriverLabel,
|
||||
@@ -110,7 +110,7 @@ const { t } = useI18n();
|
||||
class="flex items-center gap-2 rounded-md px-3 py-2 text-left text-sm hover:bg-muted/50"
|
||||
@click="emit('import-config')"
|
||||
>
|
||||
<Upload class="h-4 w-4" /> {{ t("sidebar.import") }}
|
||||
<Download class="h-4 w-4" /> {{ t("sidebar.import") }}
|
||||
</button>
|
||||
<div class="mt-2 rounded-md bg-muted/30 px-3 py-2 text-xs leading-5 text-muted-foreground">
|
||||
<Search class="mr-1 inline h-3.5 w-3.5" />
|
||||
|
||||
Reference in New Issue
Block a user