diff --git a/packages/extension-ui/src/Popup/AssetHubMigration.tsx b/packages/extension-ui/src/Popup/AssetHubMigration.tsx new file mode 100644 index 00000000..d66bf0ff --- /dev/null +++ b/packages/extension-ui/src/Popup/AssetHubMigration.tsx @@ -0,0 +1,81 @@ +// Copyright 2019-2025 @polkadot/extension-ui authors & contributors +// SPDX-License-Identifier: Apache-2.0 + +import React, { useCallback, useContext } from 'react'; + +import { ActionContext, Box, Button, ButtonArea, List } from '../components/index.js'; +import { useTranslation } from '../hooks/index.js'; +import { Header } from '../partials/index.js'; +import { styled } from '../styled.js'; + +interface Props { + className?: string; +} + +function AssetHubMigration ({ className }: Props): React.ReactElement { + const { t } = useTranslation(); + const onAction = useContext(ActionContext); + + const _onClick = useCallback( + (): void => { + window.localStorage.setItem('asset_hub_migration_read', 'ok'); + onAction(); + }, + [onAction] + ); + + return ( + <> +
+
+

{t('The Asset Hub migration has been completed. Please note the following important changes:')}

+ + +
  • {t('All balances have been migrated from the Relay Chain to Asset Hub')}
  • +
  • {t('All on-chain functionality has been moved to Asset Hub')}
  • +
  • {t('Asset Hub now holds user balances and provides general functionality')}
  • +
    +
    +

    {t('Do not teleport balances to the Relay Chain unless:')}

    + + +
  • {t('You are opening HRMP channels, or')}
  • +
  • {t('You are starting a Parachain')}
  • +
    +
    +

    {t('For all other operations, your balances are already on Asset Hub.')}

    +
    + + + + + ); +} + +export default styled(AssetHubMigration)` + p { + color: var(--subTextColor); + margin-bottom: 4px; + margin-top: 0; + line-height: 1.4; + } + + p.warning { + color: var(--errorColor); + font-weight: 600; + font-size: 1.1em; + margin-top: 6px; + margin-bottom: 2px; + text-transform: uppercase; + line-height: 1.3; + } + + article { + margin: 0.4rem 24px; + padding: 8px 20px; + } + + ul { + margin: 0; + } +`; diff --git a/packages/extension-ui/src/Popup/index.tsx b/packages/extension-ui/src/Popup/index.tsx index b2bbbc74..26847fe0 100644 --- a/packages/extension-ui/src/Popup/index.tsx +++ b/packages/extension-ui/src/Popup/index.tsx @@ -25,6 +25,7 @@ import Derive from './Derive/index.js'; import ImportSeed from './ImportSeed/index.js'; import Metadata from './Metadata/index.js'; import Signing from './Signing/index.js'; +import AssetHubMigration from './AssetHubMigration.js'; import Export from './Export.js'; import ExportAll from './ExportAll.js'; import Forget from './Forget.js'; @@ -76,12 +77,14 @@ export default function Popup (): React.ReactElement { const [metaRequests, setMetaRequests] = useState(null); const [signRequests, setSignRequests] = useState(null); const [isWelcomeDone, setWelcomeDone] = useState(false); + const [isMigrationDone, setMigrationDone] = useState(false); const [settingsCtx, setSettingsCtx] = useState(startSettings); const history = useHistory(); const _onAction = useCallback( (to?: string): void => { setWelcomeDone(window.localStorage.getItem('welcome_read') === 'ok'); + setMigrationDone(window.localStorage.getItem('asset_hub_migration_read') === 'ok'); if (!to) { return; @@ -130,15 +133,17 @@ export default function Popup (): React.ReactElement { return {component}; } - const Root = isWelcomeDone - ? authRequests?.length - ? wrapWithErrorBoundary(, 'authorize') - : metaRequests?.length - ? wrapWithErrorBoundary(, 'metadata') - : signRequests?.length - ? wrapWithErrorBoundary(, 'signing') - : wrapWithErrorBoundary(, 'accounts') - : wrapWithErrorBoundary(, 'welcome'); + const Root = !isWelcomeDone + ? wrapWithErrorBoundary(, 'welcome') + : !isMigrationDone + ? wrapWithErrorBoundary(, 'asset-hub-migration') + : authRequests?.length + ? wrapWithErrorBoundary(, 'authorize') + : metaRequests?.length + ? wrapWithErrorBoundary(, 'metadata') + : signRequests?.length + ? wrapWithErrorBoundary(, 'signing') + : wrapWithErrorBoundary(, 'accounts'); return ( {accounts && authRequests && metaRequests && signRequests && ( diff --git a/packages/extension/public/locales/en/translation.json b/packages/extension/public/locales/en/translation.json index 0e49b03f..7c179bb2 100644 --- a/packages/extension/public/locales/en/translation.json +++ b/packages/extension/public/locales/en/translation.json @@ -186,5 +186,16 @@ "Ethereum Account": "", "It looks like this request is coming from an suspicious origin. Please verify the source carefully.": "", "Password is not strong enough": "", - "Password must be at least {{length}} characters long": "" + "Password must be at least {{length}} characters long": "", + "Asset Hub Migration Notice": "", + "The Asset Hub migration has been completed. Please note the following important changes:": "", + "All balances have been migrated from the Relay Chain to Asset Hub": "", + "All on-chain functionality has been moved to Asset Hub": "", + "Asset Hub now holds user balances and provides general functionality": "", + "⚠️ Do not teleport balances to the Relay Chain unless:": "", + "You are opening HRMP channels, or": "", + "You are starting a Parachain": "", + "For all other operations, your balances are already on Asset Hub.": "", + "I Understand": "", + "Do not teleport balances to the Relay Chain unless:": "" }