store user login

src/components/shell/AppShell.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useRef, useState, type ReactNode } from 'react';
 import { Link, NavLink, Outlet, useLocation } from 'react-router-dom';
-import { Bell, ChevronDown, ChevronLeft, LogOut, Menu, Search, Sparkles, X } from 'lucide-react';
+import { Bell, ChevronDown, ChevronLeft, LogOut, Menu, Search, X } from 'lucide-react';
 import { useIsMobile } from '@/hooks/useIsMobile';
 import { useAuth } from '@/auth/AuthContext';
 import { ROLE_LABEL } from '@/auth/roles';
@@ -49,6 +49,15 @@ export interface AppShellProps {
    * here for.
    */
   manageItems?: readonly MenuEntry[];
+  /**
+   * Workspace-specific controls in the header, left of the notification bell.
+   *
+   * For things a shop reaches from anywhere and that open in place rather than
+   * navigating — the store's QR code is the first. A page for it would have
+   * been a fifth destination for something that is looked at, printed once, and
+   * closed.
+   */
+  headerActions?: ReactNode;
 }
 
 /**
@@ -67,7 +76,14 @@ export interface AppShellProps {
  * control — so those are props. Copying four hundred lines of chrome per role
  * is how two headers drift apart and stop looking like one product.
  */
-export function AppShell({ nav, home, navLabel, scopeControl, manageItems }: AppShellProps) {
+export function AppShell({
+  nav,
+  home,
+  navLabel,
+  scopeControl,
+  manageItems,
+  headerActions,
+}: AppShellProps) {
   const { user, signOut } = useAuth();
   const { pathname } = useLocation();
 
@@ -291,6 +307,8 @@ export function AppShell({ nav, home, navLabel, scopeControl, manageItems }: App
               </kbd>
             </form>
 
+            {headerActions}
+
             <IconButton label="Notifications, 2 unread" hasUnread>
               <Bell size={16} />
             </IconButton>
@@ -733,7 +751,7 @@ function initials(name: string): string {
  * `label` is required, not optional — an icon-only control with no accessible
  * name is a bug, so the API makes it impossible to omit.
  */
-function IconButton({
+export function IconButton({
   label,
   children,
   onClick,