diff --git a/packages/mobile/src/Lib/Application.ts b/packages/mobile/src/Lib/Application.ts index e299f185f..107094d48 100644 --- a/packages/mobile/src/Lib/Application.ts +++ b/packages/mobile/src/Lib/Application.ts @@ -13,6 +13,7 @@ import { platformFromString, SNApplication, SNComponentManager, + StorageValueModes, } from '@standardnotes/snjs' import { Platform } from 'react-native' @@ -21,6 +22,7 @@ import { MobileAlertService } from './AlertService' import { ApplicationState } from './ApplicationState' import { BackupsService } from './BackupsService' import { ComponentManager } from './ComponentManager' +import { AlwaysOpenWebAppOnLaunchKey } from './constants' import { FilesService } from './FilesService' import { InstallationService } from './InstallationService' import { MobileDevice } from './Interface' @@ -135,7 +137,8 @@ export class MobileApplication extends SNApplication { } promptForChallenge(challenge: Challenge) { - if (IsMobileWeb) { + const optedIntoWebPreview = this.getValue(AlwaysOpenWebAppOnLaunchKey, StorageValueModes.Nonwrapped) as boolean + if (IsMobileWeb || optedIntoWebPreview) { return } diff --git a/packages/mobile/src/Screens/Settings/Sections/NewMobilePreview.tsx b/packages/mobile/src/Screens/Settings/Sections/NewMobilePreview.tsx new file mode 100644 index 000000000..6ff7cfdf6 --- /dev/null +++ b/packages/mobile/src/Screens/Settings/Sections/NewMobilePreview.tsx @@ -0,0 +1,69 @@ +import { AlwaysOpenWebAppOnLaunchKey } from '@Lib/constants' +import { ApplicationContext } from '@Root/ApplicationContext' +import { ButtonCell } from '@Root/Components/ButtonCell' +import { SectionHeader } from '@Root/Components/SectionHeader' +import { TableSection } from '@Root/Components/TableSection' +import { ButtonType, StorageValueModes } from '@standardnotes/snjs' +import React, { useContext } from 'react' +import styled from 'styled-components/native' +import { Label } from './CompanySection.styled' +import { BaseView, StyledSectionedTableCell } from './EncryptionSection.styled' + +const Title = styled.Text` + color: ${({ theme }) => theme.stylekitForegroundColor}; + font-size: 16px; + font-weight: bold; +` + +export const NewMobileSection = () => { + const application = useContext(ApplicationContext) + + if (!application) { + return <> + } + + const optIn = async () => { + const confirmationText = + 'This will close the app and switch to the new mobile experience next time you open it. You will be able to switch back to the soon-to-be removed classic experience from the settings.' + + if ( + await application.alertService.confirm( + confirmationText, + 'Switch To New Mobile Experience?', + 'Switch', + ButtonType.Info, + ) + ) { + application.setValue(AlwaysOpenWebAppOnLaunchKey, true, StorageValueModes.Nonwrapped) + setTimeout(() => application.deviceInterface.performSoftReset(), 1000) + } + } + + return ( + + + + + + 🎉 New Mobile Experience Preview + + + + + + { + application?.deviceInterface!.openUrl( + 'https://blog.standardnotes.com/38384/our-new-mobile-experience-is-launching-soon', + ) + }} + > + + ) +} diff --git a/packages/mobile/src/Screens/Settings/Sections/OptionsSection.tsx b/packages/mobile/src/Screens/Settings/Sections/OptionsSection.tsx index 4fc018f1d..18011857b 100644 --- a/packages/mobile/src/Screens/Settings/Sections/OptionsSection.tsx +++ b/packages/mobile/src/Screens/Settings/Sections/OptionsSection.tsx @@ -1,4 +1,3 @@ -import { AlwaysOpenWebAppOnLaunchKey } from '@Lib/constants' import { useSignedIn } from '@Lib/SnjsHelperHooks' import { useNavigation } from '@react-navigation/native' import { ButtonCell } from '@Root/Components/ButtonCell' @@ -9,7 +8,7 @@ import { TableSection } from '@Root/Components/TableSection' import { useSafeApplicationContext } from '@Root/Hooks/useSafeApplicationContext' import { ModalStackNavigationProp } from '@Root/ModalStack' import { SCREEN_MANAGE_SESSIONS, SCREEN_SETTINGS } from '@Root/Screens/screens' -import { ButtonType, PrefKey, StorageValueModes } from '@standardnotes/snjs' +import { ButtonType, PrefKey } from '@standardnotes/snjs' import moment from 'moment' import React, { useCallback, useMemo, useState } from 'react' import { Platform } from 'react-native' @@ -222,21 +221,6 @@ export const OptionsSection = ({ title, encryptionAvailable }: Props) => { onPress={onExportPress} /> - { - const confirmationText = - 'This will close the app and fully switch to the web view next time you open it. You will be able to switch back from the settings.' - - if ( - await application.alertService.confirm(confirmationText, 'Switch To Web View?', 'Switch', ButtonType.Info) - ) { - application.setValue(AlwaysOpenWebAppOnLaunchKey, true, StorageValueModes.Nonwrapped) - setTimeout(() => application.deviceInterface.performSoftReset(), 1000) - } - }} - title="Switch to Web View" - /> - {!signedIn && ( { + {application.hasAccount() && isEntitledToFiles && } diff --git a/packages/web/src/javascripts/Components/Preferences/Panes/General/Defaults.tsx b/packages/web/src/javascripts/Components/Preferences/Panes/General/Defaults.tsx index 9e62d1e30..20b447148 100644 --- a/packages/web/src/javascripts/Components/Preferences/Panes/General/Defaults.tsx +++ b/packages/web/src/javascripts/Components/Preferences/Panes/General/Defaults.tsx @@ -126,10 +126,10 @@ const Defaults: FunctionComponent = ({ application }) => { {application.isNativeMobileWeb() && ( <>
- Switch to Native View + Switch to Classic Mobile Experience - This will close the app and fully switch to the native view next time you open it. You will be able to - switch back from the settings. + This will close the app and switch back to the soon-to-be removed classic mobile experience. You can opt + back in to new experience from the app settings.