wisecolt
05bbe307e0
- iOS Memos benzeri PWA ön yüz eklendi (React, Tailwind) - Express tabanlı arka uç, AnythingLLM API entegrasyonu ve senkronizasyon kuyruğu oluşturuldu - Docker, TypeScript ve proje konfigürasyonları tanımlandı
38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import SyncBadge from "../editor/SyncBadge";
|
|
import { useNotesStore } from "../../store/notesStore";
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
import { faBars } from "@fortawesome/free-solid-svg-icons";
|
|
import Button from "../ui/Button";
|
|
|
|
type MobileHeaderProps = {
|
|
onToggleSidebar: () => void;
|
|
onLogout: () => void;
|
|
};
|
|
|
|
export default function MobileHeader({ onToggleSidebar, onLogout }: MobileHeaderProps) {
|
|
const notes = useNotesStore((state) => state.notes);
|
|
const activeId = useNotesStore((state) => state.activeId);
|
|
const activeNote = notes.find((note) => note.id === activeId);
|
|
|
|
return (
|
|
<header className="sticky top-0 z-30 flex items-center justify-between bg-[var(--paper)]/80 px-4 py-3 backdrop-blur lg:hidden">
|
|
<Button
|
|
onClick={onToggleSidebar}
|
|
className="bg-white px-3 py-2 text-sm font-semibold text-[var(--ink)]"
|
|
aria-label="Menüyü aç"
|
|
>
|
|
<FontAwesomeIcon icon={faBars} className="h-4 w-4" />
|
|
</Button>
|
|
<div className="flex items-center gap-2">
|
|
<SyncBadge note={activeNote} />
|
|
<Button
|
|
onClick={onLogout}
|
|
className="border border-slate-200 px-2 py-1 text-xs text-[var(--ink)]"
|
|
>
|
|
Cikis
|
|
</Button>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|