mirror of
https://github.com/myronblair/kino-app
synced 2026-07-28 05:23:45 -05:00
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:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user