feat(dcellar-web-ui): add data update after migrate bucket

node-real · May 23, 2024 · 627aaaa · 627aaaa
1 parent a9e40e6
commit 627aaaa
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 14 deletions.
diff --git a/apps/dcellar-web-ui/src/modules/bucket/components/DetailBucketOperation.tsx b/apps/dcellar-web-ui/src/modules/bucket/components/DetailBucketOperation.tsx
@@ -160,6 +160,10 @@ export const DetailBucketOperation = memo<DetailBucketOperationProps>(function D
         canCopy: true,
         label: 'Primary SP address',
         edit: 'migrate',
+        editDisabled: [
+          BucketStatus.BUCKET_STATUS_MIGRATING,
+          BucketStatus.BUCKET_STATUS_DISCONTINUED,
+        ].includes(selectedBucketInfo.BucketStatus),
         name: spName,
         operation: 'payment_account',
         value: primarySp.operatorAddress || '--',
@@ -171,6 +175,10 @@ export const DetailBucketOperation = memo<DetailBucketOperationProps>(function D
       {
         canCopy: true,
         edit: 'payment_account',
+        editDisabled: [
+          BucketStatus.BUCKET_STATUS_MIGRATING,
+          BucketStatus.BUCKET_STATUS_DISCONTINUED,
+        ].includes(selectedBucketInfo.BucketStatus),
         label: 'Payment address',
         name: payAccountName,
         value: selectedBucketInfo.PaymentAddress,
@@ -226,9 +234,11 @@ export const DetailBucketOperation = memo<DetailBucketOperationProps>(function D
                       <Flex
                         alignItems={'center'}
                         gap={4}
-                        color={'brand.brand6'}
-                        cursor={'pointer'}
-                        onClick={() => onEditClick(item.edit as BucketOperationsType)}
+                        color={item.editDisabled ? 'readable.disable' : 'brand.brand6'}
+                        cursor={item.editDisabled ? 'not-allowed' : 'pointer'}
+                        onClick={() =>
+                          !item.editDisabled && onEditClick(item.edit as BucketOperationsType)
+                        }
                         w={16}
                         h={16}
                       >

diff --git a/apps/dcellar-web-ui/src/modules/bucket/components/MigrateBucketOperation.tsx b/apps/dcellar-web-ui/src/modules/bucket/components/MigrateBucketOperation.tsx
@@ -3,11 +3,11 @@ import { InsufficientBalances } from '@/components/Fee/InsufficientBalances';
 import { IconFont } from '@/components/IconFont';
 import { DCButton } from '@/components/common/DCButton';
 import { useOffChainAuth } from '@/context/off-chain-auth/useOffChainAuth';
-import { migrateBucket, pollingGetBucket } from '@/facade/bucket';
+import { migrateBucket } from '@/facade/bucket';
 import { E_OFF_CHAIN_AUTH } from '@/facade/error';
 import { BUTTON_GOT_IT, UNKNOWN_ERROR, WALLET_CONFIRM } from '@/modules/object/constant';
 import { useAppDispatch, useAppSelector } from '@/store';
-import { TBucket, setBucketEditQuota } from '@/store/slices/bucket';
+import { TBucket, setBucketEditQuota, setupBucketList } from '@/store/slices/bucket';
 import { formatQuota } from '@/utils/string';
 import {
   Divider,
@@ -29,6 +29,7 @@ import { SpEntity } from '@/store/slices/sp';
 import { selectBucketSp } from '@/store/slices/sp';
 import {
   AuthType,
+  BucketStatus,
   MigrateBucketApprovalRequest,
   MsgMigrateBucketTypeUrl,
 } from '@bnb-chain/greenfield-js-sdk';
@@ -137,19 +138,17 @@ export const MigrateBucketOperation = memo(function MigrateBucketOperation({
     dispatch(setSignatureAction({}));
     toast.success({ description: 'Primary Storage Provider updated!' });
     onClose();
-    await pollingGetBucket({
-      address: loginAccount,
-      endpoint: primarySp.endpoint,
-      bucketName: bucket.BucketName,
-    });
+    dispatch(setupBucketList(loginAccount));
   };
 
   const onSpChange = useCallback((sp: SpEntity) => {
     selectedSpRef.current = sp;
   }, []);
+
   const onManageQuota = () => {
     dispatch(setBucketEditQuota([bucket.BucketName, 'drawer']));
   };
+
   return (
     <>
       <QDrawerHeader flexDir={'column'}>
@@ -178,9 +177,12 @@ export const MigrateBucketOperation = memo(function MigrateBucketOperation({
         </Field>
 
         <Field>
-          <Label w={'fit-content'}>Total Quota</Label>
+          <Label w={'fit-content'}>Total quota</Label>
           <Value>
-            {formattedQuota.totalText} ({formattedQuota.remainText} remains)
+            {formattedQuota.totalText}&nbsp;
+            <Text as="span" color="#76808F">
+              ({formattedQuota.remainText} remains)
+            </Text>
           </Value>
         </Field>
         {!isPayQuota && (

diff --git a/apps/dcellar-web-ui/src/modules/object/components/MigratingBucketNoticeBanner.tsx b/apps/dcellar-web-ui/src/modules/object/components/MigratingBucketNoticeBanner.tsx
@@ -4,9 +4,11 @@ import { useAppDispatch, useAppSelector } from '@/store';
 import { setSignatureAction } from '@/store/slices/global';
 import { Flex, Text, toast } from '@node-real/uikit';
 import { BUTTON_GOT_IT, WALLET_CONFIRM } from '../constant';
-import { cancelMigrateBucket } from '@/facade/bucket';
+import { cancelMigrateBucket, headBucket } from '@/facade/bucket';
 import { MsgCancelMigrateBucket } from '@bnb-chain/greenfield-cosmos-types/greenfield/storage/tx';
 import { useAccount } from 'wagmi';
+import { BucketStatus } from '@bnb-chain/greenfield-js-sdk';
+import { setupBucket } from '@/store/slices/bucket';
 
 export const MigratingBucketNoticeBanner = ({ bucketName }: { bucketName: string }) => {
   const dispatch = useAppDispatch();
@@ -24,6 +26,14 @@ export const MigratingBucketNoticeBanner = ({ bucketName }: { bucketName: string
       operator: loginAccount,
       bucketName,
     };
+    const bucketInfo = await headBucket(bucketName);
+    if (bucketInfo?.bucketStatus === BucketStatus.BUCKET_STATUS_CREATED) {
+      await dispatch(setupBucket(bucketName));
+      dispatch(setSignatureAction({}));
+      toast.success({ description: 'This bucket has been migrated!' });
+      return;
+    }
+
     const [txRes, error] = await cancelMigrateBucket(params, connector!);
 
     if (!txRes || txRes.code !== 0) {
@@ -37,6 +47,7 @@ export const MigratingBucketNoticeBanner = ({ bucketName }: { bucketName: string
         }),
       );
     }
+    await dispatch(setupBucket(bucketName));
     dispatch(setSignatureAction({}));
     toast.success({ description: 'Cancel Migrate Bucket successfully!' });
   };

diff --git a/apps/dcellar-web-ui/src/modules/upload/NameItem.tsx b/apps/dcellar-web-ui/src/modules/upload/NameItem.tsx
@@ -1,4 +1,4 @@
-import { Box, Flex, Text } from '@node-real/uikit';
+import { Box, Flex } from '@node-real/uikit';
 import { useRouter } from 'next/router';
 
 import { EllipsisText } from '@/components/common/EllipsisText';