mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-14 19:01:08 +02:00
refactor(ui): unify LanguageSelector, ConfirmDialog, and AppSlider across apps
- contacts, zitare: migrate LanguageSelector to shared PillDropdown pattern - context, times: replace local ConfirmDialog with ConfirmationModal from @manacore/shared-ui - delete local ConfirmDialog.svelte in both apps - map open→visible, onCancel→onClose, remove destructive prop (default in shared-ui) - calendar, chat, contacts, presi, todo: switch AppSlider from static MANA_APPS to getActiveManaApps() to filter inactive apps consistently Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
3ea2c03ab2
commit
5e4518b418
16 changed files with 62 additions and 228 deletions
|
|
@ -1,56 +0,0 @@
|
|||
<script lang="ts">
|
||||
import { _ } from 'svelte-i18n';
|
||||
|
||||
let {
|
||||
visible = false,
|
||||
title = '',
|
||||
message = '',
|
||||
confirmLabel,
|
||||
cancelLabel,
|
||||
destructive = true,
|
||||
onConfirm,
|
||||
onCancel,
|
||||
}: {
|
||||
visible: boolean;
|
||||
title: string;
|
||||
message?: string;
|
||||
confirmLabel?: string;
|
||||
cancelLabel?: string;
|
||||
destructive?: boolean;
|
||||
onConfirm: () => void;
|
||||
onCancel: () => void;
|
||||
} = $props();
|
||||
</script>
|
||||
|
||||
{#if visible}
|
||||
<div
|
||||
class="fixed inset-0 z-[100] flex items-center justify-center bg-black/50 backdrop-blur-sm"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
>
|
||||
<div
|
||||
class="mx-4 w-full max-w-sm rounded-2xl border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6 shadow-xl"
|
||||
>
|
||||
<h3 class="text-lg font-semibold text-[hsl(var(--foreground))]">{title}</h3>
|
||||
{#if message}
|
||||
<p class="mt-2 text-sm text-[hsl(var(--muted-foreground))]">{message}</p>
|
||||
{/if}
|
||||
<div class="mt-5 flex gap-2">
|
||||
<button
|
||||
onclick={onCancel}
|
||||
class="flex-1 rounded-lg border border-[hsl(var(--border))] py-2.5 text-sm text-[hsl(var(--muted-foreground))] transition-colors hover:text-[hsl(var(--foreground))]"
|
||||
>
|
||||
{cancelLabel || $_('common.cancel')}
|
||||
</button>
|
||||
<button
|
||||
onclick={onConfirm}
|
||||
class="flex-1 rounded-lg py-2.5 text-sm font-medium transition-colors {destructive
|
||||
? 'bg-red-500 text-white hover:bg-red-600'
|
||||
: 'bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] hover:opacity-90'}"
|
||||
>
|
||||
{confirmLabel || $_('common.delete')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
|
@ -5,7 +5,7 @@
|
|||
import { formatDurationCompact } from '$lib/data/queries';
|
||||
import { CurrencyDollar } from '@manacore/shared-icons';
|
||||
import type { TimeEntry, Project, Client } from '@times/shared';
|
||||
import ConfirmDialog from './ConfirmDialog.svelte';
|
||||
import { ConfirmationModal } from '@manacore/shared-ui';
|
||||
|
||||
let {
|
||||
entry,
|
||||
|
|
@ -200,10 +200,10 @@
|
|||
{/if}
|
||||
</div>
|
||||
|
||||
<ConfirmDialog
|
||||
<ConfirmationModal
|
||||
visible={showDeleteConfirm}
|
||||
title={$_('common.delete')}
|
||||
message={$_('entry.deleteConfirm')}
|
||||
onConfirm={confirmDelete}
|
||||
onCancel={() => (showDeleteConfirm = false)}
|
||||
onClose={() => (showDeleteConfirm = false)}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
import { getTotalDuration, formatDurationCompact } from '$lib/data/queries';
|
||||
import type { Client, Project, TimeEntry } from '@times/shared';
|
||||
import { PROJECT_COLORS } from '@times/shared/constants';
|
||||
import ConfirmDialog from '$lib/components/ConfirmDialog.svelte';
|
||||
import { ConfirmationModal } from '@manacore/shared-ui';
|
||||
import { CaretRight } from '@manacore/shared-icons';
|
||||
|
||||
const allClients = getContext<{ value: Client[] }>('clients');
|
||||
|
|
@ -348,10 +348,10 @@
|
|||
{/if}
|
||||
</div>
|
||||
|
||||
<ConfirmDialog
|
||||
<ConfirmationModal
|
||||
visible={deleteConfirmId !== null}
|
||||
title={$_('common.delete')}
|
||||
message={$_('client.deleteConfirm')}
|
||||
onConfirm={confirmDelete}
|
||||
onCancel={() => (deleteConfirmId = null)}
|
||||
onClose={() => (deleteConfirmId = null)}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
import { getTotalDuration, formatDurationCompact } from '$lib/data/queries';
|
||||
import type { Project, Client, TimeEntry } from '@times/shared';
|
||||
import { PROJECT_COLORS } from '@times/shared/constants';
|
||||
import ConfirmDialog from '$lib/components/ConfirmDialog.svelte';
|
||||
import { ConfirmationModal } from '@manacore/shared-ui';
|
||||
import { CaretRight } from '@manacore/shared-icons';
|
||||
|
||||
const allProjects = getContext<{ value: Project[] }>('projects');
|
||||
|
|
@ -357,10 +357,10 @@
|
|||
{/if}
|
||||
</div>
|
||||
|
||||
<ConfirmDialog
|
||||
<ConfirmationModal
|
||||
visible={deleteConfirmId !== null}
|
||||
title={$_('common.delete')}
|
||||
message={$_('project.deleteConfirm')}
|
||||
onConfirm={confirmDelete}
|
||||
onCancel={() => (deleteConfirmId = null)}
|
||||
onClose={() => (deleteConfirmId = null)}
|
||||
/>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue