ui

frontend/src/app/SettingsRoute.jsx

@@ -2,21 +2,15 @@ import React, { useEffect, useCallback } from 'react';
 import { useNavigate } from 'react-router-dom';
 import SettingsModal from '../settings/SettingsModal';
 import { useAppShell } from '../appShellContext';
+import useApiTokens from '../settings/useApiTokens';
+import { api } from './appState';
 
 const SettingsRoute = () => {
   const navigate = useNavigate();
   const {
-    webdavTokens,
-    webdavTokensLoading,
-    creatingWebdavToken,
-    deletingWebdavTokenId,
-    regeneratingWebdavTokenId,
-    refreshWebdavTokens,
-    createWebdavToken,
-    deleteWebdavToken,
-    regenerateWebdavToken,
-    webdavTokenSecret,
-    dismissCreatedWebdavToken,
+    token,
+    notifyApiError,
+    setStatusMessage,
     passkeys,
     passkeysSupported,
     passkeysLoading,
@@ -27,15 +21,31 @@ const SettingsRoute = () => {
     revokePasskey,
   } = useAppShell();
 
+  const {
+    tokens,
+    loading,
+    creating,
+    deletingId,
+    regeneratingId,
+    updatingId,
+    createdSecret,
+    refresh,
+    create,
+    revoke,
+    regenerate,
+    updateCapabilities,
+    dismissSecret,
+  } = useApiTokens({ api, token, notifyApiError, setStatusMessage });
+
   useEffect(() => {
-    refreshWebdavTokens();
+    refresh();
     refreshPasskeys();
-  }, [refreshWebdavTokens, refreshPasskeys]);
+  }, [refresh, refreshPasskeys]);
 
   const handleClose = useCallback(() => {
-    dismissCreatedWebdavToken();
+    dismissSecret();
     navigate(-1);
-  }, [dismissCreatedWebdavToken, navigate]);
+  }, [dismissSecret, navigate]);
 
   useEffect(() => {
     const handleKeyDown = (event) => {
@@ -49,24 +59,26 @@ const SettingsRoute = () => {
   }, [handleClose]);
 
   useEffect(() => () => {
-    dismissCreatedWebdavToken();
-  }, [dismissCreatedWebdavToken]);
+    dismissSecret();
+  }, [dismissSecret]);
 
   return (
     <SettingsModal
       open
       onClose={handleClose}
-      tokens={webdavTokens}
-      loading={webdavTokensLoading}
-      creating={creatingWebdavToken}
-      deletingId={deletingWebdavTokenId}
-      regeneratingId={regeneratingWebdavTokenId}
-      onRefresh={refreshWebdavTokens}
-      onCreate={createWebdavToken}
-      onDelete={deleteWebdavToken}
-      onRegenerate={regenerateWebdavToken}
-      createdToken={webdavTokenSecret}
-      onDismissCreatedToken={dismissCreatedWebdavToken}
+      tokens={tokens}
+      loading={loading}
+      creating={creating}
+      deletingId={deletingId}
+      regeneratingId={regeneratingId}
+      updatingId={updatingId}
+      onRefresh={refresh}
+      onCreate={create}
+      onDelete={revoke}
+      onRegenerate={regenerate}
+      onUpdateCapabilities={updateCapabilities}
+      createdToken={createdSecret}
+      onDismissCreatedToken={dismissSecret}
       passkeys={passkeys}
       passkeysSupported={passkeysSupported}
       passkeysLoading={passkeysLoading}