diff --git a/packages/extension-koni-ui/src/Popup/Home/MissionTemp/MissionSectionListContainer.tsx b/packages/extension-koni-ui/src/Popup/Home/MissionTemp/MissionSectionListContainer.tsx index fd90dc417d..0b7c43e3f2 100644 --- a/packages/extension-koni-ui/src/Popup/Home/MissionTemp/MissionSectionListContainer.tsx +++ b/packages/extension-koni-ui/src/Popup/Home/MissionTemp/MissionSectionListContainer.tsx @@ -113,7 +113,7 @@ const Component = ({ accountInfo, const { isLinkedMyth, linkMythAccount, mythicalWallet } = useContext(AuthenticationMythContext); const { currentAccount } = useSelector((state: RootState) => state.accountState); const doLinkAccount = useCallback(() => { - currentAccount?.address && linkMythAccount().catch(console.error); + currentAccount?.address && linkMythAccount('/home/mission').catch(console.error); }, [currentAccount?.address, linkMythAccount]); const getTaskStatusText = useCallback((task: Task) => { @@ -125,7 +125,7 @@ const Component = ({ accountInfo, className: 'general-confirmation-modal modal-revert-header', title: t('LINK YOUR MYTHICAL ACCOUNT'), content: ( - t('You need to link your Mythical address with your account on the NFL Rivals app to complete this task') + t('You need to link your Mythical account to complete this task') ), okButton: { icon: Check, @@ -146,7 +146,7 @@ const Component = ({ accountInfo, className: 'general-confirmation-modal modal-revert-header', title: t('NO ADDRESS FOUND'), content: ( - t('You need to link your Mythical account to complete this task') + t('You need to link your Mythical address with your account on the NFL Rivals app to complete this task') ), okButton: { text: t('GOT IT'), diff --git a/packages/extension-koni-ui/src/Popup/Home/MyProfile/index.tsx b/packages/extension-koni-ui/src/Popup/Home/MyProfile/index.tsx index c78b4bd274..44fb232739 100644 --- a/packages/extension-koni-ui/src/Popup/Home/MyProfile/index.tsx +++ b/packages/extension-koni-ui/src/Popup/Home/MyProfile/index.tsx @@ -31,7 +31,7 @@ const Component = ({ className }: Props): React.ReactElement => { const [loading, setLoading] = useState(false); const [mineAccount, setMineAccount] = useState(apiSDK.account); const doLinkAccount = useCallback(() => { - currentAccount?.address && linkMythAccount().catch(console.error); + currentAccount?.address && linkMythAccount('/home/my-profile').catch(console.error); }, [currentAccount?.address, linkMythAccount]); const openAppStoreLink = useCallback(() => { diff --git a/packages/extension-koni-ui/src/Popup/Root.tsx b/packages/extension-koni-ui/src/Popup/Root.tsx index 2eec7c1416..ef8fc3e06e 100644 --- a/packages/extension-koni-ui/src/Popup/Root.tsx +++ b/packages/extension-koni-ui/src/Popup/Root.tsx @@ -8,7 +8,7 @@ import { Logo2D } from '@subwallet/extension-koni-ui/components/Logo'; import { BookaSdk } from '@subwallet/extension-koni-ui/connector/booka/sdk'; import { AUTHENTICATE_LOGOUT_REDIRECT, AUTHENTICATE_REDIRECT_URI, AUTHORIZATION_ENDPOINT, CLIENT_ID, LOGOUT_ENDPOINT, TOKEN_ENDPOINT, TRANSACTION_STORAGES } from '@subwallet/extension-koni-ui/constants'; import { DEFAULT_ROUTER_PATH } from '@subwallet/extension-koni-ui/constants/router'; -import { AuthenticationMythProvider, LOCAL_LOGGED_IN_PROMISE_KEY } from '@subwallet/extension-koni-ui/contexts/AuthenticationMythProvider'; +import { AuthenticationMythProvider, LOCAL_LOGGED_IN_PROMISE_KEY, LOCAL_NAVIGATE_AFTER_LOGIN_KEY } from '@subwallet/extension-koni-ui/contexts/AuthenticationMythProvider'; import { DataContext } from '@subwallet/extension-koni-ui/contexts/DataContext'; import { SecurityContextProvider } from '@subwallet/extension-koni-ui/contexts/SecurityContext'; import { usePredefinedModal, WalletModalContextProvider } from '@subwallet/extension-koni-ui/contexts/WalletModalContextProvider'; @@ -242,13 +242,15 @@ function DefaultRoute ({ children }: { children: React.ReactNode }): React.React } const loginPromise = localStorage.getItem(LOCAL_LOGGED_IN_PROMISE_KEY) || ''; + const pathAfterLogin = localStorage.getItem(LOCAL_NAVIGATE_AFTER_LOGIN_KEY); if (loginPromise === 'login') { - redirectTarget = myProfileUrl; + redirectTarget = pathAfterLogin || myProfileUrl; localStorage.setItem(LOCAL_LOGGED_IN_PROMISE_KEY, 'logged'); } else if (loginPromise === 'logout') { localStorage.removeItem(LOCAL_LOGGED_IN_PROMISE_KEY); - redirectTarget = myProfileUrl; + localStorage.removeItem(LOCAL_NAVIGATE_AFTER_LOGIN_KEY); + redirectTarget = pathAfterLogin || myProfileUrl; } // Remove loading on finished first compute diff --git a/packages/extension-koni-ui/src/components/Modal/Common/AlertModal.tsx b/packages/extension-koni-ui/src/components/Modal/Common/AlertModal.tsx index e6a48e49d7..42354eef62 100644 --- a/packages/extension-koni-ui/src/components/Modal/Common/AlertModal.tsx +++ b/packages/extension-koni-ui/src/components/Modal/Common/AlertModal.tsx @@ -144,9 +144,10 @@ const Component: React.FC = (props: Props) => { const AlertModal = styled(Component)(({ theme: { extendToken, token } }: Props) => { return { '.ant-sw-modal-body': { - paddingBottom: token.paddingXXS, - paddingLeft: token.paddingXS, - paddingRight: token.paddingXS + margin: 0, + paddingLeft: 0, + paddingRight: 0, + paddingBottom: 4 }, '.ant-sw-modal-footer': { @@ -156,7 +157,9 @@ const AlertModal = styled(Component)(({ theme: { extendToken, token } }: }, '.ant-sw-header-center-part': { - position: 'relative' + position: 'relative', + marginLeft: 0, + marginRight: 0 }, '.ant-sw-sub-header-title-content.ant-sw-sub-header-title-content.ant-sw-sub-header-title-content': { @@ -165,12 +168,14 @@ const AlertModal = styled(Component)(({ theme: { extendToken, token } }: fontFamily: extendToken.fontPermanentMarker, fontWeight: 400, lineHeight: '40px', + fontSize: 32, textTransform: 'uppercase', 'white-space': 'normal' }, '.ant-sw-modal-content.ant-sw-modal-content': { - paddingTop: 24, + borderRadius: 0, + paddingTop: 27, backgroundImage: 'url(/images/mythical/alert-modal-bg.png)', backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat', @@ -187,10 +192,9 @@ const AlertModal = styled(Component)(({ theme: { extendToken, token } }: lineHeight: '18px', textAlign: 'center', letterSpacing: 0.32, - paddingLeft: 52, - paddingRight: 52 - // paddingBottom: 32, - // borderRadius: 24 + paddingLeft: 22, + paddingRight: 22, + fontWeight: 400 }, '.__buttons-container': { @@ -266,6 +270,10 @@ const AlertModal = styled(Component)(({ theme: { extendToken, token } }: } }, + '.anticon': { + fontSize: '24px !important' + }, + '.__alert-icon': { display: 'flex', justifyContent: 'center', diff --git a/packages/extension-koni-ui/src/contexts/AuthenticationMythProvider.tsx b/packages/extension-koni-ui/src/contexts/AuthenticationMythProvider.tsx index edce7483c8..0d1d11c551 100644 --- a/packages/extension-koni-ui/src/contexts/AuthenticationMythProvider.tsx +++ b/packages/extension-koni-ui/src/contexts/AuthenticationMythProvider.tsx @@ -20,16 +20,17 @@ export interface AuthenticationMythContextProps { account?: AccountPublicInfo; isLinkedMyth: boolean; mythicalWallet: MythicalWallet; - linkMythAccount: () => Promise; + linkMythAccount: (path: string) => Promise; onLogin: VoidFunction; onLogout: () => Promise; } export const LOCAL_LOGGED_IN_PROMISE_KEY = 'mythical_logged_in_promise'; +export const LOCAL_NAVIGATE_AFTER_LOGIN_KEY = 'mythical_navigate_after_login'; export const AuthenticationMythContext = createContext({ isLinkedMyth: false, - linkMythAccount: () => Promise.resolve(), + linkMythAccount: (path: string) => Promise.resolve(), mythicalWallet: { address: '', balanceInMyth: '' } as MythicalWallet, // eslint-disable-next-line @typescript-eslint/no-empty-function onLogin: () => {}, @@ -124,13 +125,17 @@ export const AuthenticationMythProvider = ({ children }: AuthenticationMythProvi } }, [authContext.token, tokenData?.email]); - const linkMythAccount = useCallback(async () => { + const linkMythAccount = useCallback(async (path: string) => { if (!tokenData?.email || !authContext.token) { + if (path) { + localStorage.setItem(LOCAL_NAVIGATE_AFTER_LOGIN_KEY, path); + } + onLoginWithMythAccount(); } await onSubmitMythAccount(); - }, [authContext.token, onLoginWithMythAccount, onSubmitMythAccount, tokenData?.email]); + }, [authContext, onLoginWithMythAccount, onSubmitMythAccount, tokenData]); const onLogin = useCallback(() => { onLoginWithMythAccount(); diff --git a/packages/webapp/public/assets/reset.css b/packages/webapp/public/assets/reset.css index 0832e489df..11560a63fd 100644 --- a/packages/webapp/public/assets/reset.css +++ b/packages/webapp/public/assets/reset.css @@ -650,8 +650,8 @@ div#popup-container { .ant-sw-modal .ant-sw-header-container-center .ant-sw-header-center-part { width: auto; - margin-left: 48px; - margin-right: 48px; + /*margin-left: 48px;*/ + /*margin-right: 48px;*/ } .ant-sw-sub-header-title-content {