feat(ui): Add meeting button + import modal wiring in the header

This commit is contained in:
iamdoubz committed 2026-07-11 00:37:53 -05:00
1 parent bd251b991a
commit 7ef45bb315
1 file changed
+33 -2
+33 -2
View File
@@ -7,6 +7,7 @@
import Settings from "./lib/views/Settings.svelte";
import ConsentNotice from "./lib/components/ConsentNotice.svelte";
import LevelMeter from "./lib/components/LevelMeter.svelte";
import ImportMeeting from "./lib/components/ImportMeeting.svelte";
import { trapFocus } from "./lib/actions/trapFocus";
import { recording } from "./lib/stores/recording.svelte";
import { settings } from "./lib/stores/settings.svelte";
@@ -21,6 +22,7 @@
Circle,
Square,
Trash2,
FilePlus,
Settings as SettingsIcon,
AlertTriangle,
PanelLeftClose,
@@ -31,6 +33,13 @@
let showSettings = $state(false);
let showConsent = $state(false);
let showImport = $state(false);
// A freshly imported meeting: refresh the list and open it.
async function onImported(id: string) {
await meetings.load();
await meetings.select(id);
}
// Vault unlock gate (T8.8): if the vault is enabled but locked at startup,
// prompt for the password so encrypted meetings are readable.
@@ -237,6 +246,14 @@
<option value={t.id}>{t.name}</option>
{/each}
</select>
<button
class="import-btn"
onclick={() => (showImport = true)}
title="Add a meeting from a file or URL"
>
<FilePlus size={13} aria-hidden="true" />
Add meeting
</button>
<button
class="record-btn"
onclick={startRecording}
@@ -321,6 +338,10 @@
<Settings onClose={() => (showSettings = false)} />
{/if}
{#if showImport}
<ImportMeeting onClose={() => (showImport = false)} {onImported} />
{/if}
{#if vaultLocked}
<div
class="vault-overlay"
@@ -578,7 +599,8 @@
font-size: 0.85rem;
}
.record-btn,
.stop-btn {
.stop-btn,
.import-btn {
display: inline-flex;
align-items: center;
gap: 0.4rem;
@@ -593,9 +615,18 @@
transform 100ms ease-out;
}
.record-btn:active,
.stop-btn:active {
.stop-btn:active,
.import-btn:active {
transform: scale(0.97);
}
.import-btn {
background: var(--bg-elevated);
color: var(--fg);
border-color: var(--border);
}
.import-btn:hover {
background: var(--bg-hover);
}
.record-btn {
background: var(--danger);
color: #ffffff;