d4765e6576
- 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.
39 lines
1.9 KiB
TypeScript
39 lines
1.9 KiB
TypeScript
const logo = "/eritors-favicon-white.png";
|
|
import React, {useContext} from "react";
|
|
import {BookContext, BookContextProps} from "@/context/BookContext";
|
|
import {useTranslations} from '@/lib/i18n';
|
|
|
|
export default function ScribeTopBar() {
|
|
const {book}: BookContextProps = useContext<BookContextProps>(BookContext);
|
|
const t = useTranslations();
|
|
return (
|
|
<div className="flex items-center justify-between px-6 py-3 bg-tertiary border-b border-secondary">
|
|
<div className="flex items-center space-x-4 group">
|
|
<div className="transition-transform duration-300">
|
|
<img src={logo} alt={t("scribeTopBar.logoAlt")} width={24} height={24}/>
|
|
</div>
|
|
<span
|
|
className="font-['ADLaM_Display'] text-xl tracking-wide text-text-primary">{t("scribeTopBar.scribe")}</span>
|
|
</div>
|
|
{book && (
|
|
<div
|
|
className="flex items-center space-x-3 bg-text-primary/10 backdrop-blur-sm px-4 py-2 rounded-lg border border-text-primary/20">
|
|
<div className="h-8 w-1 bg-text-primary/40 rounded-full"></div>
|
|
<div className="text-center">
|
|
<p className="text-text-primary font-semibold text-base tracking-wide">
|
|
{book.title}
|
|
</p>
|
|
{book.subTitle && (
|
|
<p className="text-text-secondary text-xs italic mt-0.5">
|
|
{book.subTitle}
|
|
</p>
|
|
)}
|
|
</div>
|
|
<div className="h-8 w-1 bg-text-primary/40 rounded-full"></div>
|
|
</div>
|
|
)}
|
|
<div className="flex items-center space-x-2 min-w-[120px] justify-end">
|
|
</div>
|
|
</div>
|
|
)
|
|
} |