From 9ee4de367cb3130e5c1b6d793311c05d4af4aa43 Mon Sep 17 00:00:00 2001
From: Raul Glogovetan <raul@glogovetan.com>
Date: Mon, 8 Apr 2024 13:17:34 +0300
Subject: [PATCH] Fix: disable token actions if not available

Fixes #2163
---
 .../frame/Extensions/layouts/hooks.tsx        | 21 +++++++++++--------
 .../partials/BalanceTable/BalanceTable.tsx    |  2 +-
 .../ActionSidebar/hooks/useActionsList.ts     | 18 +++++++++++-----
 .../partials/SearchItem/SearchItem.tsx        |  7 +++----
 .../v5/shared/SearchSelect/types.ts           |  1 +
 5 files changed, 30 insertions(+), 19 deletions(-)

diff --git a/src/components/frame/Extensions/layouts/hooks.tsx b/src/components/frame/Extensions/layouts/hooks.tsx
index 858bab040c3..34aed86a3e6 100644
--- a/src/components/frame/Extensions/layouts/hooks.tsx
+++ b/src/components/frame/Extensions/layouts/hooks.tsx
@@ -106,7 +106,7 @@ export const useCalamityBannerInfo = (): UseCalamityBannerInfoReturnType => {
 
 export const useMainMenuItems = (hasTransactionId: boolean) => {
   const {
-    colony: { metadata },
+    colony: { metadata, status },
   } = useColonyContext();
 
   const {
@@ -293,14 +293,6 @@ export const useMainMenuItems = (hasTransactionId: boolean) => {
                 [ACTION_TYPE_FIELD_NAME]: Action.ManageTokens,
               }),
           },
-          {
-            key: '9',
-            label: formatText({ id: 'actions.mintTokens' }),
-            onClick: () =>
-              toggleActionSidebarOn({
-                [ACTION_TYPE_FIELD_NAME]: Action.MintTokens,
-              }),
-          },
         ],
       },
     },
@@ -387,6 +379,17 @@ export const useMainMenuItems = (hasTransactionId: boolean) => {
     },
   ];
 
+  if (status?.nativeToken?.mintable) {
+    mainMenuItems[3].relatedActionsProps?.items?.push({
+      key: '9',
+      label: formatText({ id: 'actions.mintTokens' }),
+      onClick: () =>
+        toggleActionSidebarOn({
+          [ACTION_TYPE_FIELD_NAME]: Action.MintTokens,
+        }),
+    });
+  }
+
   return mainMenuItems;
 };
 
diff --git a/src/components/frame/v5/pages/BalancePage/partials/BalanceTable/BalanceTable.tsx b/src/components/frame/v5/pages/BalancePage/partials/BalanceTable/BalanceTable.tsx
index 8d8ca78c776..12ed6ee4603 100644
--- a/src/components/frame/v5/pages/BalancePage/partials/BalanceTable/BalanceTable.tsx
+++ b/src/components/frame/v5/pages/BalancePage/partials/BalanceTable/BalanceTable.tsx
@@ -134,7 +134,7 @@ const BalanceTable: FC = () => {
           ),
           icon: ArrowSquareOut,
         },
-        ...(isTokenNative
+        ...(isTokenNative && nativeTokenStatus?.mintable
           ? [
               {
                 key: 'mint_tokens',
diff --git a/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts b/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts
index 6fbebd7806d..7a293ad2775 100644
--- a/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts
+++ b/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts
@@ -1,11 +1,13 @@
 import { useMemo } from 'react';
 
 import { Action } from '~constants/actions.ts';
+import { useColonyContext } from '~context/ColonyContext/ColonyContext.ts';
 import { type SearchSelectOptionProps } from '~v5/shared/SearchSelect/types.ts';
 
 const useActionsList = () => {
-  return useMemo(
-    (): SearchSelectOptionProps[] => [
+  const { colony } = useColonyContext();
+  return useMemo((): SearchSelectOptionProps[] => {
+    const actionsListOptions: SearchSelectOptionProps[] = [
       {
         key: '1',
         title: { id: 'actions.payments' },
@@ -129,9 +131,15 @@ const useActionsList = () => {
           // },
         ],
       },
-    ],
-    [],
-  );
+    ];
+    if (!colony?.status?.nativeToken?.mintable) {
+      actionsListOptions[2].options[1].isDisabled = true;
+    }
+    if (!colony?.status?.nativeToken?.unlockable) {
+      actionsListOptions[2].options[2].isDisabled = true;
+    }
+    return actionsListOptions;
+  }, [colony]);
 };
 
 export default useActionsList;
diff --git a/src/components/v5/shared/SearchSelect/partials/SearchItem/SearchItem.tsx b/src/components/v5/shared/SearchSelect/partials/SearchItem/SearchItem.tsx
index 55be9897c2b..c91bf857107 100644
--- a/src/components/v5/shared/SearchSelect/partials/SearchItem/SearchItem.tsx
+++ b/src/components/v5/shared/SearchSelect/partials/SearchItem/SearchItem.tsx
@@ -38,6 +38,7 @@ const SearchItem: FC<SearchItemProps> = ({
           label,
           value,
           isDisabled,
+          isComingSoon,
           avatar,
           showAvatar,
           color,
@@ -45,9 +46,7 @@ const SearchItem: FC<SearchItemProps> = ({
           token,
           isVerified,
         }) => {
-          const firstDisabledOption = options.filter(
-            (option) => option.isDisabled,
-          )[0];
+          const comingSoonOption = isComingSoon || (isDisabled && isComingSoon);
           const labelText = formatText(label || '');
 
           const hasAvatar = showAvatar || !!color || !!token;
@@ -122,7 +121,7 @@ const SearchItem: FC<SearchItemProps> = ({
                     />
                   )}
                   {!label && <span className="truncate">{walletAddress}</span>}
-                  {firstDisabledOption?.value === value && (
+                  {comingSoonOption && (
                     <div className="absolute right-0 top-1/2 -translate-y-1/2 transform">
                       <ExtensionsStatusBadge
                         mode="coming-soon"
diff --git a/src/components/v5/shared/SearchSelect/types.ts b/src/components/v5/shared/SearchSelect/types.ts
index 484ae8e1e0f..114f14001a0 100644
--- a/src/components/v5/shared/SearchSelect/types.ts
+++ b/src/components/v5/shared/SearchSelect/types.ts
@@ -27,6 +27,7 @@ export interface SearchSelectOption {
   label: MessageDescriptor | string;
   value: string | number;
   isDisabled?: boolean;
+  isComingSoon?: boolean;
   avatar?: string;
   thumbnail?: string;
   showAvatar?: boolean;