Refactored username assignment to use fallback based on user email address

Author: ladunjexa

app/api/webhook/clerk/route.ts

@@ -60,15 +60,19 @@ export async function POST(req: Request) {
     const { id, email_addresses, image_url, username, first_name, last_name } =
       evt.data;
 
+    const parts = email_addresses[0].email_address.split("@");
+
     // create a new user in database
     const mongoUser = await createUser({
       clerkId: id,
       name: `${first_name}${last_name ? ` ${last_name}` : ""}`,
-      username: username || "",
+      username: username || `${parts[0]}-${parts[1].split(".")[0]}`,
       email: email_addresses[0].email_address,
       picture: image_url,
     });
 
+    console.log(mongoUser);
+
     return NextResponse.json({ message: "User created", user: mongoUser });
   }
 

components/forms/Profile.tsx

@@ -32,6 +32,7 @@ const Profile = ({ clerkId, user }: Props) => {
   const router = useRouter();
   const pathname = usePathname();
   const parsedUser = JSON.parse(user);
+
   const [isSubmitting, setIsSubmitting] = useState<boolean>(false);
 
   const form = useForm<z.infer<typeof ProfileValidation>>({
@@ -61,6 +62,7 @@ const Profile = ({ clerkId, user }: Props) => {
         },
         path: pathname,
       });
+
       router.push("/");
     } catch (error) {
       toast({