Add foundational components and logic for migration, UI design, and input handling

- Introduced foundational UI components (`Badge`, `LockCard`, `SectionHeader`, `AvatarIcon`, etc.) for flexible layouts and consistent design.
- Added migration support with the `MigrationModal` component and backend integration for exporting/importing data between Electron and Tauri.
- Extended form components with `TextAreaInput`, `OrderInput`, `ToggleField`, and `ToolbarSelect` for improved input handling.
- Updated `ScribeShell` with migration popup logic to prompt users for data migration.
- Integrated `AlertStack` for better alert handling and notification management.
- Enhanced Rust/Tauri services with migration command implementations.
- Added translations and styles for new components.
This commit is contained in:
natreex
2026-04-05 12:52:54 -04:00
parent 2b6d4cc48b
commit d4765e6576
49 changed files with 3115 additions and 2 deletions

View File

@@ -0,0 +1,49 @@
import React from "react";
import {LucideIcon} from "lucide-react";
import InputField from "@/components/form/InputField";
import ToggleWithConfirmation from "@/components/form/ToggleWithConfirmation";
import {AlertType} from "@/components/ui/AlertBox";
interface ToggleFieldProps {
icon: LucideIcon;
label: string;
checked: boolean;
onChange: (value: boolean) => void;
alertTitle: string;
alertMessage: string;
alertType: AlertType;
confirmText?: string;
cancelText?: string;
}
export default function ToggleField(
{
icon,
label,
checked,
onChange,
alertTitle,
alertMessage,
alertType,
confirmText,
cancelText,
}: ToggleFieldProps) {
return (
<InputField
icon={icon}
fieldName={label}
centered
input={
<ToggleWithConfirmation
checked={checked}
onChange={onChange}
alertTitle={alertTitle}
alertMessage={alertMessage}
alertType={alertType}
confirmText={confirmText}
cancelText={cancelText}
/>
}
/>
);
}