fix(import): keep sql dialog actions visible
This commit is contained in:
parent
c29ad9ba17
commit
3ecfa6129a
|
|
@ -438,15 +438,16 @@ watch(
|
|||
|
||||
<template>
|
||||
<Dialog :open="open" @update:open="handleOpenChange">
|
||||
<DialogScrollContent class="sm:max-w-[860px] min-w-0 overflow-hidden" :trap-focus="false" @interact-outside.prevent>
|
||||
<DialogHeader>
|
||||
<DialogScrollContent class="flex max-h-[calc(100dvh-6rem)] min-h-0 min-w-0 flex-col overflow-hidden sm:max-w-[860px]" :trap-focus="false" @interact-outside.prevent>
|
||||
<DialogHeader class="shrink-0">
|
||||
<DialogTitle class="flex items-center gap-2">
|
||||
<FileCode class="w-4 h-4" />
|
||||
{{ t("sqlFile.title") }}
|
||||
</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<div class="grid min-w-0 gap-4 py-3">
|
||||
<!-- Keep terminal actions reachable while long previews and errors scroll inside the viewport. -->
|
||||
<div class="grid min-h-0 min-w-0 flex-1 gap-4 overflow-y-auto py-3">
|
||||
<div class="min-w-0 space-y-3">
|
||||
<div class="text-xs font-medium text-muted-foreground uppercase tracking-wider">
|
||||
{{ t("sqlFile.file") }}
|
||||
|
|
@ -488,7 +489,7 @@ watch(
|
|||
{{ t("sqlFile.target") }}
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 gap-3">
|
||||
<div class="grid grid-cols-1 gap-3 sm:grid-cols-2">
|
||||
<div class="space-y-1.5">
|
||||
<Label class="text-xs">{{ t("sqlFile.connection") }}</Label>
|
||||
<Select v-model="connectionId" :disabled="running">
|
||||
|
|
@ -595,7 +596,7 @@ watch(
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<DialogFooter>
|
||||
<DialogFooter class="shrink-0">
|
||||
<template v-if="running">
|
||||
<Button variant="outline" size="sm" @click="open = false">
|
||||
{{ t("sqlFile.runInBackground") }}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
import assert from "node:assert/strict";
|
||||
import { readFileSync } from "node:fs";
|
||||
import { test } from "vitest";
|
||||
import { compileScript, compileTemplate, parse } from "vue/compiler-sfc";
|
||||
|
||||
const dialogPath = "apps/desktop/src/components/sql-file/SqlFileExecutionDialog.vue";
|
||||
const dialogSource = readFileSync(dialogPath, "utf8");
|
||||
|
||||
test("SQL file execution dialog SFC compiles", () => {
|
||||
const { descriptor, errors } = parse(dialogSource, { filename: dialogPath });
|
||||
assert.deepEqual(errors, []);
|
||||
assert.ok(descriptor.scriptSetup);
|
||||
compileScript(descriptor, { id: dialogPath });
|
||||
assert.ok(descriptor.template);
|
||||
const result = compileTemplate({ id: dialogPath, filename: dialogPath, source: descriptor.template.content });
|
||||
assert.deepEqual(result.errors, []);
|
||||
});
|
||||
|
||||
test("SQL file execution dialog keeps actions visible within narrow viewports", () => {
|
||||
assert.match(dialogSource, /DialogScrollContent class="[^"]*max-h-\[calc\(100dvh-6rem\)\][^"]*flex-col[^"]*overflow-hidden/);
|
||||
assert.match(dialogSource, /<DialogHeader class="shrink-0">/);
|
||||
assert.match(dialogSource, /class="grid min-h-0 min-w-0 flex-1 gap-4 overflow-y-auto py-3"/);
|
||||
assert.match(dialogSource, /class="grid grid-cols-1 gap-3 sm:grid-cols-2"/);
|
||||
assert.match(dialogSource, /<DialogFooter class="shrink-0">/);
|
||||
});
|
||||
|
||||
test("SQL file execution dialog preserves cancel, close, and retry actions", () => {
|
||||
assert.match(dialogSource, /<template v-if="running">[\s\S]*@click="open = false"[\s\S]*@click="cancelExecution"/);
|
||||
assert.match(dialogSource, /<template v-else>[\s\S]*@click="open = false"[\s\S]*:disabled="!canStart" @click="startExecution"/);
|
||||
assert.match(dialogSource, /terminalStatus\.value = cancelRequested\.value \? "cancelled" : "error"/);
|
||||
});
|
||||
Loading…
Reference in New Issue