feat(#1782): implemented privy updateEmail

apps/web/src/app/[lang]/profile/[personSlug]/@aside/edit/page.tsx

@@ -17,6 +17,7 @@ import {
 } from '@hypha-platform/core/client';
 import { z } from 'zod';
 import { tryDecodeUriPart } from '@hypha-platform/ui-utils';
+import { useUpdateAccount, usePrivy } from '@privy-io/react-auth';
 
 export default function EditProfilePage() {
   const { lang, personSlug: personSlugRaw } = useParams<ProfilePageParams>();
@@ -32,16 +33,76 @@ export default function EditProfilePage() {
     reset,
   } = useEditProfile();
   const router = useRouter();
+  const { user: privyUser, authenticated } = usePrivy();
+
+  const hasEmailAccount = !!privyUser?.email?.address;
+  const currentPrivyEmail = privyUser?.email?.address;
+
+  const hasOAuthAccount = !!(privyUser?.google || privyUser?.apple);
+  const cannotChangeEmail =
+    authenticated && hasOAuthAccount && !hasEmailAccount;
 
   const schemaEditPersonForm = schemaEditPersonWeb2.extend(
     editPersonFiles.shape,
   );
   type EditPersonFormData = z.infer<typeof schemaEditPersonForm>;
 
+  const pendingFormDataRef = React.useRef<EditPersonFormData | null>(null);
+
+  const { updateEmail } = useUpdateAccount({
+    onSuccess: async () => {
+      if (pendingFormDataRef.current) {
+        try {
+          await editProfile(pendingFormDataRef.current);
+          pendingFormDataRef.current = null;
+          router.push('/profile');
+        } catch (err) {
+          console.log(err);
+          pendingFormDataRef.current = null;
+        }
+      }
+    },
+    onError: (error, details) => {
+      console.error('Error updating email in Privy:', error, details);
+      if (
+        error?.includes('does not have an email linked') ||
+        error?.includes('email account')
+      ) {
+        if (pendingFormDataRef.current) {
+          editProfile(pendingFormDataRef.current)
+            .then(() => {
+              router.push('/profile');
+            })
+            .catch((err) => {
+              console.log(err);
+            })
+            .finally(() => {
+              pendingFormDataRef.current = null;
+            });
+        }
+      } else {
+        pendingFormDataRef.current = null;
+      }
+    },
+  });
+
   const onEdit = async (data: EditPersonFormData) => {
     try {
-      await editProfile(data);
-      router.push('/profile');
+      const newEmail = data.email?.trim();
+      const emailChanged =
+        authenticated &&
+        hasEmailAccount &&
+        currentPrivyEmail &&
+        newEmail &&
+        newEmail !== currentPrivyEmail;
+
+      if (emailChanged) {
+        pendingFormDataRef.current = data;
+        updateEmail();
+      } else {
+        await editProfile(data);
+        router.push('/profile');
+      }
     } catch (err) {
       console.log(err);
     }
@@ -71,6 +132,7 @@ export default function EditProfilePage() {
           onEdit={onEdit}
           onUpdate={revalidate}
           error={error}
+          cannotChangeEmail={cannotChangeEmail}
         />
       </LoadingBackdrop>
     </SidePanel>

packages/epics/src/people/components/edit-person-section.tsx

@@ -48,6 +48,7 @@ export type EditPersonSectionProps = {
   onEdit: (values: z.infer<typeof schemaEditPersonForm>) => Promise<void>;
   onUpdate: () => void;
   error?: string | null;
+  cannotChangeEmail?: boolean;
 };
 
 type FormData = z.infer<typeof schemaEditPersonForm>;
@@ -59,6 +60,7 @@ export const EditPersonSection = ({
   onEdit,
   onUpdate,
   error,
+  cannotChangeEmail = false,
 }: EditPersonSectionProps) => {
   const formRef = useRef<HTMLFormElement>(null);
   const form = useForm<FormData>({
@@ -242,7 +244,7 @@ export const EditPersonSection = ({
                       <FormItem>
                         <FormControl>
                           <Input
-                            disabled={isLoading}
+                            disabled={isLoading || cannotChangeEmail}
                             placeholder="Email"
                             className="w-60"
                             {...field}
@@ -254,6 +256,18 @@ export const EditPersonSection = ({
                   />
                 </span>
               </div>
+              {cannotChangeEmail && (
+                <div className="bg-neutral-3 border border-neutral-6 rounded-lg p-4">
+                  <Text className={cn('text-2', 'text-neutral-11')}>
+                    You cannot change the email address on your Privy account
+                    directly if you log in with Google SSO, because the email is
+                    managed by Google. You must update the email address within
+                    your Google Account settings first. If you log in to Privy
+                    with a standard account (not Google SSO), you can change the
+                    email directly in your Privy profile settings.
+                  </Text>
+                </div>
+              )}
               <div className="flex justify-between">
                 <Text className={cn('text-2', 'text-neutral-11')}>
                   Location