Merge pull request #643 from subquery/fix/style

feat: style
subquery · Jan 25, 2024 · bd4176c · bd4176c
2 parents 9cffd4c + e4c9880
commit bd4176c
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 29 deletions.
diff --git a/src/components/Status/Status.module.css b/src/components/Status/Status.module.css
@@ -30,6 +30,7 @@
   font-size: 12px;
   line-height: 20px;
   text-transform: uppercase;
+  margin-bottom: 0;
 }
 
 .text-blue {

diff --git a/src/containers/QueryApolloProvider.tsx b/src/containers/QueryApolloProvider.tsx
@@ -79,7 +79,12 @@ export const QueryApolloProvider: React.FC<PropsWithChildren> = ({ children }) =
     }),
     defaultOptions: {
       query: {
-        fetchPolicy: 'network-only',
+        fetchPolicy: 'no-cache',
+        errorPolicy: 'all',
+      },
+      watchQuery: {
+        fetchPolicy: 'no-cache',
+        errorPolicy: 'ignore',
       },
     },
   });

diff --git a/src/pages/account/Withdrawn/Locked/Home/Locked.tsx b/src/pages/account/Withdrawn/Locked/Home/Locked.tsx
@@ -5,13 +5,12 @@ import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { BsExclamationCircle } from 'react-icons/bs';
 import InfoCircleOutlined from '@ant-design/icons/InfoCircleOutlined';
-import { claimIndexerRewardsModalText, EmptyList, ModalClaimIndexerRewards } from '@components';
+import { EmptyList } from '@components';
 import { TokenAmount } from '@components/TokenAmount';
 import TransactionModal from '@components/TransactionModal';
 import { useWeb3 } from '@containers';
 import { defaultLockPeriod, useLockPeriod } from '@hooks';
-import { useRewardCollectStatus } from '@hooks/useRewardCollectStatus';
-import { Spinner, Typography } from '@subql/components';
+import { openNotification, Spinner, Typography } from '@subql/components';
 import { TableText, TableTitle } from '@subql/components';
 import { WithdrawalFieldsFragment as Withdrawls, WithdrawalType } from '@subql/network-query';
 import { useGetWithdrawlsLazyQuery } from '@subql/react-hooks';
@@ -57,47 +56,50 @@ const cancelWithdrwalsTextAndTips = {
   },
 };
 
-const CancelUnbonding: React.FC<{ id: string; type: WithdrawalType; onSuccess?: () => void }> = ({
-  id,
-  type,
-  onSuccess,
-}) => {
+const CancelUnbonding: React.FC<{
+  id: string;
+  type: WithdrawalType;
+  indexerAddress: string;
+  onSuccess?: () => void;
+}> = ({ id, type, indexerAddress, onSuccess }) => {
   const { contracts } = useWeb3Store();
-  const { account } = useWeb3();
-  const rewardClaimStatus = useRewardCollectStatus(account || '');
 
   const cancelUnbonding = () => {
     assert(contracts, 'Contracts not available');
 
     return contracts.stakingManager.cancelUnbonding(id);
   };
 
-  const needClaimedStatus = React.useMemo(() => {
-    return !rewardClaimStatus.data?.hasClaimedRewards;
-  }, [rewardClaimStatus.data?.hasClaimedRewards]);
-
   return (
     <div>
       <TransactionModal
-        text={
-          needClaimedStatus
-            ? claimIndexerRewardsModalText
-            : {
-                title: '',
-                steps: [],
+        text={{
+          title: '',
+          steps: [],
+        }}
+        actions={[
+          {
+            label: capitalize(t('general.cancel')),
+            key: 'claim',
+            onClick: async () => {
+              const res = await contracts?.indexerRegistry.isIndexer(indexerAddress);
+              if (!res) {
+                openNotification({
+                  type: 'error',
+                  description: "This indexer has been unregistered. The stake can't be cancel.",
+                  duration: 3,
+                });
+                throw new Error('Not an indexer');
               }
-        }
-        actions={[{ label: capitalize(t('general.cancel')), key: 'claim' }]}
+            },
+          },
+        ]}
         variant={'textBtn'}
         onClick={cancelUnbonding}
         width="416px"
         className={styles.cancelModal}
         onSuccess={onSuccess}
         renderContent={(onSubmit, onCancel, isLoading, error) => {
-          if (needClaimedStatus) {
-            return <ModalClaimIndexerRewards onSuccess={() => rewardClaimStatus.refetch()} indexer={account ?? ''} />;
-          }
-
           return (
             <div style={{ display: 'flex', flexDirection: 'column' }}>
               <div style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
@@ -147,11 +149,11 @@ export const Locked: React.FC = () => {
     status: WithdrawalStatus.ONGOING,
     offset: 0,
   };
-  // TODO: refresh when do the withdrawl action.
   const [getWithdrawals, withdrawals] = useGetWithdrawlsLazyQuery({
     variables: filterParams,
     fetchPolicy: 'network-only',
   });
+
   const lockPeriod = useLockPeriod();
 
   const columns: TableProps<SortedWithdrawals>['columns'] = [
@@ -196,6 +198,7 @@ export const Locked: React.FC = () => {
       render: (id, record) => (
         <CancelUnbonding
           id={id}
+          indexerAddress={record.indexer}
           type={record.type}
           onSuccess={() => {
             retry(getWithdrawals);

diff --git a/src/pages/explorer/Project/Project.tsx b/src/pages/explorer/Project/Project.tsx
@@ -50,7 +50,7 @@ const ProjectInner: React.FC = () => {
       { link: `${SERVICE_AGREEMENTS}${location.search}`, label: t('explorer.project.tab3') },
     ];
     const flexPlanTab = [{ link: `${FLEX_PLANS}${location.search}`, label: t('explorer.project.tab4') }];
-    return import.meta.env.VITE_FLEXPLAN_ENABLED === 'true' ? [...tabList, ...flexPlanTab] : tabList;
+    return [...tabList, ...flexPlanTab];
   }, [location.search, asyncProject.data?.type]);
 
   const deploymentId = React.useMemo(() => {