From f9c0b71c4d4f702a82d98c8bc7abe61cf16203c7 Mon Sep 17 00:00:00 2001
From: admin-valentin <valentinbvro@gmail.com>
Date: Sat, 1 Aug 2026 09:57:57 +0000
Subject: [PATCH] feat(cc-050): Workspace Settings page

---
 .../dashboard/settings/workspaces/page.tsx    | 64 +++++++++++++++++++
 1 file changed, 64 insertions(+)
 create mode 100644 src/app/dashboard/settings/workspaces/page.tsx

diff --git a/src/app/dashboard/settings/workspaces/page.tsx b/src/app/dashboard/settings/workspaces/page.tsx
new file mode 100644
index 0000000..7467cd6
--- /dev/null
+++ b/src/app/dashboard/settings/workspaces/page.tsx
@@ -0,0 +1,64 @@
+'use client';
+
+import { useQuery } from '@tanstack/react-query';
+import { apiFetch } from '../../../../lib/api';
+import type { TenantMembership } from '../../../../lib/api';
+import { useSession } from '../../../../components/session-provider';
+
+export default function WorkspacesPage() {
+  const { activeTenant } = useSession();
+  const tenantId = activeTenant?.tenantId ?? '';
+
+  const { data: me, isLoading } = useQuery({
+    queryKey: ['me-workspaces'],
+    queryFn: () => apiFetch<{ userId: string; tenants: TenantMembership[] }>('/v1/me', { tenantId }),
+    staleTime: 60_000,
+  });
+
+  const tenantList = me?.tenants ?? [];
+
+  return (
+    <div className="max-w-3xl space-y-6">
+      <div>
+        <h1 className="font-display text-2xl font-semibold text-ink">Workspace-uri</h1>
+        <p className="mt-1 text-sm text-ink-faint">
+          Toate workspace-urile la care ai acces ({tenantList.length}).
+        </p>
+      </div>
+
+      {isLoading ? (
+        <p className="text-sm text-ink-faint">Se încarcă…</p>
+      ) : tenantList.length === 0 ? (
+        <div className="card p-10 text-center">
+          <p className="text-sm text-ink-faint">Niciun workspace găsit.</p>
+        </div>
+      ) : (
+        <ul className="space-y-3">
+          {tenantList.map((t) => {
+            const isActive = t.tenantId === tenantId;
+            return (
+              <li key={t.tenantId} className={`card p-5 ${isActive ? 'border border-bronze-deep' : ''}`}>
+                <div className="flex items-start justify-between gap-4">
+                  <div className="min-w-0">
+                    <div className="flex items-center gap-2">
+                      <p className="font-semibold text-ink">{t.tenantName}</p>
+                      {isActive && (
+                        <span className="rounded-full bg-bronze-wash px-2 py-0.5 text-[10px] font-semibold text-bronze-deep">
+                          Activ
+                        </span>
+                      )}
+                    </div>
+                    <p className="mt-0.5 font-mono text-[11px] text-ink-faint">{t.tenantId}</p>
+                  </div>
+                  <span className="shrink-0 rounded-full bg-paper-sunken px-2.5 py-1 text-xs font-medium capitalize text-ink-faint">
+                    {t.role}
+                  </span>
+                </div>
+              </li>
+            );
+          })}
+        </ul>
+      )}
+    </div>
+  );
+}