github/dbx
4
0 Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-11-15 14:52:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(connection): allow revealing saved passwords

Browse Source
This commit is contained in:
t8y2 committed 2026-07-02 02:49:02 +08:00
1 parent d55a708d6a
commit 609f2ef7c7
11 files changed
+588 -436
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

apps/desktop/src/components/connection/ConnectionDialog.vue
+4 -4
View File
@@ -3482,7 +3482,7 @@ function openExternalUrl(url: string) {
<template v-if="mqAuthKind === 'token'">
<div class="grid grid-cols-4 items-center gap-4">
<Label :class="connectionLabelClass">Token</Label>
<Input v-model="mqToken" type="password" class="col-span-3" />
<PasswordInput v-model="mqToken" class="col-span-3" />
</div>
</template>
<template v-else-if="mqAuthKind === 'basic'">
@@ -3492,7 +3492,7 @@ function openExternalUrl(url: string) {
</div>
<div class="grid grid-cols-4 items-center gap-4">
<Label :class="connectionLabelClass">{{ t("connection.password") }}</Label>
<Input v-model="mqBasicPassword" type="password" class="col-span-3" />
<PasswordInput v-model="mqBasicPassword" class="col-span-3" />
</div>
<div v-if="mqSystemKind === 'kafka'" class="grid grid-cols-4 items-center gap-4">
<Label :class="connectionLabelClass">SASL Mechanism</Label>
@@ -3515,7 +3515,7 @@ function openExternalUrl(url: string) {
</div>
<div class="grid grid-cols-4 items-center gap-4">
<Label :class="connectionLabelClass">Value</Label>
<Input v-model="mqApiKeyValue" type="password" class="col-span-3" />
<PasswordInput v-model="mqApiKeyValue" class="col-span-3" />
</div>
</template>
<template v-else-if="mqAuthKind === 'oauth2'">
@@ -3529,7 +3529,7 @@ function openExternalUrl(url: string) {
</div>
<div class="grid grid-cols-4 items-center gap-4">
<Label :class="connectionLabelClass">Client Secret</Label>
<Input v-model="mqOauthClientSecret" type="password" class="col-span-3" />
<PasswordInput v-model="mqOauthClientSecret" class="col-span-3" />
</div>
<div class="grid grid-cols-4 items-center gap-4">
<Label :class="connectionLabelClass">Audience</Label>
apps/desktop/src/components/ui/PasswordInput.vue
+19 -10
View File
@@ -1,26 +1,35 @@
<script setup lang="ts">
import { computed, ref } from "vue";
import { useI18n } from "vue-i18n";
import { Eye, EyeOff } from "@lucide/vue";
import { Input } from "@/components/ui/input";
const model = defineModel<string>();
const props = defineProps<{
placeholder?: string;
disabled?: boolean;
class?: string;
inputClass?: string;
showToggle?: boolean;
}>();
const props = withDefaults(
defineProps<{
placeholder?: string;
disabled?: boolean;
class?: string;
inputClass?: string;
showToggle?: boolean;
showLabel?: string;
hideLabel?: string;
}>(),
{
showToggle: true,
},
);
const visible = ref(false);
const showToggle = computed(() => props.showToggle ?? true);
const { t } = useI18n();
const toggleLabel = computed(() => (visible.value ? props.hideLabel || t("common.hidePassword") : props.showLabel || t("common.showPassword")));
</script>
<template>
<div :class="props.class" class="relative">
<Input v-model="model" :type="visible ? 'text' : 'password'" :placeholder="placeholder" :disabled="disabled" :class="[props.inputClass, showToggle ? 'pr-8' : undefined]" v-bind="$attrs" />
<button v-if="showToggle" type="button" :disabled="disabled" class="absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground disabled:pointer-events-none" tabindex="-1" @click="visible = !visible">
<Input v-model="model" :type="visible ? 'text' : 'password'" :placeholder="placeholder" :disabled="disabled" :class="[props.inputClass, props.showToggle ? 'pr-8' : undefined]" v-bind="$attrs" />
<button v-if="props.showToggle" type="button" :disabled="disabled" class="absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground disabled:pointer-events-none disabled:opacity-50" :aria-label="toggleLabel" :title="toggleLabel" @click="visible = !visible">
<Eye v-if="!visible" class="size-3.5" />
<EyeOff v-else class="size-3.5" />
</button>