feat: add wallet status indicator and replace layout on apply

- Add WalletStatus component to TabBar
- Change loadSpellbook to replace current workspaces instead of merging
- Update SpellbooksViewer toast message

src/components/SpellbooksViewer.tsx

@@ -312,7 +312,7 @@ export function SpellbooksViewer() {
   const handleApply = (spellbook: ParsedSpellbook) => {
     loadSpellbook(spellbook);
     toast.success("Layout applied", {
-      description: `Added ${Object.keys(spellbook.content.workspaces).length} workspaces.`,
+      description: `Replaced current layout with ${Object.keys(spellbook.content.workspaces).length} workspaces.`,
     });
   };
 

src/components/TabBar.tsx

@@ -3,6 +3,7 @@ import { Button } from "./ui/button";
 import { useGrimoire } from "@/core/state";
 import { cn } from "@/lib/utils";
 import { LayoutControls } from "./LayoutControls";
+import { WalletStatus } from "./WalletStatus";
 import { useEffect, useState } from "react";
 import { Reorder, useDragControls } from "framer-motion";
 import { Workspace } from "@/types/app";
@@ -234,6 +235,7 @@ export function TabBar() {
 
         {/* Right side: Layout controls */}
         <div className="flex items-center gap-1 flex-shrink-0">
+          <WalletStatus />
           <LayoutControls />
         </div>
       </div>

src/components/WalletStatus.tsx

@@ -0,0 +1,48 @@
+import { useEffect, useState } from "react";
+import { Wallet } from "lucide-react";
+import walletService from "@/services/wallet";
+import { Button } from "./ui/button";
+import { useGrimoire } from "@/core/state";
+import { cn } from "@/lib/utils";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
+
+export function WalletStatus() {
+  const [status, setStatus] = useState(walletService.status$.value);
+  const { addWindow } = useGrimoire();
+
+  useEffect(() => {
+    const sub = walletService.status$.subscribe(setStatus);
+    return () => sub.unsubscribe();
+  }, []);
+
+  const handleClick = () => {
+    addWindow("wallet", {});
+  };
+
+  return (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <Button
+          variant="ghost"
+          size="icon"
+          className="h-6 w-6"
+          onClick={handleClick}
+          aria-label="Wallet status"
+        >
+          <Wallet
+            className={cn(
+              "h-3 w-3 transition-colors",
+              status === "connected" ? "text-green-500" : "text-muted-foreground",
+              status === "connecting" && "animate-pulse text-yellow-500"
+            )}
+          />
+        </Button>
+      </TooltipTrigger>
+      <TooltipContent>
+        <p className="text-xs">
+          Wallet: {status.charAt(0).toUpperCase() + status.slice(1)}
+        </p>
+      </TooltipContent>
+    </Tooltip>
+  );
+}