Add "Set Credentials to Default" btn on "No storage" screen

holium · Oct 12, 2023 · d625bae · d625bae
1 parent 056ed80
commit d625bae
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 30 deletions.
diff --git a/app/src/renderer/apps/System/panels/sections/AccountStorageSection.tsx b/app/src/renderer/apps/System/panels/sections/AccountStorageSection.tsx
@@ -40,7 +40,7 @@ export const AccountStorageSection = ({ account }: Props) => {
       });
   }, [token, ships, account.serverId]);
 
-  const onClickRestartStorage = () => {
+  const onClickRestartStorage = async () => {
     const selectedShip = ships.find((ship) => ship.patp === account.serverId);
 
     if (!token) return;

diff --git a/hosting-holium-com/src/pages/account/storage.tsx b/hosting-holium-com/src/pages/account/storage.tsx
@@ -84,13 +84,19 @@ const S3StoragePresenter = () => {
     getAndSetS3Info(token, selectedShip.id.toString());
   }, [token, ships, selectedShipId]);
 
-  const onClickRestartStorage = () => {
+  const onClickRestartStorage = async () => {
     const selectedShip = ships.find((ship) => ship.id === selectedShipId);
 
     if (!token) return;
     if (!selectedShip) return;
 
-    return thirdEarthApi.setStorage(token, selectedShip.id.toString());
+    try {
+      await thirdEarthApi.setStorage(token, selectedShip.id.toString());
+    } catch (e) {
+      setError('Failed to restart storage.');
+    }
+
+    return;
   };
 
   return (

diff --git a/shared/src/onboarding/components/storage/StorageTroubleshoot.tsx b/shared/src/onboarding/components/storage/StorageTroubleshoot.tsx
@@ -1,11 +1,11 @@
 import { useState } from 'react';
 
-import { Button, Flex, Spinner, Text } from '@holium/design-system/general';
+import { Flex, Spinner } from '@holium/design-system/general';
 
-import { AccountDialogTableRow } from '../../components/AccountDialogTableRow';
+import { GrayButton } from '../ChangeButton';
 
 type Props = {
-  onClick: () => Promise<string> | undefined;
+  onClick: () => Promise<void>;
 };
 
 type DebugState = 'uninitialized' | 'restarting' | 'restarted';
@@ -16,11 +16,11 @@ export const StorageTroubleshoot = ({ onClick }: Props) => {
   const getDebugElement = () => {
     switch (debugState) {
       case 'uninitialized':
-        return <Text.Body>Set Credentials to Default</Text.Body>;
+        return 'Set Credentials to Default';
       case 'restarting':
         return <Spinner size={16} />;
       case 'restarted':
-        return <Text.Body>Restarted</Text.Body>;
+        return 'Restarted';
       default:
         return null;
     }
@@ -33,20 +33,17 @@ export const StorageTroubleshoot = ({ onClick }: Props) => {
   };
 
   return (
-    <AccountDialogTableRow title="Troubleshoot">
-      <Flex flex={1} justifyContent="flex-end">
-        <Button.Secondary
-          type="button"
-          width="191px"
-          height="28px"
-          alignItems="center"
-          justifyContent="center"
-          disabled={['restarting', 'restarted'].includes(debugState)}
-          onClick={handleOnClick}
-        >
-          {getDebugElement()}
-        </Button.Secondary>
-      </Flex>
-    </AccountDialogTableRow>
+    <Flex flex={1} justifyContent="flex-end">
+      <GrayButton
+        type="button"
+        width="195px"
+        alignItems="center"
+        justifyContent="center"
+        disabled={['restarting', 'restarted'].includes(debugState)}
+        onClick={handleOnClick}
+      >
+        {getDebugElement()}
+      </GrayButton>
+    </Flex>
   );
 };
diff --git a/shared/src/onboarding/dialogs/AccountStorage/AccountStorageDialog.tsx b/shared/src/onboarding/dialogs/AccountStorage/AccountStorageDialog.tsx
@@ -19,7 +19,7 @@ type Props = {
   };
   isLoading: boolean;
   error: string | undefined;
-  onClickRestartStorage: () => Promise<string> | undefined;
+  onClickRestartStorage: () => Promise<void>;
   setSelectedShipId: (newId: number) => void;
   onClickPurchaseId: () => void;
   onClickUploadPier: () => void;

diff --git a/shared/src/onboarding/dialogs/AccountStorage/AccountStorageDialogBody.tsx b/shared/src/onboarding/dialogs/AccountStorage/AccountStorageDialogBody.tsx
@@ -1,4 +1,4 @@
-import { ErrorBox } from '@holium/design-system/general';
+import { ErrorBox, Flex } from '@holium/design-system/general';
 
 import { AccountDialogDescription } from '../../components/AccountDialog.styles';
 import { AccountDialogTableRow } from '../../components/AccountDialogTableRow';
@@ -21,7 +21,7 @@ type Props = {
     minioUsage: number;
   };
   error: string | undefined;
-  onClickRestartStorage: () => Promise<string> | undefined;
+  onClickRestartStorage: () => Promise<void>;
 };
 
 export const AccountStorageDialogBody = ({
@@ -35,9 +35,12 @@ export const AccountStorageDialogBody = ({
 }: Props) => {
   if (error) {
     return (
-      <AccountDialogTable>
+      <>
         <ErrorBox>{error}</ErrorBox>
-      </AccountDialogTable>
+        <Flex flexDirection="column" alignItems="center">
+          <StorageTroubleshoot onClick={onClickRestartStorage} />
+        </Flex>
+      </>
     );
   }
 
@@ -56,7 +59,9 @@ export const AccountStorageDialogBody = ({
         </AccountDialogDescription>
       </AccountDialogTableRow>
       <StoragePassword storagePassword={storagePassword} />
-      <StorageTroubleshoot onClick={onClickRestartStorage} />
+      <AccountDialogTableRow title="Troubleshoot">
+        <StorageTroubleshoot onClick={onClickRestartStorage} />
+      </AccountDialogTableRow>
     </AccountDialogTable>
   );
 };
diff --git a/shared/src/onboarding/dialogs/Login.WEB.stories.tsx b/shared/src/onboarding/dialogs/Login.WEB.stories.tsx
@@ -70,7 +70,7 @@ export const AccountStorageDialogStory: ComponentStory<
     <AccountStorageDialog
       ships={[thirdEarthMockShip]}
       selectedShipId={0}
-      onClickRestartStorage={() => Promise.resolve('')}
+      onClickRestartStorage={() => Promise.resolve()}
       setSelectedShipId={() => {}}
       onClickPurchaseId={() => {}}
       onClickUploadPier={() => {}}