ui phase 2

client/src/layout/components/ActorSwitcher.tsx

@@ -0,0 +1,39 @@
+'use client';
+import { FunctionComponent } from 'react';
+import { useTranslations } from 'next-intl';
+import { AppButton } from '@/components';
+import { useAuth } from '@/context/auth';
+import { APP_ROLES, ROUTES } from '@/constants';
+import { useRouter } from '@/i18n/navigation';
+
+export interface ActorSwitcherProps {
+  /** The shell this switcher navigates *to* — 'nurse' inside the customer app, 'customer' inside the nurse app. */
+  target: 'customer' | 'nurse';
+}
+
+/**
+ * Navigation-only "نمای پرستار ⇄ اپلیکیشن خانواده" affordance for a dual customer+nurse session
+ * (`SessionUser.roles` already carries both). Renders nothing for a single-role session — `RoleGuard`
+ * remains the sole "which app" authority; this only moves the user between two apps they already have.
+ * @component ActorSwitcher
+ */
+const ActorSwitcher: FunctionComponent<ActorSwitcherProps> = ({ target }) => {
+  const [state] = useAuth();
+  const roles = state.currentUser?.roles ?? [];
+  const isDualRole = roles.includes(APP_ROLES.CUSTOMER) && roles.includes(APP_ROLES.NURSE);
+  const t = useTranslations('shell');
+  const router = useRouter();
+
+  if (!isDualRole) return null;
+
+  const destination = target === 'nurse' ? ROUTES.NURSE : ROUTES.HOME;
+  const label = target === 'nurse' ? t('switch_to_nurse') : t('switch_to_customer');
+
+  return (
+    <AppButton variant="outlined" color="primary" fullWidth onClick={() => router.push(destination)}>
+      {label}
+    </AppButton>
+  );
+};
+
+export default ActorSwitcher;