dauth-context-react 6.3.0 → 6.4.0

package/dist/index.mjs

@@ -24,7 +24,8 @@ var initialDauthState = {
   deleteAccount: () => Promise.resolve(false),
   getPasskeyCredentials: () => Promise.resolve([]),
   registerPasskey: () => Promise.resolve(null),
-  deletePasskeyCredential: () => Promise.resolve(false)
+  deletePasskeyCredential: () => Promise.resolve(false),
+  uploadAvatar: () => Promise.resolve(false)
 };
 var initialDauthState_default = initialDauthState;
 
@@ -186,6 +187,18 @@ async function deletePasskeyCredentialAPI(basePath, credentialId) {
   const data = await response.json();
   return { response, data };
 }
+async function uploadAvatarAPI(basePath, file) {
+  const formData = new FormData();
+  formData.append("avatar", file);
+  const response = await fetch(`${basePath}/avatar`, {
+    method: "POST",
+    headers: { "X-CSRF-Token": getCsrfToken() },
+    credentials: "include",
+    body: formData
+  });
+  const data = await response.json();
+  return { response, data };
+}
 
 // src/webauthn.ts
 function base64urlToBuffer(base64url) {
@@ -441,6 +454,30 @@ async function deletePasskeyCredentialAction(ctx, credentialId) {
     return false;
   }
 }
+async function uploadAvatarAction(ctx, file) {
+  const { dispatch, authProxyPath, onError } = ctx;
+  try {
+    const result = await uploadAvatarAPI(authProxyPath, file);
+    if (result.response.status === 200) {
+      dispatch({
+        type: UPDATE_USER,
+        payload: result.data.user
+      });
+      return true;
+    }
+    onError(
+      new Error(
+        "Avatar upload error: " + result.data.message
+      )
+    );
+    return false;
+  } catch (error) {
+    onError(
+      error instanceof Error ? error : new Error("Avatar upload error")
+    );
+    return false;
+  }
+}
 var resetUser = (dispatch) => {
   return dispatch({
     type: LOGIN,
@@ -750,7 +787,8 @@ function DauthProfileModal({
     logout,
     getPasskeyCredentials,
     registerPasskey,
-    deletePasskeyCredential
+    deletePasskeyCredential,
+    uploadAvatar
   } = useDauth();
   const isDesktop = useMediaQuery("(min-width: 641px)");
   const phase = useModalAnimation(open);
@@ -958,19 +996,21 @@ function DauthProfileModal({
     [deletePasskeyCredential]
   );
   const handleAvatarClick = useCallback(() => {
-    if (onAvatarUpload) {
-      avatarInputRef.current?.click();
-    }
-  }, [onAvatarUpload]);
+    avatarInputRef.current?.click();
+  }, []);
   const handleAvatarChange = useCallback(
     async (e) => {
       const file = e.target.files?.[0];
-      if (!file || !onAvatarUpload) return;
+      if (!file) return;
       setUploadingAvatar(true);
       try {
-        const url = await onAvatarUpload(file);
-        if (url) {
-          await updateUser({ avatar: url });
+        if (onAvatarUpload) {
+          const url = await onAvatarUpload(file);
+          if (url) {
+            await updateUser({ avatar: url });
+          }
+        } else {
+          await uploadAvatar(file);
         }
       } catch {
       }
@@ -979,7 +1019,7 @@ function DauthProfileModal({
         avatarInputRef.current.value = "";
       }
     },
-    [onAvatarUpload, updateUser]
+    [onAvatarUpload, updateUser, uploadAvatar]
   );
   const handleSignOut = useCallback(() => {
     logout();
@@ -1121,7 +1161,7 @@ function DauthProfileModal({
                         {
                           style: {
                             ...avatarCircle,
-                            cursor: onAvatarUpload ? "pointer" : "default",
+                            cursor: "pointer",
                             position: "relative"
                           },
                           onClick: handleAvatarClick,
@@ -1138,12 +1178,12 @@ function DauthProfileModal({
                                 }
                               }
                             ) : avatarInitial,
-                            onAvatarUpload && !uploadingAvatar && /* @__PURE__ */ jsx("div", { style: avatarOverlay, children: /* @__PURE__ */ jsx(IconCamera, {}) })
+                            !uploadingAvatar && /* @__PURE__ */ jsx("div", { style: avatarOverlay, children: /* @__PURE__ */ jsx(IconCamera, {}) })
                           ]
                         }
                       ),
                       /* @__PURE__ */ jsx("div", { style: emailText, children: user.email }),
-                      onAvatarUpload && /* @__PURE__ */ jsx(
+                      /* @__PURE__ */ jsx(
                         "input",
                         {
                           ref: avatarInputRef,
@@ -2213,6 +2253,10 @@ var DauthProvider = (props) => {
     (credentialId) => deletePasskeyCredentialAction(ctx, credentialId),
     [ctx]
   );
+  const uploadAvatar = useCallback2(
+    (file) => uploadAvatarAction(ctx, file),
+    [ctx]
+  );
   const memoProvider = useMemo2(
     () => ({
       ...dauthState,
@@ -2222,7 +2266,8 @@ var DauthProvider = (props) => {
       deleteAccount,
       getPasskeyCredentials,
       registerPasskey,
-      deletePasskeyCredential
+      deletePasskeyCredential,
+      uploadAvatar
     }),
     [
       dauthState,
@@ -2232,7 +2277,8 @@ var DauthProvider = (props) => {
       deleteAccount,
       getPasskeyCredentials,
       registerPasskey,
-      deletePasskeyCredential
+      deletePasskeyCredential,
+      uploadAvatar
     ]
   );
   return /* @__PURE__ */ jsx2(DauthContext.Provider, { value: memoProvider, children });