diff --git a/app/actions/security/index.ts b/app/actions/security/index.ts index e0e87a0ef550..661c1d1119d0 100644 --- a/app/actions/security/index.ts +++ b/app/actions/security/index.ts @@ -8,6 +8,7 @@ export enum ActionType { SET_AUTOMATIC_SECURITY_CHECKS_MODAL_OPEN = 'SET_AUTOMATIC_SECURITY_CHECKS_MODAL_OPEN', SET_DATA_COLLECTION_FOR_MARKETING = 'SET_DATA_COLLECTION_FOR_MARKETING', SET_NFT_AUTO_DETECTION_MODAL_OPEN = 'SET_NFT_AUTO_DETECTION_MODAL_OPEN', + SET_MULTI_RPC_MIGRATION_MODAL_OPEN = 'SET_MULTI_RPC_MIGRATION_MODAL_OPEN', } export interface AllowLoginWithRememberMeUpdated @@ -35,6 +36,11 @@ export interface SetNftAutoDetectionModalOpen open: boolean; } +export interface SetMultiRpcMigrationModalOpen + extends ReduxAction { + open: boolean; +} + export interface SetDataCollectionForMarketing extends ReduxAction { enabled: boolean; @@ -46,7 +52,8 @@ export type Action = | UserSelectedAutomaticSecurityChecksOptions | SetAutomaticSecurityChecksModalOpen | SetDataCollectionForMarketing - | SetNftAutoDetectionModalOpen; + | SetNftAutoDetectionModalOpen + | SetMultiRpcMigrationModalOpen; export const setAllowLoginWithRememberMe = ( enabled: boolean, @@ -82,6 +89,13 @@ export const setNftAutoDetectionModalOpen = ( open, }); +export const setMultiRpcMigrationModalOpen = ( + open: boolean, +): SetMultiRpcMigrationModalOpen => ({ + type: ActionType.SET_MULTI_RPC_MIGRATION_MODAL_OPEN, + open, +}); + export const setDataCollectionForMarketing = (enabled: boolean) => ({ type: ActionType.SET_DATA_COLLECTION_FOR_MARKETING, enabled, diff --git a/app/component-library/components-temp/CellSelectWithMenu/CellSelectWithMenu.tsx b/app/component-library/components-temp/CellSelectWithMenu/CellSelectWithMenu.tsx index ff8df60913ae..e18ed0465956 100644 --- a/app/component-library/components-temp/CellSelectWithMenu/CellSelectWithMenu.tsx +++ b/app/component-library/components-temp/CellSelectWithMenu/CellSelectWithMenu.tsx @@ -33,6 +33,7 @@ const CellSelectWithMenu = ({ tagLabel, isSelected = false, children, + withAvatar = true, ...props }: CellSelectWithMenuProps) => { const { styles } = useStyles(styleSheet, { style }); @@ -46,12 +47,15 @@ const CellSelectWithMenu = ({ > {/* DEV Note: Account Avatar should be replaced with Avatar with Badge whenever available */} - + {withAvatar ? ( + + ) : null} + - + { const { getByRole } = render( , @@ -64,7 +66,9 @@ describe('ListItemMultiSelectButton', () => { const { getByTestId } = render( , diff --git a/app/component-library/components-temp/ListItemMultiSelectButton/ListItemMultiSelectButton.tsx b/app/component-library/components-temp/ListItemMultiSelectButton/ListItemMultiSelectButton.tsx index e8610e457352..a3cb0d079ffc 100644 --- a/app/component-library/components-temp/ListItemMultiSelectButton/ListItemMultiSelectButton.tsx +++ b/app/component-library/components-temp/ListItemMultiSelectButton/ListItemMultiSelectButton.tsx @@ -20,6 +20,12 @@ import { IconColor, IconName, } from '../../../component-library/components/Icons/Icon'; +import Button, { + ButtonSize, + ButtonVariants, + ButtonWidthTypes, +} from '../../../component-library/components/Buttons/Button'; +import { TextVariant } from '../../../component-library/components/Texts/Text'; const ListItemMultiSelectButton: React.FC = ({ style, @@ -27,7 +33,9 @@ const ListItemMultiSelectButton: React.FC = ({ isDisabled = false, children, gap = DEFAULT_LISTITEMMULTISELECT_GAP, + showButtonIcon = true, buttonIcon = IconName.MoreVertical, + buttonProps, ...props }) => { const { styles } = useStyles(styleSheet, { @@ -55,15 +63,29 @@ const ListItemMultiSelectButton: React.FC = ({ )} - - - + {showButtonIcon ? ( + + + + ) : null} + {buttonProps?.textButton ? ( + +