peter
76f8de258c
Add a paint-only .btn-primary recipe (solid accent bg + accent-fg text + hover:opacity dim) in index.css @layer components, alongside the selection-paint recipes (.pill/.chip/.is-current). Migrate ~38 primary/action buttons across 24 files off the hand-rolled 'bg-accent text-accent-fg hover:opacity-90', keeping each site's geometry (padding/radius/font/gap/disabled/shadow). Deliberately NOT migrated: accent BADGES/labels (spans), the chat message bubble, selection toggles (tableHeader — R8 popover territory), and the round play FAB (hover:scale, not the opacity-dim primary idiom). Three previously hover-less primary buttons (SettingsPanel/SetupWizard/DraftSaveBar) gain the standard hover dim for consistency. Gate green (tsc/eslint-0/prettier/knip/vitest 79); self-E2E confirmed a migrated button computes to accent/accent-fg and both recipe rules load.
25 lines
879 B
TypeScript
25 lines
879 B
TypeScript
import { useSyncExternalStore } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { dismissError, getError, subscribeError } from "../lib/errorDialog";
|
|
import Modal from "./Modal";
|
|
|
|
// Renders the current app error (if any) as a modal the user must acknowledge.
|
|
export default function ErrorDialog() {
|
|
const { t } = useTranslation();
|
|
const err = useSyncExternalStore(subscribeError, getError, getError);
|
|
if (!err) return null;
|
|
return (
|
|
<Modal title={err.title} onClose={dismissError} maxWidth="max-w-md">
|
|
<p className="text-sm leading-relaxed text-fg/90">{err.message}</p>
|
|
<div className="flex justify-end mt-5">
|
|
<button
|
|
onClick={dismissError}
|
|
className="px-4 py-2 rounded-lg btn-primary text-sm font-medium transition"
|
|
>
|
|
{t("errors.ok")}
|
|
</button>
|
|
</div>
|
|
</Modal>
|
|
);
|
|
}
|