invitation flow finished

basic invitation flow

apps/admin/.env.example

@@ -14,6 +14,10 @@ RESEND_API_KEY=re_your_resend_api_key_here
 EMAIL_FROM=FitAI <noreply@yourdomain.com>
 EMAIL_REPLY_TO=support@yourdomain.com
 
+# Admin App URL (for invitation redirects)
+# Set to your production URL in production
+NEXT_PUBLIC_APP_URL=http://localhost:3000
+
 # Database (optional - defaults to ./fitai.db)
 DATABASE_PATH=./fitai.db
 

apps/admin/src/app/api/invitations/[id]/resend/route.ts

@@ -0,0 +1,89 @@
+import { NextRequest, NextResponse } from "next/server";
+import { auth, clerkClient } from "@clerk/nextjs/server";
+import log from "@/lib/logger";
+
+/**
+ * POST /api/invitations/[id]/resend
+ *
+ * Resend an invitation with same parameters
+ */
+export async function POST(
+  request: NextRequest,
+  { params }: { params: Promise<{ id: string }> },
+) {
+  try {
+    const { userId } = await auth();
+    if (!userId) {
+      return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+    }
+
+    const { id: invitationId } = await params;
+
+    // Fetch pending invitations to find the one being resent
+    const client = await clerkClient();
+    const invitationList = await client.invitations.getInvitationList({
+      status: "pending",
+    });
+
+    // Find the invitation
+    const invitation = invitationList.data.find(
+      (inv) => inv.id === invitationId,
+    );
+
+    if (!invitation) {
+      return NextResponse.json(
+        { error: "Invitation not found or already processed" },
+        { status: 404 },
+      );
+    }
+
+    const metadata = invitation.publicMetadata as any;
+
+    // Check if current user created this invitation
+    if (metadata?.createdBy !== userId) {
+      return NextResponse.json(
+        { error: "Forbidden - You can only resend invitations you created" },
+        { status: 403 },
+      );
+    }
+
+    // Create new invitation with same parameters
+    const role = metadata?.role;
+
+    // Determine redirect URL based on role
+    const isStaffRole = ["admin", "trainer", "superAdmin"].includes(role);
+    const redirectUrl = isStaffRole
+      ? `${process.env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"}/sign-up`
+      : undefined;
+
+    const newInvitation = await client.invitations.createInvitation({
+      emailAddress: invitation.emailAddress,
+      publicMetadata: invitation.publicMetadata || undefined,
+      redirectUrl,
+      ignoreExisting: true,
+    });
+
+    log.info("Invitation resent", {
+      originalId: invitationId,
+      newId: newInvitation.id,
+      email: invitation.emailAddress,
+      resentBy: userId,
+    });
+
+    return NextResponse.json({
+      data: {
+        invitation: {
+          id: newInvitation.id,
+          email: newInvitation.emailAddress,
+          status: newInvitation.status,
+        },
+      },
+    });
+  } catch (error) {
+    log.error("POST /api/invitations/[id]/resend error:", error);
+    return NextResponse.json(
+      { error: "Failed to resend invitation" },
+      { status: 500 },
+    );
+  }
+}

apps/admin/src/app/api/invitations/[id]/route.ts

@@ -0,0 +1,69 @@
+import { NextRequest, NextResponse } from "next/server";
+import { auth, clerkClient } from "@clerk/nextjs/server";
+import log from "@/lib/logger";
+
+/**
+ * DELETE /api/invitations/[id]
+ *
+ * Revoke a pending invitation (creator-only permission)
+ */
+export async function DELETE(
+  request: NextRequest,
+  { params }: { params: Promise<{ id: string }> },
+) {
+  try {
+    const { userId } = await auth();
+    if (!userId) {
+      return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+    }
+
+    const { id: invitationId } = await params;
+
+    // Fetch pending invitations to find and verify the one being revoked
+    const client = await clerkClient();
+    const invitationList = await client.invitations.getInvitationList({
+      status: "pending",
+    });
+
+    // Find the invitation
+    const invitation = invitationList.data.find(
+      (inv) => inv.id === invitationId,
+    );
+
+    if (!invitation) {
+      return NextResponse.json(
+        { error: "Invitation not found or already processed" },
+        { status: 404 },
+      );
+    }
+
+    const metadata = invitation.publicMetadata as any;
+
+    // Check if current user created this invitation
+    if (metadata?.createdBy !== userId) {
+      return NextResponse.json(
+        { error: "Forbidden - You can only cancel invitations you created" },
+        { status: 403 },
+      );
+    }
+
+    // Revoke the invitation
+    await client.invitations.revokeInvitation(invitationId);
+
+    log.info("Invitation revoked", {
+      invitationId,
+      revokedBy: userId,
+      email: invitation.emailAddress,
+    });
+
+    return NextResponse.json({
+      data: { success: true },
+    });
+  } catch (error) {
+    log.error("DELETE /api/invitations/[id] error:", error);
+    return NextResponse.json(
+      { error: "Failed to revoke invitation" },
+      { status: 500 },
+    );
+  }
+}

apps/admin/src/app/api/invitations/route.ts

@@ -1,5 +1,90 @@
-import { NextResponse } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 import { auth, clerkClient } from "@clerk/nextjs/server";
+import { getAuthContext } from "@/lib/auth/context";
+import { validateGymAccess } from "@/lib/auth/permissions";
+import log from "@/lib/logger";
+
+/**
+ * GET /api/invitations
+ *
+ * Fetch pending invitations with gym and creator filtering.
+ * Users can only see invitations they created, scoped to their gym access.
+ *
+ * Query params:
+ * - gymId: Optional gym filter (superAdmin only)
+ */
+export async function GET(request: NextRequest) {
+  try {
+    const { userId } = await auth();
+    if (!userId) {
+      return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+    }
+
+    // Get auth context
+    const authContext = await getAuthContext();
+    const { role, gymId: userGymId } = authContext;
+
+    // Get query params
+    const { searchParams } = new URL(request.url);
+    const gymIdParam = searchParams.get("gymId");
+
+    // Validate gym access
+    const targetGymId = gymIdParam || undefined;
+    const accessError = validateGymAccess(role, userGymId, targetGymId);
+    if (accessError) return accessError;
+
+    // Fetch all pending invitations from Clerk
+    const client = await clerkClient();
+    const invitationList = await client.invitations.getInvitationList({
+      status: "pending",
+    });
+
+    // Filter invitations based on:
+    // 1. Creator (only show invitations created by current user)
+    // 2. Gym (apply gym-scoping rules)
+    const filteredInvitations = invitationList.data
+      .filter((inv) => {
+        const metadata = inv.publicMetadata as any;
+
+        // Creator filter: only show if user created it
+        if (metadata?.createdBy !== userId) {
+          return false;
+        }
+
+        // Gym filter: SuperAdmin can see all, others only their gym
+        if (role === "superAdmin") {
+          // If gymId param provided, filter by it
+          if (targetGymId && (metadata?.gymId ?? null) !== targetGymId) {
+            return false;
+          }
+          return true;
+        } else {
+          // Non-superAdmins: must match their gym (normalize null/undefined)
+          return (metadata?.gymId ?? null) === (userGymId ?? null);
+        }
+      })
+      .map((inv) => ({
+        id: inv.id,
+        emailAddress: inv.emailAddress,
+        publicMetadata: inv.publicMetadata,
+        status: inv.status,
+        url: inv.url,
+        createdAt: inv.createdAt,
+        updatedAt: inv.updatedAt,
+        revoked: inv.revoked,
+      }));
+
+    return NextResponse.json({
+      data: { invitations: filteredInvitations },
+    });
+  } catch (error) {
+    log.error("GET /api/invitations error:", error);
+    return NextResponse.json(
+      { error: "Failed to fetch invitations" },
+      { status: 500 },
+    );
+  }
+}
 
 /**
  * POST /api/invitations
@@ -129,9 +214,9 @@ export async function POST(req: Request) {
     const invitation = await client.invitations.createInvitation({
       emailAddress: inviteeEmail,
       publicMetadata: {
-        roleAssigned,
+        role: roleAssigned,
         gymId: gymIdForInvite,
-        inviterUserId: inviter.id,
+        createdBy: inviter.id,
       },
     });
 

apps/admin/src/app/api/users/create/route.ts

@@ -84,12 +84,29 @@ export async function POST(request: NextRequest) {
     if (data.sendInvitation && data.email) {
       try {
         const client = await clerkClient();
+
+        // Build publicMetadata with consistent field names
+        const publicMetadata: Record<string, any> = {
+          role: data.role,
+          createdBy: userId,
+          gymId: assignedGymId ?? null,
+        };
+
+        // Determine redirect URL based on role
+        // Staff (admin, trainer, superAdmin) → Admin web app
+        // Clients → Mobile app (handled by Clerk's default)
+        const isStaffRole = ["admin", "trainer", "superAdmin"].includes(
+          data.role,
+        );
+        const redirectUrl = isStaffRole
+          ? `${process.env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"}/sign-up`
+          : undefined; // Clients use default Clerk redirect
+
         const invitation = await client.invitations.createInvitation({
           emailAddress: data.email,
-          publicMetadata: {
-            role: data.role,
-            gymId: assignedGymId,
-          },
+          publicMetadata,
+          redirectUrl,
+          ignoreExisting: true, // Don't fail if invitation already exists
         });
 
         log.info("Clerk invitation sent", {
@@ -97,6 +114,7 @@ export async function POST(request: NextRequest) {
           role: data.role,
           gymId: assignedGymId,
           invitationId: invitation.id,
+          redirectUrl: redirectUrl || "default (mobile app)",
         });
 
         // Send custom invitation email (in addition to Clerk's)
@@ -117,7 +135,22 @@ export async function POST(request: NextRequest) {
       } catch (error: unknown) {
         const errorMessage =
           error instanceof Error ? error.message : "Unknown error";
-        log.error("Failed to send Clerk invitation", error);
+
+        // Extract Clerk-specific error details
+        const clerkError = error as any;
+
+        log.error("Failed to send Clerk invitation", error, {
+          email: data.email,
+          role: data.role,
+          gymId: assignedGymId,
+          publicMetadata: assignedGymId
+            ? { role: data.role, gymId: assignedGymId }
+            : { role: data.role },
+          clerkStatus: clerkError?.status,
+          clerkErrors: clerkError?.errors,
+          clerkTraceId: clerkError?.clerkTraceId,
+        });
+
         return errorResponse(`Failed to send invitation: ${errorMessage}`, {
           status: 500,
         });

apps/admin/src/app/api/users/route.ts

@@ -414,14 +414,15 @@ export async function PUT(request: NextRequest) {
       return forbiddenResponse(`Not authorized to assign role '${role}'`);
     }
 
-    // Authorization: trainers cannot reassign users to different gyms
+    // Authorization: trainers and admins cannot reassign users to different gyms
+    // Only superAdmins can reassign gyms
     if (
-      requesterRole === "trainer" &&
+      requesterRole !== "superAdmin" &&
       gymId !== undefined &&
       gymId !== existingUser.gymId
     ) {
       return forbiddenResponse(
-        "Trainers cannot reassign users to different gyms",
+        "Only superAdmins can reassign users to different gyms",
       );
     }
 

apps/admin/src/components/users/CreateUserModal.tsx

@@ -174,6 +174,10 @@ export function CreateUserModal({
 
       // Reset form
       resetModal();
+
+      // Add delay to allow Clerk API to propagate invitation
+      await new Promise((resolve) => setTimeout(resolve, 1000));
+
       onSuccess();
       onOpenChange(false);
     } catch (error) {

apps/admin/src/components/users/InvitationsGrid.tsx

@@ -0,0 +1,140 @@
+"use client";
+
+import { useState } from "react";
+import { formatDistanceToNow } from "date-fns";
+import { Button } from "@/components/ui/button";
+import { Card } from "@/components/ui/card";
+import { toast } from "@/lib/toast";
+import {
+  useRevokeInvitation,
+  useResendInvitation,
+  type Invitation,
+} from "@/hooks/use-api";
+import { Copy, RefreshCw, Trash2 } from "lucide-react";
+
+interface InvitationsGridProps {
+  invitations: Invitation[];
+  onRefetch: () => void;
+}
+
+export function InvitationsGrid({
+  invitations,
+  onRefetch,
+}: InvitationsGridProps) {
+  const revokeInvitation = useRevokeInvitation();
+  const resendInvitation = useResendInvitation();
+  const [actioningId, setActioningId] = useState<string | null>(null);
+
+  const handleCopyUrl = async (url: string) => {
+    try {
+      await navigator.clipboard.writeText(url);
+      toast.success("Invitation link copied to clipboard");
+    } catch (error) {
+      toast.error("Failed to copy link");
+    }
+  };
+
+  const handleRevoke = async (invitation: Invitation) => {
+    if (!confirm(`Cancel invitation for ${invitation.emailAddress}?`)) {
+      return;
+    }
+
+    setActioningId(invitation.id);
+    try {
+      await revokeInvitation.mutateAsync(invitation.id);
+      toast.success("Invitation cancelled");
+      onRefetch();
+    } catch (error) {
+      toast.error("Failed to cancel invitation");
+    } finally {
+      setActioningId(null);
+    }
+  };
+
+  const handleResend = async (invitation: Invitation) => {
+    setActioningId(invitation.id);
+    try {
+      await resendInvitation.mutateAsync(invitation.id);
+      toast.success("Invitation resent");
+      onRefetch();
+    } catch (error) {
+      toast.error("Failed to resend invitation");
+    } finally {
+      setActioningId(null);
+    }
+  };
+
+  if (invitations.length === 0) {
+    return (
+      <Card className="p-8 text-center text-muted-foreground">
+        No pending invitations
+      </Card>
+    );
+  }
+
+  return (
+    <div className="space-y-4">
+      {invitations.map((invitation) => {
+        const role = invitation.publicMetadata?.role || "unknown";
+        const createdDate = new Date(invitation.createdAt);
+        const isActioning = actioningId === invitation.id;
+
+        return (
+          <Card key={invitation.id} className="p-4">
+            <div className="flex items-center justify-between">
+              <div className="flex-1">
+                <div className="flex items-center gap-2">
+                  <h3 className="font-medium">{invitation.emailAddress}</h3>
+                  <span className="text-xs px-2 py-1 rounded bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200">
+                    Pending
+                  </span>
+                  <span className="text-xs px-2 py-1 rounded bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200">
+                    {role}
+                  </span>
+                </div>
+                <p className="text-sm text-muted-foreground mt-1">
+                  Sent {formatDistanceToNow(createdDate, { addSuffix: true })}
+                </p>
+              </div>
+
+              <div className="flex items-center gap-2">
+                {invitation.url && (
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => handleCopyUrl(invitation.url!)}
+                  >
+                    <Copy className="h-4 w-4 mr-1" />
+                    Copy Link
+                  </Button>
+                )}
+
+                <Button
+                  variant="outline"
+                  size="sm"
+                  onClick={() => handleResend(invitation)}
+                  disabled={isActioning}
+                >
+                  <RefreshCw
+                    className={`h-4 w-4 mr-1 ${isActioning ? "animate-spin" : ""}`}
+                  />
+                  Resend
+                </Button>
+
+                <Button
+                  variant="destructive"
+                  size="sm"
+                  onClick={() => handleRevoke(invitation)}
+                  disabled={isActioning}
+                >
+                  <Trash2 className="h-4 w-4 mr-1" />
+                  Cancel
+                </Button>
+              </div>
+            </div>
+          </Card>
+        );
+      })}
+    </div>
+  );
+}

apps/admin/src/components/users/UserManagement.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { UserGrid, type User } from "@/components/users/UserGrid";
+import { InvitationsGrid } from "@/components/users/InvitationsGrid";
 import { Card, CardHeader, CardContent } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
 import { useUser } from "@clerk/nextjs";
@@ -14,6 +15,7 @@ import {
   useUpdateUser,
   useDeleteUser,
   useSendInvitation,
+  useInvitations,
 } from "@/hooks/use-api";
 
 interface UserManagementProps {
@@ -23,6 +25,9 @@ interface UserManagementProps {
 export function UserManagement({ gymId }: UserManagementProps) {
   const { user } = useUser();
   const [filter, setFilter] = useState<string>("all");
+  const [viewFilter, setViewFilter] = useState<"all" | "active" | "pending">(
+    "all",
+  );
   const [selectedUser, setSelectedUser] = useState<User | null>(null);
   const [isEditing, setIsEditing] = useState(false);
   const [isDeleting, setIsDeleting] = useState(false);
@@ -40,17 +45,28 @@ export function UserManagement({ gymId }: UserManagementProps) {
 
   const {
     data: users = [],
-    isLoading,
-    refetch,
+    isLoading: usersLoading,
+    refetch: refetchUsers,
   } = useUsers({
     role: filter !== "all" ? filter : undefined,
     gymId,
   });
+
+  const {
+    data: invitations = [],
+    isLoading: invitationsLoading,
+    refetch: refetchInvitations,
+  } = useInvitations(gymId);
+
   const { data: gyms = [] } = useGyms();
   const updateUser = useUpdateUser();
   const deleteUser = useDeleteUser();
   const sendInvitation = useSendInvitation();
 
+  const isLoading =
+    viewFilter === "pending" ? invitationsLoading : usersLoading;
+  const refetch = viewFilter === "pending" ? refetchInvitations : refetchUsers;
+
   const handleUserSelect = (user: User | null) => {
     setSelectedUser(user);
   };
@@ -193,6 +209,19 @@ export function UserManagement({ gymId }: UserManagementProps) {
       <div className="flex justify-between items-center">
         <h2 className="text-2xl font-bold">User Management</h2>
         <div className="flex gap-2">
+          {/* View Filter: All/Active/Pending */}
+          <select
+            value={viewFilter}
+            onChange={(e) =>
+              setViewFilter(e.target.value as "all" | "active" | "pending")
+            }
+            className="px-3 py-2 border rounded-md bg-white dark:bg-gray-800"
+          >
+            <option value="all">All Users</option>
+            <option value="active">Active Users</option>
+            <option value="pending">Pending Invitations</option>
+          </select>
+
           <Button
             variant={filter === "all" ? "default" : "outline"}
             onClick={() => setFilter("all")}
@@ -220,7 +249,7 @@ export function UserManagement({ gymId }: UserManagementProps) {
             variant={filter === "client" ? "default" : "outline"}
             onClick={() => setFilter("client")}
           >
-            Clientsa
+            Clients
           </Button>
           <Button
             variant={filter === "trainer" ? "default" : "outline"}
@@ -245,33 +274,48 @@ export function UserManagement({ gymId }: UserManagementProps) {
 
       <div className="flex justify-between items-center">
         <div className="text-sm text-gray-600">
-          Showing {users.length} users
-          {selectedUser && (
-            <span className="ml-4 text-blue-600">
-              Selected: {selectedUser.firstName} {selectedUser.lastName}
-            </span>
+          {viewFilter === "pending" ? (
+            <>Showing {invitations.length} pending invitations</>
+          ) : (
+            <>
+              Showing {users.length} users
+              {selectedUser && (
+                <span className="ml-4 text-blue-600">
+                  Selected: {selectedUser.firstName} {selectedUser.lastName}
+                </span>
+              )}
+            </>
           )}
         </div>
         <div className="flex gap-2">
           <Button variant="default" onClick={handleRefresh}>
             Refresh
           </Button>
-          <Button variant="default" onClick={handleExport}>
-            Export CSV
-          </Button>
+          {viewFilter !== "pending" && (
+            <Button variant="default" onClick={handleExport}>
+              Export CSV
+            </Button>
+          )}
         </div>
       </div>
 
       <Card>
         <CardContent className="p-0">
-          <UserGrid
-            users={users}
-            onUserSelect={(user) => handleUserSelect(user)}
-            onEditUser={handleEditUser}
-            onDeleteUser={handleDeleteUser}
-            onBulkDelete={handleBulkDelete}
-            loading={isLoading}
-          />
+          {viewFilter === "pending" ? (
+            <InvitationsGrid
+              invitations={invitations}
+              onRefetch={refetchInvitations}
+            />
+          ) : (
+            <UserGrid
+              users={users}
+              onUserSelect={(user) => handleUserSelect(user)}
+              onEditUser={handleEditUser}
+              onDeleteUser={handleDeleteUser}
+              onBulkDelete={handleBulkDelete}
+              loading={isLoading}
+            />
+          )}
         </CardContent>
       </Card>
 
@@ -362,8 +406,12 @@ export function UserManagement({ gymId }: UserManagementProps) {
                 />
               </div>
 
-              {/* Only superAdmins and admins can reassign gyms */}
-              {user?.publicMetadata?.role !== "trainer" && (
+              {/* Only superAdmins can reassign gyms */}
+              {(() => {
+                const currentRole = user?.publicMetadata?.role;
+                console.log("Current user role for gym selector:", currentRole);
+                return currentRole === "superAdmin";
+              })() && (
                 <div className="mb-4">
                   <label className="block text-sm font-medium mb-1">Gym</label>
                   <select
@@ -576,7 +624,10 @@ export function UserManagement({ gymId }: UserManagementProps) {
       <CreateUserModal
         open={createModalOpen}
         onOpenChange={setCreateModalOpen}
-        onSuccess={() => refetch()}
+        onSuccess={() => {
+          refetchUsers();
+          refetchInvitations();
+        }}
       />
     </div>
   );

apps/admin/src/hooks/use-api.ts

@@ -61,6 +61,21 @@ export interface AttendanceRecord {
   type?: string;
 }
 
+export interface Invitation {
+  id: string;
+  emailAddress: string;
+  publicMetadata: {
+    role?: string;
+    gymId?: string;
+    createdBy?: string;
+  } | null;
+  status: "pending" | "accepted" | "revoked" | "expired";
+  url?: string;
+  createdAt: number;
+  updatedAt: number;
+  revoked?: boolean;
+}
+
 async function fetchApi<T>(url: string, options?: RequestInit): Promise<T> {
   const response = await fetch(url, {
     ...options,
@@ -339,13 +354,32 @@ export function useCheckOut() {
   });
 }
 
-export function useInvitations() {
+export function useInvitations(gymId?: string) {
   return useQuery({
-    queryKey: ["invitations"],
-    queryFn: () =>
-      fetchApi<{ data: { invitations: unknown[] } }>("/api/invitations").then(
+    queryKey: ["invitations", gymId],
+    queryFn: () => {
+      const url = gymId
+        ? `/api/invitations?gymId=${gymId}`
+        : "/api/invitations";
+      return fetchApi<{ data: { invitations: Invitation[] } }>(url).then(
         (res) => res.data?.invitations ?? [],
-      ),
+      );
+    },
+    refetchInterval: (query) => {
+      const data = query.state.data;
+      const hasData = data && data.length > 0;
+      const fetchCount = query.state.dataUpdateCount;
+
+      // Poll every 2 seconds if:
+      // 1. No invitations returned yet
+      // 2. Haven't exceeded 5 attempts (10 seconds total)
+      if (!hasData && fetchCount < 5) {
+        return 2000;
+      }
+
+      // Stop polling after 10 seconds or when data is present
+      return false;
+    },
   });
 }
 
@@ -364,6 +398,37 @@ export function useSendInvitation() {
   });
 }
 
+export function useRevokeInvitation() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (invitationId: string) =>
+      fetchApi<{ data: { success: boolean } }>(
+        `/api/invitations/${invitationId}`,
+        { method: "DELETE" },
+      ),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["invitations"] });
+      queryClient.invalidateQueries({ queryKey: ["users"] });
+    },
+  });
+}
+
+export function useResendInvitation() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (invitationId: string) =>
+      fetchApi<{ data: { invitation: any } }>(
+        `/api/invitations/${invitationId}/resend`,
+        { method: "POST" },
+      ),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["invitations"] });
+    },
+  });
+}
+
 export interface AnalyticsData {
   userGrowth: { label: string; value: number }[];
   membershipDistribution: { label: string; value: number; color: string }[];

apps/admin/src/lib/validation/schemas.ts

@@ -16,9 +16,12 @@ export const passwordSchema = z
 export const phoneSchema = z
   .string()
   .optional()
-  .refine((val) => !val || /^\+?[1-9]\d{1,14}$/.test(val), {
-    message: "Invalid phone number format",
-  });
+  .refine(
+    (val) => !val || val.trim() === "" || /^\+?[1-9]\d{1,14}$/.test(val),
+    {
+      message: "Invalid phone number format",
+    },
+  );
 
 export const dateTimeSchema = z.string().datetime("Invalid datetime format");