Support add/edit identity

example/capacitor/src/pages/Home.tsx

@@ -127,6 +127,7 @@ function AuthgearDemo() {
     return readUseWebKitWebView();
   });
   const [biometricEnabled, setBiometricEnabled] = useState<boolean>(false);
+  const [userInfo, setUserInfo] = useState<UserInfo | null>(null);
 
   const [preAuthenticatedURLEnabled, setIsPreAuthenticatedURLEnabled] =
     useState(() => {
@@ -212,9 +213,11 @@ function AuthgearDemo() {
     }
 
     if (isPlatformWeb()) {
-      await authgearWeb.fetchUserInfo();
+      const userInfo = await authgearWeb.fetchUserInfo();
+      setUserInfo(userInfo);
     } else {
-      await authgearCapacitor.fetchUserInfo();
+      const userInfo = await authgearCapacitor.fetchUserInfo();
+      setUserInfo(userInfo);
     }
 
     setInitialized(true);
@@ -299,6 +302,7 @@ function AuthgearDemo() {
           page: page === "" ? undefined : page,
           authenticationFlowGroup,
         });
+        setUserInfo(result.userInfo);
         showUserInfo(result.userInfo);
       }
     } catch (e) {
@@ -334,6 +338,7 @@ function AuthgearDemo() {
       const { userInfo } = await authgearCapacitor.authenticateBiometric(
         biometricOptions
       );
+      setUserInfo(userInfo);
       showUserInfo(userInfo);
     } catch (e: unknown) {
       showError(e);
@@ -554,14 +559,76 @@ function AuthgearDemo() {
     }
   }, [showError]);
 
+  const addEmail = useCallback(async () => {
+    if (isPlatformWeb()) {
+      // Not implemented.
+    } else {
+      authgearCapacitor.addEmail({
+        redirectURI: REDIRECT_URI_CAPACITOR,
+      });
+    }
+  }, []);
+
+  const addPhone = useCallback(async () => {
+    if (isPlatformWeb()) {
+      // Not implemented.
+    } else {
+      authgearCapacitor.addPhone({
+        redirectURI: REDIRECT_URI_CAPACITOR,
+      });
+    }
+  }, []);
+
+  const addUsername = useCallback(async () => {
+    if (isPlatformWeb()) {
+      // Not implemented.
+    } else {
+      authgearCapacitor.addUsername({
+        redirectURI: REDIRECT_URI_CAPACITOR,
+      });
+    }
+  }, []);
+
+  const changeEmail = useCallback(async () => {
+    if (isPlatformWeb()) {
+      // Not implemented.
+    } else {
+      authgearCapacitor.changeEmail(userInfo?.email ?? "", {
+        redirectURI: REDIRECT_URI_CAPACITOR,
+      });
+    }
+  }, [userInfo]);
+
+  const changePhone = useCallback(async () => {
+    if (isPlatformWeb()) {
+      // Not implemented.
+    } else {
+      authgearCapacitor.changePhone(userInfo?.phoneNumber ?? "", {
+        redirectURI: REDIRECT_URI_CAPACITOR,
+      });
+    }
+  }, [userInfo]);
+
+  const changeUsername = useCallback(async () => {
+    if (isPlatformWeb()) {
+      // Not implemented.
+    } else {
+      authgearCapacitor.changeUsername(userInfo?.preferredUsername ?? "", {
+        redirectURI: REDIRECT_URI_CAPACITOR,
+      });
+    }
+  }, [userInfo]);
+
   const fetchUserInfo = useCallback(async () => {
     setLoading(true);
     try {
       if (isPlatformWeb()) {
         const userInfo = await authgearWeb.fetchUserInfo();
+        setUserInfo(userInfo);
         showUserInfo(userInfo);
       } else {
         const userInfo = await authgearCapacitor.fetchUserInfo();
+        setUserInfo(userInfo);
         showUserInfo(userInfo);
       }
     } catch (e) {
@@ -803,6 +870,66 @@ function AuthgearDemo() {
     [deleteAccount]
   );
 
+  const onClickAddEmail = useCallback(
+    (e: MouseEvent<HTMLIonButtonElement>) => {
+      e.preventDefault();
+      e.stopPropagation();
+
+      addEmail();
+    },
+    [addEmail]
+  );
+
+  const onClickAddPhone = useCallback(
+    (e: MouseEvent<HTMLIonButtonElement>) => {
+      e.preventDefault();
+      e.stopPropagation();
+
+      addPhone();
+    },
+    [addPhone]
+  );
+
+  const onClickAddUsername = useCallback(
+    (e: MouseEvent<HTMLIonButtonElement>) => {
+      e.preventDefault();
+      e.stopPropagation();
+
+      addUsername();
+    },
+    [addUsername]
+  );
+
+  const onClickChangeEmail = useCallback(
+    (e: MouseEvent<HTMLIonButtonElement>) => {
+      e.preventDefault();
+      e.stopPropagation();
+
+      changeEmail();
+    },
+    [changeEmail]
+  );
+
+  const onClickChangePhone = useCallback(
+    (e: MouseEvent<HTMLIonButtonElement>) => {
+      e.preventDefault();
+      e.stopPropagation();
+
+      changePhone();
+    },
+    [changePhone]
+  );
+
+  const onClickChangeUsername = useCallback(
+    (e: MouseEvent<HTMLIonButtonElement>) => {
+      e.preventDefault();
+      e.stopPropagation();
+
+      changeUsername();
+    },
+    [changeUsername]
+  );
+
   const onClickFetchUserInfo = useCallback(
     (e: MouseEvent<HTMLIonButtonElement>) => {
       e.preventDefault();
@@ -1022,6 +1149,68 @@ function AuthgearDemo() {
             Delete Account
           </IonButton>
         )}
+        {isPlatformWeb() ? null : (
+          <IonButton
+            className="button"
+            disabled={!initialized || !loggedIn || userInfo?.email != null}
+            onClick={onClickAddEmail}
+          >
+            Add Email
+          </IonButton>
+        )}
+        {isPlatformWeb() ? null : (
+          <IonButton
+            className="button"
+            disabled={
+              !initialized || !loggedIn || userInfo?.phoneNumber != null
+            }
+            onClick={onClickAddPhone}
+          >
+            Add Phone
+          </IonButton>
+        )}
+        {isPlatformWeb() ? null : (
+          <IonButton
+            className="button"
+            disabled={
+              !initialized || !loggedIn || userInfo?.preferredUsername != null
+            }
+            onClick={onClickAddUsername}
+          >
+            Add Username
+          </IonButton>
+        )}
+        {isPlatformWeb() ? null : (
+          <IonButton
+            className="button"
+            disabled={!initialized || !loggedIn || userInfo?.email == null}
+            onClick={onClickChangeEmail}
+          >
+            Change Email
+          </IonButton>
+        )}
+        {isPlatformWeb() ? null : (
+          <IonButton
+            className="button"
+            disabled={
+              !initialized || !loggedIn || userInfo?.phoneNumber == null
+            }
+            onClick={onClickChangePhone}
+          >
+            Change Phone
+          </IonButton>
+        )}
+        {isPlatformWeb() ? null : (
+          <IonButton
+            className="button"
+            disabled={
+              !initialized || !loggedIn || userInfo?.preferredUsername == null
+            }
+            onClick={onClickChangeUsername}
+          >
+            Change Username
+          </IonButton>
+        )}
         <IonButton
           className="button"
           disabled={!initialized || loading || !loggedIn}

example/reactnative/ios/Podfile.lock

@@ -1,5 +1,5 @@
 PODS:
-  - authgear-react-native (3.2.0):
+  - authgear-react-native (4.0.0):
     - React-Core
   - boost (1.84.0)
   - DoubleConversion (1.1.6)
@@ -1746,7 +1746,7 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/yoga"
 
 SPEC CHECKSUMS:
-  authgear-react-native: aa19f7401a0b175c1efe775f06e275c5dc1f91ae
+  authgear-react-native: 6924f81be4069a70145ed45beae54045f0a47e73
   boost: 7e761d76ca2ce687f7cc98e698152abd03a18f90
   DoubleConversion: cb417026b2400c8f53ae97020b2be961b59470cb
   fast_float: 06eeec4fe712a76acc9376682e4808b05ce978b6

example/reactnative/src/screens/MainScreen.tsx

@@ -686,6 +686,66 @@ const HomeScreen: React.FC = () => {
       .catch(err => showError(err));
   }, [showError, colorScheme]);
 
+  const addEmail = useCallback(async () => {
+    authgear
+      .addEmail({
+        redirectURI: redirectURI,
+        colorScheme: colorScheme as ColorScheme,
+        wechatRedirectURI,
+      })
+      .catch(err => showError(err));
+  }, [showError, colorScheme]);
+
+  const addPhone = useCallback(async () => {
+    authgear
+      .addPhone({
+        redirectURI: redirectURI,
+        colorScheme: colorScheme as ColorScheme,
+        wechatRedirectURI,
+      })
+      .catch(err => showError(err));
+  }, [showError, colorScheme]);
+
+  const addUsername = useCallback(async () => {
+    authgear
+      .addUsername({
+        redirectURI: redirectURI,
+        colorScheme: colorScheme as ColorScheme,
+        wechatRedirectURI,
+      })
+      .catch(err => showError(err));
+  }, [showError, colorScheme]);
+
+  const editEmail = useCallback(async () => {
+    authgear
+      .changeEmail(userInfo?.email ?? '', {
+        redirectURI: redirectURI,
+        colorScheme: colorScheme as ColorScheme,
+        wechatRedirectURI,
+      })
+      .catch(err => showError(err));
+  }, [showError, colorScheme, userInfo]);
+
+  const editPhone = useCallback(async () => {
+    authgear
+      .changePhone(userInfo?.phoneNumber ?? '', {
+        redirectURI: redirectURI,
+        colorScheme: colorScheme as ColorScheme,
+        wechatRedirectURI,
+      })
+      .catch(err => showError(err));
+  }, [showError, colorScheme, userInfo]);
+
+  const editUsername = useCallback(async () => {
+    authgear
+      .changeUsername(userInfo?.preferredUsername ?? '', {
+        redirectURI: redirectURI,
+        colorScheme: colorScheme as ColorScheme,
+        wechatRedirectURI,
+      })
+      .catch(err => showError(err));
+  }, [showError, colorScheme, userInfo]);
+
   const fetchUserInfo = useCallback(() => {
     setLoading(true);
     authgear
@@ -947,6 +1007,63 @@ const HomeScreen: React.FC = () => {
             disabled={!initialized || !loggedIn}
           />
         </View>
+
+        <View style={styles.button}>
+          <Button
+            title="Add Email"
+            onPress={addEmail}
+            disabled={!initialized || !loggedIn || userInfo?.email != null}
+          />
+        </View>
+
+        <View style={styles.button}>
+          <Button
+            title="Add Phone"
+            onPress={addPhone}
+            disabled={
+              !initialized || !loggedIn || userInfo?.phoneNumber != null
+            }
+          />
+        </View>
+
+        <View style={styles.button}>
+          <Button
+            title="Add Username"
+            onPress={addUsername}
+            disabled={
+              !initialized || !loggedIn || userInfo?.preferredUsername != null
+            }
+          />
+        </View>
+
+        <View style={styles.button}>
+          <Button
+            title="Edit Email"
+            onPress={editEmail}
+            disabled={!initialized || !loggedIn || userInfo?.email == null}
+          />
+        </View>
+
+        <View style={styles.button}>
+          <Button
+            title="Edit Phone"
+            onPress={editPhone}
+            disabled={
+              !initialized || !loggedIn || userInfo?.phoneNumber == null
+            }
+          />
+        </View>
+
+        <View style={styles.button}>
+          <Button
+            title="Edit Username"
+            onPress={editUsername}
+            disabled={
+              !initialized || !loggedIn || userInfo?.preferredUsername == null
+            }
+          />
+        </View>
+
         <View style={styles.button}>
           <Button
             title="Fetch User Info"