Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: routes.component.js and creation of ToastMaster #27735

Merged
merged 34 commits into from
Oct 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
34 commits
Select commit Hold shift + click to select a range
e5d4d4d
kinda stable but some layouts are off
HowardBraham Oct 3, 2024
efa6d39
stable, fixing some toasts
HowardBraham Oct 3, 2024
35f5747
lint
HowardBraham Oct 5, 2024
c9ec44a
getShowSurveyToast
HowardBraham Oct 8, 2024
da9f563
moving things to toast-master.js
HowardBraham Oct 8, 2024
3320ffb
moved the test
HowardBraham Oct 8, 2024
a414e81
showPrivacyPolicyToast
HowardBraham Oct 9, 2024
357ae59
showNftEnablementToast
HowardBraham Oct 9, 2024
1c0ca64
useNftDetection
HowardBraham Oct 9, 2024
d4d2231
PermittedNetworkToast
HowardBraham Oct 9, 2024
68fc16e
remove console
HowardBraham Oct 9, 2024
b741f27
fix hooks
HowardBraham Oct 9, 2024
7a174e6
removed eslint-disable
HowardBraham Oct 12, 2024
22e94b7
fixed import
HowardBraham Oct 9, 2024
3c9de03
setOnboardingDate
HowardBraham Oct 9, 2024
9518294
convert toast-master-selectors to TS
HowardBraham Oct 9, 2024
f573482
cleanup isolated.js
HowardBraham Oct 9, 2024
77e55ea
rename isolated.js to routes-helpers.js
HowardBraham Oct 9, 2024
ddfd3b5
move toast-master to its own folder
HowardBraham Oct 9, 2024
db637ff
fixed unit tests
HowardBraham Oct 9, 2024
0268712
import { submitRequestToBackground }
HowardBraham Oct 9, 2024
7db8700
state suggestion from @MajorLift
HowardBraham Oct 9, 2024
4e4cb62
fixed merge conflict from #27561
HowardBraham Oct 10, 2024
5cbdab1
moved getShowConnectAccountToast()
HowardBraham Oct 14, 2024
dd63c84
renamed get to select
HowardBraham Oct 14, 2024
3c6976d
renamed routes-helpers.js to utils.js
HowardBraham Oct 14, 2024
87e8b3f
split to selectors.ts and utils.ts
HowardBraham Oct 14, 2024
6a9f016
usePrevious
HowardBraham Oct 14, 2024
1aa6965
Split ToastMaster into several separate local components
HowardBraham Oct 14, 2024
0412d73
fix lint errors
HowardBraham Oct 14, 2024
092a18f
fixing rules of hooks
HowardBraham Oct 15, 2024
3f88b8e
submitRequestToBackgroundAndCatch
HowardBraham Oct 16, 2024
b8c018c
@MajorLift fix
HowardBraham Oct 16, 2024
e82745e
rename to isShown
HowardBraham Oct 17, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import React from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { BannerAlert } from '../../../../component-library';
import { useI18nContext } from '../../../../../hooks/useI18nContext';
import { getOpenSeaEnabled } from '../../../../../selectors';
import {
detectNfts,
setOpenSeaEnabled,
setShowNftDetectionEnablementToast,
setUseNftDetection,
} from '../../../../../store/actions';
import { getOpenSeaEnabled } from '../../../../../selectors';
import { BannerAlert } from '../../../../component-library';
import { setShowNftDetectionEnablementToast } from '../../../toast-master/utils';

export default function NFTsDetectionNoticeNFTsTab() {
const t = useI18nContext();
Expand Down
108 changes: 108 additions & 0 deletions ui/components/app/toast-master/selectors.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,108 @@
import { InternalAccount, isEvmAccountType } from '@metamask/keyring-api';
import { getAlertEnabledness } from '../../../ducks/metamask/metamask';
import { PRIVACY_POLICY_DATE } from '../../../helpers/constants/privacy-policy';
import {
SURVEY_DATE,
SURVEY_END_TIME,
SURVEY_START_TIME,
} from '../../../helpers/constants/survey';
import { getPermittedAccountsForCurrentTab } from '../../../selectors';
import { MetaMaskReduxState } from '../../../store/store';
import { getIsPrivacyToastRecent } from './utils';

// TODO: get this into one of the larger definitions of state type
type State = Omit<MetaMaskReduxState, 'appState'> & {
appState: {
showNftDetectionEnablementToast?: boolean;
};
metamask: {
newPrivacyPolicyToastClickedOrClosed?: boolean;
newPrivacyPolicyToastShownDate?: number;
onboardingDate?: number;
showNftDetectionEnablementToast?: boolean;
surveyLinkLastClickedOrClosed?: number;
switchedNetworkNeverShowMessage?: boolean;
};
};

/**
* Determines if the survey toast should be shown based on the current time, survey start and end times, and whether the survey link was last clicked or closed.
*
* @param state - The application state containing the necessary survey data.
* @returns True if the current time is between the survey start and end times and the survey link was not last clicked or closed. False otherwise.
*/
export function selectShowSurveyToast(state: State): boolean {
if (state.metamask?.surveyLinkLastClickedOrClosed) {
return false;
}

const startTime = new Date(`${SURVEY_DATE} ${SURVEY_START_TIME}`).getTime();
const endTime = new Date(`${SURVEY_DATE} ${SURVEY_END_TIME}`).getTime();
const now = Date.now();

return now > startTime && now < endTime;
}

/**
* Determines if the privacy policy toast should be shown based on the current date and whether the new privacy policy toast was clicked or closed.
*
* @param state - The application state containing the privacy policy data.
* @returns Boolean is True if the toast should be shown, and the number is the date the toast was last shown.
*/
export function selectShowPrivacyPolicyToast(state: State): {
showPrivacyPolicyToast: boolean;
newPrivacyPolicyToastShownDate?: number;
} {
const {
newPrivacyPolicyToastClickedOrClosed,
newPrivacyPolicyToastShownDate,
onboardingDate,
} = state.metamask || {};
const newPrivacyPolicyDate = new Date(PRIVACY_POLICY_DATE);
const currentDate = new Date(Date.now());

const showPrivacyPolicyToast =
!newPrivacyPolicyToastClickedOrClosed &&
currentDate >= newPrivacyPolicyDate &&
getIsPrivacyToastRecent(newPrivacyPolicyToastShownDate) &&
// users who onboarded before the privacy policy date should see the notice
// and
// old users who don't have onboardingDate set should see the notice
(!onboardingDate || onboardingDate < newPrivacyPolicyDate.valueOf());

return { showPrivacyPolicyToast, newPrivacyPolicyToastShownDate };
}

export function selectNftDetectionEnablementToast(state: State): boolean {
return Boolean(state.appState?.showNftDetectionEnablementToast);
}

// If there is more than one connected account to activeTabOrigin,
// *BUT* the current account is not one of them, show the banner
export function selectShowConnectAccountToast(
state: State,
account: InternalAccount,
): boolean {
const allowShowAccountSetting = getAlertEnabledness(state).unconnectedAccount;
const connectedAccounts = getPermittedAccountsForCurrentTab(state);
const isEvmAccount = isEvmAccountType(account?.type);

return (
allowShowAccountSetting &&
account &&
state.activeTab?.origin &&
isEvmAccount &&
connectedAccounts.length > 0 &&
!connectedAccounts.some((address) => address === account.address)
);
}

/**
* Retrieves user preference to never see the "Switched Network" toast
*
* @param state - Redux state object.
* @returns Boolean preference value
*/
export function selectSwitchedNetworkNeverShowMessage(state: State): boolean {
return Boolean(state.metamask.switchedNetworkNeverShowMessage);
}
Loading
Loading