init

src/features/profile/components/profile-view-page.tsx

@@ -0,0 +1,41 @@
+'use client';
+
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { useSession } from 'next-auth/react';
+
+export default function ProfileViewPage() {
+  const { data: session, status } = useSession();
+
+  if (status === 'loading') {
+    return <div className='p-4 text-sm text-muted-foreground'>Loading profile...</div>;
+  }
+
+  return (
+    <div className='flex w-full flex-col p-4'>
+      <Card className='max-w-2xl'>
+        <CardHeader>
+          <CardTitle>Profile</CardTitle>
+          <CardDescription>
+            This app-owned profile summary replaces the old Clerk-hosted profile screen.
+          </CardDescription>
+        </CardHeader>
+        <CardContent className='space-y-4 text-sm'>
+          <div className='rounded-lg border p-4'>
+            <div className='text-muted-foreground'>Name</div>
+            <div className='font-medium'>{session?.user?.name ?? 'Unknown user'}</div>
+          </div>
+          <div className='rounded-lg border p-4'>
+            <div className='text-muted-foreground'>Email</div>
+            <div className='font-medium'>{session?.user?.email ?? 'No email available'}</div>
+          </div>
+          <div className='rounded-lg border p-4'>
+            <div className='text-muted-foreground'>Active workspace</div>
+            <div className='font-medium'>
+              {session?.user?.activeOrganizationName ?? 'No active workspace'}
+            </div>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

src/features/profile/utils/form-schema.ts

@@ -0,0 +1,27 @@
+import * as z from 'zod';
+
+export const profileSchema = z.object({
+  firstname: z.string().min(3, { message: 'Product Name must be at least 3 characters' }),
+  lastname: z.string().min(3, { message: 'Product Name must be at least 3 characters' }),
+  email: z.string().email({ message: 'Product Name must be at least 3 characters' }),
+  contactno: z.coerce.number(),
+  country: z.string().min(1, { message: 'Please select a category' }),
+  city: z.string().min(1, { message: 'Please select a category' }),
+  // jobs array is for the dynamic fields
+  jobs: z.array(
+    z.object({
+      jobcountry: z.string().min(1, { message: 'Please select a category' }),
+      jobcity: z.string().min(1, { message: 'Please select a category' }),
+      jobtitle: z.string().min(3, { message: 'Product Name must be at least 3 characters' }),
+      employer: z.string().min(3, { message: 'Product Name must be at least 3 characters' }),
+      startdate: z.string().refine((value) => /^\d{4}-\d{2}-\d{2}$/.test(value), {
+        message: 'Start date should be in the format YYYY-MM-DD'
+      }),
+      enddate: z.string().refine((value) => /^\d{4}-\d{2}-\d{2}$/.test(value), {
+        message: 'End date should be in the format YYYY-MM-DD'
+      })
+    })
+  )
+});
+
+export type ProfileFormValues = z.infer<typeof profileSchema>;