highperfocused/grimoire
1
0
Fork 0
mirror of https://github.com/purrgrammer/grimoire.git synced 2026-04-10 07:27:23 +02:00
Code Issues Packages Projects Releases Wiki Activity

style: consolidate layout tracking UI into SpellbookDropdown

Browse Source
This commit is contained in:
Alejandro Gómez
2025-12-20 21:18:52 +01:00
parent d59a7aee8b
commit 33d53efba8
2 changed files with 10 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/Home.tsx
View File

@@ -26,14 +26,12 @@ import { Button } from "./ui/button";
const PREVIEW_BACKUP_KEY = "grimoire-preview-backup";
export default function Home() {
const { state, updateLayout, removeWindow, loadSpellbook, clearActiveSpellbook } = useGrimoire();
const { state, updateLayout, removeWindow, loadSpellbook } = useGrimoire();
const [commandLauncherOpen, setCommandLauncherOpen] = useState(false);
const { actor, identifier } = useParams();
const navigate = useNavigate();
const location = useLocation();
const activeSpellbook = state.activeSpellbook;
// Preview state
const [resolvedPubkey, setResolvedPubkey] = useState<string | null>(null);
const isPreviewPath = location.pathname.startsWith("/preview/");
@@ -247,19 +245,6 @@ export default function Home() {
<div className="flex items-center gap-2">
<SpellbookDropdown />
{activeSpellbook && !isPreviewPath && (
<div className="flex items-center gap-1 px-2 py-0.5 rounded-md bg-muted/50 border border-border animate-in fade-in zoom-in duration-300">
<span className="text-[10px] font-bold text-muted-foreground uppercase tracking-tight">Active:</span>
<span className="text-xs font-medium truncate max-w-[150px]">{activeSpellbook.title}</span>
<button
onClick={clearActiveSpellbook}
className="ml-1 p-0.5 hover:bg-background rounded-full text-muted-foreground hover:text-foreground transition-colors"
title="Clear active spellbook context"
>
<X className="size-3" />
</button>
</div>
)}
</div>
<UserMenu />

11
src/components/SpellbookDropdown.tsx
View File

@@ -1,5 +1,5 @@
import { useMemo, useState } from "react";
import { BookHeart, ChevronDown, Plus, Save, WandSparkles } from "lucide-react";
import { BookHeart, ChevronDown, Plus, Save, WandSparkles, X } from "lucide-react";
import { useLiveQuery } from "dexie-react-hooks";
import db from "@/services/db";
import { useGrimoire } from "@/core/state";
@@ -30,7 +30,7 @@ import { saveSpellbook } from "@/services/spellbook-storage";
import { SaveSpellbookDialog } from "./SaveSpellbookDialog";
export function SpellbookDropdown() {
const { state, loadSpellbook, addWindow } = useGrimoire();
const { state, loadSpellbook, addWindow, clearActiveSpellbook } = useGrimoire();
const activeAccount = state.activeAccount;
const activeSpellbook = state.activeSpellbook;
const [saveDialogOpen, setSaveDialogOpen] = useState(false);
@@ -244,6 +244,13 @@ export function SpellbookDropdown() {
<span className="text-[10px] text-muted-foreground">Save current state to this spellbook</span>
</div>
</DropdownMenuItem>
<DropdownMenuItem
onClick={clearActiveSpellbook}
className={cn(itemClass, "text-xs opacity-70")}
>
<X className="size-3.5 mr-2 text-muted-foreground" />
Stop Tracking Layout
</DropdownMenuItem>
<DropdownMenuSeparator />
</>
)}