feat: discover people tab, privacy settings, and friend request button fix

- Add "Discover People" section to Add Friend tab with user cards, mutual counts, and inline actions - Add discoverStore for fetching/searching discoverable users across local and federated instances - Add PrivacyPanel to user settings with discoverability toggle - Add is_discoverable column to users table with migration - Fix "Send Friend Request" button vertical alignment using transform centering
2026-03-13 22:54:19 +01:00
parent 9382477e33
commit b194cc1915
9 changed files with 584 additions and 31 deletions
@@ -0,0 +1,53 @@
+import { useState, useEffect } from 'react';
+import { useAuthStore } from '../../../stores/authStore';
+import { api } from '../../../api/client';
+import { Toggle } from '../../ui/Toggle';
+
+export function PrivacyPanel() {
+  const user = useAuthStore((s) => s.user);
+  const setUser = useAuthStore((s) => s.setUser);
+  const [discoverable, setDiscoverable] = useState(user?.discoverable !== false);
+  const [saving, setSaving] = useState(false);
+
+  useEffect(() => {
+    setDiscoverable(user?.discoverable !== false);
+  }, [user?.discoverable]);
+
+  const handleToggle = async (enabled: boolean) => {
+    setDiscoverable(enabled);
+    setSaving(true);
+    try {
+      const updated = await api.users.update({ discoverable: enabled });
+      setUser(updated);
+    } catch {
+      // Revert on failure
+      setDiscoverable(!enabled);
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  return (
+    <div className="space-y-5">
+      <div>
+        <div className="text-[11px] font-semibold text-txt-tertiary uppercase tracking-wider mb-1.5">
+          Discovery
+        </div>
+        <div className="rounded-lg bg-white/[0.03] border border-white/[0.04] p-3.5">
+          <div className="flex items-center justify-between py-1">
+            <div className="flex-1 mr-4">
+              <div className="text-sm text-txt-primary">Allow others to find my profile</div>
+              <div className="text-xs text-txt-tertiary mt-0.5">
+                When enabled, your profile appears in Discover People. Others can always add you by exact username.
+              </div>
+            </div>
+            <Toggle enabled={discoverable} onChange={handleToggle} />
+          </div>
+          {saving && (
+            <div className="text-xs text-txt-tertiary mt-2">Saving...</div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}