Working feed: NDK + relay connection + live notes from Nostr

- Tailwind CSS + Zustand + NDK installed and configured
- Sidebar with feed/relays/settings navigation
- Global feed view with live notes from relays
- Profile fetching with caching and deduplication
- Relay connection with timeout handling
- Note cards with avatar, name, timestamp, content
- Dark theme, monospace, no-slop UI
- Devtools enabled for debugging

src/components/shared/RelaysView.tsx

@@ -0,0 +1,39 @@
+import { getNDK } from "../../lib/nostr";
+
+export function RelaysView() {
+  const ndk = getNDK();
+  const relays = Array.from(ndk.pool?.relays?.values() ?? []);
+
+  return (
+    <div className="h-full flex flex-col">
+      <header className="border-b border-border px-4 py-2.5 shrink-0">
+        <h1 className="text-text text-sm font-medium tracking-wide">Relays</h1>
+      </header>
+
+      <div className="flex-1 overflow-y-auto p-4">
+        {relays.length === 0 ? (
+          <p className="text-text-dim text-[12px]">No relays configured.</p>
+        ) : (
+          <div className="space-y-1">
+            {relays.map((relay) => (
+              <div
+                key={relay.url}
+                className="flex items-center gap-3 px-3 py-2 border border-border text-[12px]"
+              >
+                <span
+                  className={`w-1.5 h-1.5 rounded-full shrink-0 ${
+                    relay.connected ? "bg-success" : "bg-danger"
+                  }`}
+                />
+                <span className="text-text truncate flex-1 font-mono">{relay.url}</span>
+                <span className="text-text-dim shrink-0">
+                  {relay.connected ? "connected" : "disconnected"}
+                </span>
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}

src/components/shared/SettingsView.tsx

@@ -0,0 +1,15 @@
+export function SettingsView() {
+  return (
+    <div className="h-full flex flex-col">
+      <header className="border-b border-border px-4 py-2.5 shrink-0">
+        <h1 className="text-text text-sm font-medium tracking-wide">Settings</h1>
+      </header>
+
+      <div className="flex-1 overflow-y-auto p-4">
+        <p className="text-text-dim text-[12px]">
+          Settings will appear here — key management, relay config, Lightning wallet connection, appearance.
+        </p>
+      </div>
+    </div>
+  );
+}