diff --git a/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts b/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts index 9d9bf623909..f21eaf3bf81 100644 --- a/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts +++ b/src/components/v5/common/ActionSidebar/hooks/useActionsList.ts @@ -2,6 +2,7 @@ import { useMemo } from 'react'; import { Action } from '~constants/actions.ts'; import { useColonyContext } from '~context/ColonyContext/ColonyContext.ts'; +import { useFeatureFlagsContext } from '~context/FeatureFlagsContext/FeatureFlagsContext.ts'; import useEnabledExtensions from '~hooks/useEnabledExtensions.ts'; import { type SearchSelectOptionProps } from '~v5/shared/SearchSelect/types.ts'; @@ -9,6 +10,11 @@ const useActionsList = () => { const { colony } = useColonyContext(); const { isStagedExpenditureEnabled } = useEnabledExtensions(); + const featureFlags = useFeatureFlagsContext(); + const isFeatureFlagArbitraryTxsEnabled = + featureFlags.ARBITRARY_TXS_ACTION?.isLoading || + featureFlags.ARBITRARY_TXS_ACTION?.isEnabled; + return useMemo((): SearchSelectOptionProps[] => { const actionsListOptions: SearchSelectOptionProps[] = [ { @@ -133,7 +139,9 @@ const useActionsList = () => { // }, ], }, - { + ]; + if (isFeatureFlagArbitraryTxsEnabled) { + actionsListOptions.push({ key: '6', isAccordion: true, title: { id: 'actions.transactions' }, @@ -144,8 +152,8 @@ const useActionsList = () => { isNew: true, }, ], - }, - ]; + }); + } if (!isStagedExpenditureEnabled) { const stagedPaymentIndex = actionsListOptions[0].options.findIndex( ({ value }) => value === Action.StagedPayment, @@ -160,7 +168,7 @@ const useActionsList = () => { actionsListOptions[2].options[2].isDisabled = true; } return actionsListOptions; - }, [colony, isStagedExpenditureEnabled]); + }, [colony, isStagedExpenditureEnabled, isFeatureFlagArbitraryTxsEnabled]); }; export default useActionsList; diff --git a/src/context/FeatureFlagsContext/FeatureFlagsContextProvider.tsx b/src/context/FeatureFlagsContext/FeatureFlagsContextProvider.tsx index adbd5c378e3..131d40fe23f 100644 --- a/src/context/FeatureFlagsContext/FeatureFlagsContextProvider.tsx +++ b/src/context/FeatureFlagsContext/FeatureFlagsContextProvider.tsx @@ -34,6 +34,7 @@ const FeatureFlagsContextProvider: FC = ({ children }) => { const cryptoToFiatWithdrawalsFeature = useFeatureFlag( FeatureFlag.CRYPTO_TO_FIAT_WITHDRAWALS, ); + const arbitraryTxsAction = useFeatureFlag(FeatureFlag.ARBITRARY_TXS_ACTION); const featureFlags: Record< FeatureFlag, @@ -42,8 +43,9 @@ const FeatureFlagsContextProvider: FC = ({ children }) => { () => ({ [FeatureFlag.CRYPTO_TO_FIAT]: cryptoToFiatFeature, [FeatureFlag.CRYPTO_TO_FIAT_WITHDRAWALS]: cryptoToFiatWithdrawalsFeature, + [FeatureFlag.ARBITRARY_TXS_ACTION]: arbitraryTxsAction, }), - [cryptoToFiatFeature, cryptoToFiatWithdrawalsFeature], + [cryptoToFiatFeature, cryptoToFiatWithdrawalsFeature, arbitraryTxsAction], ); return ( diff --git a/src/context/FeatureFlagsContext/types.ts b/src/context/FeatureFlagsContext/types.ts index 9cbbe548f5a..e35d9421406 100644 --- a/src/context/FeatureFlagsContext/types.ts +++ b/src/context/FeatureFlagsContext/types.ts @@ -1,6 +1,7 @@ export enum FeatureFlag { CRYPTO_TO_FIAT = 'CRYPTO_TO_FIAT', CRYPTO_TO_FIAT_WITHDRAWALS = 'CRYPTO_TO_FIAT_WITHDRAWALS', + ARBITRARY_TXS_ACTION = 'ARBITRARY_TXS_ACTION', } export interface FeatureFlagValue {