From 1885c88daa5ef937d2aff37a020b8eeea0b04815 Mon Sep 17 00:00:00 2001
From: Sameer Ahmed <sameernadeemi1111@gmail.com>
Date: Wed, 22 Jan 2025 19:56:27 +0530
Subject: [PATCH 1/3] fixed avatar bug

---
 src/components/UserProfile.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/UserProfile.tsx b/src/components/UserProfile.tsx
index 808f513..f2ba0c0 100644
--- a/src/components/UserProfile.tsx
+++ b/src/components/UserProfile.tsx
@@ -330,7 +330,7 @@ export function UserProfile({ session }: UserProfileProps) {
                 alt="Profile"
                 className="w-full h-full rounded-full object-cover"
               />
-              <Button
+              {editing && <Button
                 onClick={() => setIsPhotoDialogOpen(true)}
                 className="absolute -bottom-3 -right-3 bg-blue-600 hover:bg-blue-700 text-white p-2 rounded-full shadow-lg transform translate-0"
               >
@@ -353,7 +353,7 @@ export function UserProfile({ session }: UserProfileProps) {
                     d="M16.5 12.75a4.5 4.5 0 11-9 0 4.5 4.5 0 019 0zM18.75 10.5h.008v.008h-.008V10.5z"
                   />
                 </svg>
-              </Button>
+              </Button>}
             </div>
           )}
         </div>

From 5b737773f556cd67d9fac0707ebf0ec6f82dfb90 Mon Sep 17 00:00:00 2001
From: Debamitra Mukherjee <debamitra.mukherjee@gmail.com>
Date: Sun, 26 Jan 2025 12:53:21 +0530
Subject: [PATCH 2/3] added trim() to fix whitespace issue with name and role

---
 src/components/Onboarding.tsx  | 4 ++--
 src/components/UserProfile.tsx | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/Onboarding.tsx b/src/components/Onboarding.tsx
index 913f125..c0e7d5d 100644
--- a/src/components/Onboarding.tsx
+++ b/src/components/Onboarding.tsx
@@ -11,8 +11,8 @@ interface OnboardingProps {
 
 // Validation schema
 const onboardingSchema = z.object({
-  name: z.string().min(2, 'Name must be at least 2 characters').max(50, 'Name is too long'),
-  role: z.string().min(2, 'Role must be at least 2 characters').max(50, 'Role is too long'),
+  name: z.string().trim().min(2, 'Name must be at least 2 characters').max(50, 'Name is too long'),
+  role: z.string().trim().min(2, 'Role must be at least 2 characters').max(50, 'Role is too long'),
   bio: z.string().max(500, 'Bio must be less than 500 characters').optional(),
   skills: z.string().max(200, 'Skills list is too long')
     .refine(val => !val || val.split(',').every(skill => skill.trim().length > 0), {
diff --git a/src/components/UserProfile.tsx b/src/components/UserProfile.tsx
index 808f513..0cbedfc 100644
--- a/src/components/UserProfile.tsx
+++ b/src/components/UserProfile.tsx
@@ -15,8 +15,8 @@ interface UserProfileProps {
 
 // Validation schema
 const profileSchema = z.object({
-  name: z.string().min(2, 'Name must be at least 2 characters').max(50, 'Name is too long'),
-  role: z.string().min(2, 'Role must be at least 2 characters').max(50, 'Role is too long'),
+  name: z.string().trim().min(2, 'Name must be at least 2 characters').max(50, 'Name is too long'),
+  role: z.string().trim().min(2, 'Role must be at least 2 characters').max(50, 'Role is too long'),
   bio: z.string().max(500, 'Bio must be less than 500 characters').optional(),
   skills: z.string().max(200, 'Skills list is too long')
     .refine(val => !val || val.split(',').every(skill => skill.trim().length > 0), {

From f7670585391ee344e8134d190d17196aee97a250 Mon Sep 17 00:00:00 2001
From: Sameer Ahmed <sameernadeemi1111@gmail.com>
Date: Sun, 2 Feb 2025 20:01:30 +0530
Subject: [PATCH 3/3] Add username input functionality

---
 src/components/Onboarding.tsx | 45 +++++++++++++++++++++++++++++++++--
 src/types.ts                  |  1 +
 2 files changed, 44 insertions(+), 2 deletions(-)

diff --git a/src/components/Onboarding.tsx b/src/components/Onboarding.tsx
index c0e7d5d..864bc0c 100644
--- a/src/components/Onboarding.tsx
+++ b/src/components/Onboarding.tsx
@@ -9,9 +9,28 @@ interface OnboardingProps {
   session: Session;
 }
 
+const checkUsernameExists = async (username: string) => {
+  const { data, error } = await supabase
+    .from('profiles')
+    .select('username')
+    .eq('username', username);
+  if (error) {
+    console.error('Error checking username:', error);
+    return false;
+  }
+  return data.length > 0;
+};
+
 // Validation schema
 const onboardingSchema = z.object({
   name: z.string().trim().min(2, 'Name must be at least 2 characters').max(50, 'Name is too long'),
+  username: z.string().trim().min(3, 'Username must be at least 3 characters').max(10, 'Username is too long')
+    .refine(async (username) => {
+      const exists = await checkUsernameExists(username);
+      return !exists;
+    }, {
+      message: 'Username already exists'
+    }),
   role: z.string().trim().min(2, 'Role must be at least 2 characters').max(50, 'Role is too long'),
   bio: z.string().max(500, 'Bio must be less than 500 characters').optional(),
   skills: z.string().max(200, 'Skills list is too long')
@@ -54,6 +73,7 @@ export function Onboarding({ session }: OnboardingProps) {
   
   const [formData, setFormData] = useState({
     name: '',
+    username: '',
     role: '',
     bio: '',
     skills: '',
@@ -87,7 +107,7 @@ export function Onboarding({ session }: OnboardingProps) {
     setValidationErrors({});
 
     try {
-      const validatedData = onboardingSchema.parse(formData);
+      const validatedData = await onboardingSchema.parseAsync(formData);
       console.log('Validated data:', validatedData);
 
       // First check if profile exists
@@ -191,7 +211,7 @@ export function Onboarding({ session }: OnboardingProps) {
               <h2 className="text-xl font-semibold text-gray-900 dark:text-white">
                 Required Information
               </h2>
-              
+
               {/* Name Field */}
               <div>
                 <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
@@ -213,6 +233,27 @@ export function Onboarding({ session }: OnboardingProps) {
                 )}
               </div>
 
+              {/* Username Field */}
+              <div>
+                <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
+                  Username <span className="text-red-500">*</span>
+                </label>
+                <input
+                  type="text"
+                  name="username"
+                  value={formData.username}
+                  onChange={handleInputChange}
+                  className="w-full px-4 py-2 text-gray-900 dark:text-gray-100 
+                  bg-white dark:bg-dark-700 border border-gray-300 dark:border-gray-600 
+                  rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 
+                  dark:focus:ring-blue-400 transition-colors duration-200"
+                  required
+                />
+                {validationErrors.username && (
+                  <p className="mt-1 text-sm text-red-600 dark:text-red-400">{validationErrors.username}</p>
+                )}
+              </div>
+
               {/* Role Field */}
               <div>
                 <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
diff --git a/src/types.ts b/src/types.ts
index a9977ff..7ffa95e 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -1,5 +1,6 @@
 export interface Profile {
   user_id: string;
+  username:string;
   name: string;
   bio: string | null;
   skills: string | null;