Merge watch profiles into user accounts — one profile per login, no picker

- Removed the "Who's Watching" sub-profile picker entirely: ProfileProvider now
  auto-resolves the single profile tied to the account immediately after login
- Backend: removed POST/DELETE /profiles (no more creating/deleting extra
  profiles — lifecycle is entirely driven by user create/delete, already wired
  in the admin Users CRUD); kept GET (internal) and PATCH (edit your own
  profile's avatar/kids-mode/rating cap)
- Deleted ProfileSelect page and the now-unused ProtectedRoute component
- Navbar: removed the "switch profile" action, account avatar is now just a
  static display
- api.js: dropped the now-dead X-Profile-Id header logic (backend already
  falls back to the account's single profile when the header is absent)
This commit is contained in:
Myron Blair
2026-07-26 19:40:12 -05:00
parent 5b191da471
commit f7626ced2e
8 changed files with 22 additions and 262 deletions
+10 -21
View File
@@ -1,12 +1,12 @@
import { Link, NavLink, useNavigate } from "react-router-dom";
import { useAuth } from "../lib/auth";
import { useProfile } from "../lib/profile";
import { Search, LogOut, Upload, Users, Settings as SettingsIcon } from "lucide-react";
import { Search, LogOut, Upload, Settings as SettingsIcon } from "lucide-react";
import { useState, useEffect } from "react";
export const Navbar = () => {
const { user, logout } = useAuth();
const { active, clearActive } = useProfile();
const { active } = useProfile();
const nav = useNavigate();
const [scrolled, setScrolled] = useState(false);
@@ -19,11 +19,6 @@ export const Navbar = () => {
const linkClass = ({ isActive }) =>
`text-sm tracking-wide transition-colors duration-300 ${isActive ? "text-white" : "text-[#8A8A8A] hover:text-white"}`;
const switchProfile = () => {
clearActive();
nav("/profile");
};
return (
<header className={`fixed top-0 left-0 right-0 z-50 transition-all duration-300 ${scrolled ? "glass border-b" : ""}`} data-testid="main-navbar">
<div className="px-6 md:px-12 py-4 flex items-center justify-between">
@@ -58,20 +53,14 @@ export const Navbar = () => {
<SettingsIcon size={14} strokeWidth={1.5} /> Settings
</button>
<div className="flex items-center gap-3 pl-4 border-l border-[#222]">
<button onClick={switchProfile} className="flex items-center gap-2 group" data-testid="nav-switch-profile" title="Switch profile">
{active && (
<>
<div className="hidden sm:flex flex-col items-end leading-tight">
<span className="text-xs text-white">{active.name}</span>
<span className="text-[10px] uppercase tracking-[0.2em] text-[#8A8A8A] group-hover:text-white transition-colors">switch</span>
</div>
<div className="w-8 h-8 flex items-center justify-center text-white text-xs font-medium" style={{ backgroundColor: active.avatar_color || "#D9381E" }}>
{active.name?.[0]?.toUpperCase() || "U"}
</div>
</>
)}
{!active && <Users size={18} strokeWidth={1.5} className="text-[#8A8A8A]" />}
</button>
{active && (
<div className="flex items-center gap-2" data-testid="account-avatar">
<span className="hidden sm:inline text-xs text-white">{active.name}</span>
<div className="w-8 h-8 flex items-center justify-center text-white text-xs font-medium" style={{ backgroundColor: active.avatar_color || "#D9381E" }}>
{active.name?.[0]?.toUpperCase() || "U"}
</div>
</div>
)}
<button onClick={() => { logout(); nav("/login"); }} className="text-[#8A8A8A] hover:text-white transition-colors duration-300" data-testid="nav-logout-button" aria-label="Logout">
<LogOut size={16} strokeWidth={1.5} />
</button>