Merge branch 'release/3.9.4'

This commit is contained in:
Mo Bitar
2021-11-11 15:32:51 -06:00
7 changed files with 107 additions and 48 deletions

View File

@@ -23,7 +23,7 @@ export const OfflineSubscription: FunctionalComponent<IProps> = observer(({ appl
const [hasUserPreviouslyStoredCode, setHasUserPreviouslyStoredCode] = useState(false); const [hasUserPreviouslyStoredCode, setHasUserPreviouslyStoredCode] = useState(false);
useEffect(() => { useEffect(() => {
if (application.getIsOfflineActivationCodeStoredPreviously()) { if (application.hasOfflineRepo()) {
setHasUserPreviouslyStoredCode(true); setHasUserPreviouslyStoredCode(true);
} }
}, [application]); }, [application]);
@@ -35,7 +35,7 @@ export const OfflineSubscription: FunctionalComponent<IProps> = observer(({ appl
const handleSubscriptionCodeSubmit = async (event: TargetedEvent<HTMLFormElement, Event>) => { const handleSubscriptionCodeSubmit = async (event: TargetedEvent<HTMLFormElement, Event>) => {
event.preventDefault(); event.preventDefault();
const result = await application.setOfflineFeatures(activationCode); const result = await application.setOfflineFeaturesCode(activationCode);
if (result?.error) { if (result?.error) {
await application.alertService.alert(result.error); await application.alertService.alert(result.error);
@@ -47,7 +47,7 @@ export const OfflineSubscription: FunctionalComponent<IProps> = observer(({ appl
}; };
const handleRemoveOfflineKey = async () => { const handleRemoveOfflineKey = async () => {
await application.removeOfflineActivationCode(); await application.deleteOfflineFeatureRepo();
setIsSuccessfullyActivated(false); setIsSuccessfullyActivated(false);
setHasUserPreviouslyStoredCode(false); setHasUserPreviouslyStoredCode(false);

View File

@@ -34,9 +34,9 @@ export const PurchaseFlowView: FunctionComponent<PurchaseFlowViewProps> =
const { currentPane } = appState.purchaseFlow; const { currentPane } = appState.purchaseFlow;
return ( return (
<div className="flex items-center justify-center h-full w-full absolute top-left-0 z-index-purchase-flow bg-grey-2"> <div className="flex items-center justify-center overflow-hidden h-full w-full absolute top-left-0 z-index-purchase-flow bg-grey-2">
<div style={{maxWidth: '100%', overflow: 'scroll'}} className="relative fit-content"> <div className="relative fit-content">
<div style={{overflow: 'scroll'}} className="relative p-12 mb-4 bg-default border-1 border-solid border-main rounded"> <div className="relative p-12 xs:px-8 mb-4 bg-default border-1 border-solid border-main rounded xs:rounded-0">
<SNLogoFull className="mb-5" /> <SNLogoFull className="mb-5" />
<PurchaseFlowPaneSelector <PurchaseFlowPaneSelector
currentPane={currentPane} currentPane={currentPane}
@@ -44,7 +44,7 @@ export const PurchaseFlowView: FunctionComponent<PurchaseFlowViewProps> =
application={application} application={application}
/> />
</div> </div>
<div className="flex justify-end"> <div className="flex justify-end xs:px-4">
<a <a
className="mr-3 font-medium color-grey-1" className="mr-3 font-medium color-grey-1"
href="https://standardnotes.com/privacy" href="https://standardnotes.com/privacy"

View File

@@ -33,7 +33,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
const confirmPasswordInputRef = useRef<HTMLInputElement>(null); const confirmPasswordInputRef = useRef<HTMLInputElement>(null);
useEffect(() => { useEffect(() => {
if (emailInputRef.current) emailInputRef.current!.focus(); if (emailInputRef.current) emailInputRef.current?.focus();
}, []); }, []);
const handleEmailChange = (e: Event) => { const handleEmailChange = (e: Event) => {
@@ -69,30 +69,30 @@ export const CreateAccount: FunctionComponent<Props> = observer(
const handleCreateAccount = async () => { const handleCreateAccount = async () => {
if (!email) { if (!email) {
emailInputRef?.current!.focus(); emailInputRef?.current?.focus();
return; return;
} }
if (!isEmailValid(email)) { if (!isEmailValid(email)) {
setIsEmailInvalid(true); setIsEmailInvalid(true);
emailInputRef?.current!.focus(); emailInputRef?.current?.focus();
return; return;
} }
if (!password) { if (!password) {
passwordInputRef?.current!.focus(); passwordInputRef?.current?.focus();
return; return;
} }
if (!confirmPassword) { if (!confirmPassword) {
confirmPasswordInputRef?.current!.focus(); confirmPasswordInputRef?.current?.focus();
return; return;
} }
if (password !== confirmPassword) { if (password !== confirmPassword) {
setConfirmPassword(''); setConfirmPassword('');
setIsPasswordNotMatching(true); setIsPasswordNotMatching(true);
confirmPasswordInputRef?.current!.focus(); confirmPasswordInputRef?.current?.focus();
return; return;
} }
@@ -128,7 +128,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
<BlueDot className="absolute w-4 h-4 bottom-25% -right-10" /> <BlueDot className="absolute w-4 h-4 bottom-25% -right-10" />
<Diamond className="absolute w-18 h-18 top-0 -right-2 translate-x-1/2 -z-index-1" /> <Diamond className="absolute w-18 h-18 top-0 -right-2 translate-x-1/2 -z-index-1" />
<div className="mr-12"> <div className="mr-12 md:mr-0">
<h1 className="mt-0 mb-2 text-2xl">Create your free account</h1> <h1 className="mt-0 mb-2 text-2xl">Create your free account</h1>
<div className="mb-4 font-medium text-sm"> <div className="mb-4 font-medium text-sm">
to continue to Standard Notes. to continue to Standard Notes.
@@ -136,7 +136,9 @@ export const CreateAccount: FunctionComponent<Props> = observer(
<form onSubmit={handleCreateAccount}> <form onSubmit={handleCreateAccount}>
<div className="flex flex-col"> <div className="flex flex-col">
<FloatingLabelInput <FloatingLabelInput
className={`min-w-90 ${isEmailInvalid ? 'mb-2' : 'mb-4'}`} className={`min-w-90 xs:min-w-auto ${
isEmailInvalid ? 'mb-2' : 'mb-4'
}`}
id="purchase-sign-in-email" id="purchase-sign-in-email"
type="email" type="email"
label="Email" label="Email"
@@ -152,7 +154,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
</div> </div>
) : null} ) : null}
<FloatingLabelInput <FloatingLabelInput
className="min-w-90 mb-4" className="min-w-90 xs:min-w-auto mb-4"
id="purchase-create-account-password" id="purchase-create-account-password"
type="password" type="password"
label="Password" label="Password"
@@ -162,7 +164,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
disabled={isCreatingAccount} disabled={isCreatingAccount}
/> />
<FloatingLabelInput <FloatingLabelInput
className={`min-w-90 ${ className={`min-w-90 xs:min-w-auto ${
isPasswordNotMatching ? 'mb-2' : 'mb-4' isPasswordNotMatching ? 'mb-2' : 'mb-4'
}`} }`}
id="create-account-confirm" id="create-account-confirm"
@@ -181,16 +183,25 @@ export const CreateAccount: FunctionComponent<Props> = observer(
) : null} ) : null}
</div> </div>
</form> </form>
<div className="flex justify-between"> <div className="flex xs:flex-col-reverse xs:items-start items-center justify-between">
<button <div className="flex flex-col">
onClick={handleSignInInstead} <button
disabled={isCreatingAccount} onClick={handleSignInInstead}
className="p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline" disabled={isCreatingAccount}
> className="flex items-start p-0 mb-2 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
Sign in instead >
</button> Sign in instead
</button>
<button
onClick={subscribeWithoutAccount}
disabled={isCreatingAccount}
className="flex items-start p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
>
Subscribe without account
</button>
</div>
<Button <Button
className="py-2.5" className="py-2.5 xs:mb-4"
type="primary" type="primary"
label={ label={
isCreatingAccount ? 'Creating account...' : 'Create account' isCreatingAccount ? 'Creating account...' : 'Create account'
@@ -199,15 +210,8 @@ export const CreateAccount: FunctionComponent<Props> = observer(
disabled={isCreatingAccount} disabled={isCreatingAccount}
/> />
</div> </div>
<button
onClick={subscribeWithoutAccount}
disabled={isCreatingAccount}
className="p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
>
Subscribe without account
</button>
</div> </div>
<Illustration /> <Illustration className="md:hidden" />
</div> </div>
); );
} }

View File

@@ -31,7 +31,7 @@ export const SignIn: FunctionComponent<Props> = observer(
const passwordInputRef = useRef<HTMLInputElement>(null); const passwordInputRef = useRef<HTMLInputElement>(null);
useEffect(() => { useEffect(() => {
if (emailInputRef.current) emailInputRef.current!.focus(); if (emailInputRef.current) emailInputRef.current?.focus();
}, []); }, []);
const handleEmailChange = (e: Event) => { const handleEmailChange = (e: Event) => {
@@ -56,18 +56,18 @@ export const SignIn: FunctionComponent<Props> = observer(
const handleSignIn = async () => { const handleSignIn = async () => {
if (!email) { if (!email) {
emailInputRef?.current!.focus(); emailInputRef?.current?.focus();
return; return;
} }
if (!isEmailValid(email)) { if (!isEmailValid(email)) {
setIsEmailInvalid(true); setIsEmailInvalid(true);
emailInputRef?.current!.focus(); emailInputRef?.current?.focus();
return; return;
} }
if (!password) { if (!password) {
passwordInputRef?.current!.focus(); passwordInputRef?.current?.focus();
return; return;
} }
@@ -117,7 +117,7 @@ export const SignIn: FunctionComponent<Props> = observer(
<form onSubmit={handleSignIn}> <form onSubmit={handleSignIn}>
<div className="flex flex-col"> <div className="flex flex-col">
<FloatingLabelInput <FloatingLabelInput
className={`min-w-90 ${ className={`min-w-90 xs:min-w-auto ${
isEmailInvalid && !otherErrorMessage ? 'mb-2' : 'mb-4' isEmailInvalid && !otherErrorMessage ? 'mb-2' : 'mb-4'
}`} }`}
id="purchase-sign-in-email" id="purchase-sign-in-email"
@@ -135,7 +135,9 @@ export const SignIn: FunctionComponent<Props> = observer(
</div> </div>
) : null} ) : null}
<FloatingLabelInput <FloatingLabelInput
className={`min-w-90 ${otherErrorMessage ? 'mb-2' : 'mb-4'}`} className={`min-w-90 xs:min-w-auto ${
otherErrorMessage ? 'mb-2' : 'mb-4'
}`}
id="purchase-sign-in-password" id="purchase-sign-in-password"
type="password" type="password"
label="Password" label="Password"

View File

@@ -683,3 +683,49 @@
.rounded-0\.5 { .rounded-0\.5 {
border-radius: 0.125rem; border-radius: 0.125rem;
} }
@media screen and (max-width: 480px) {
.sn-component {
.xs\:items-start {
align-items: flex-start;
}
.xs\:px-4 {
padding-left: 1rem;
padding-right: 1rem;
}
.xs\:px-8 {
padding-left: 2rem;
padding-right: 2rem;
}
.xs\:mb-4 {
margin-bottom: 1rem;
}
.xs\:min-w-auto {
min-width: auto;
}
.xs\:flex-col-reverse {
flex-flow: column-reverse;
}
.xs\:rounded-0 {
border-radius: 0;
}
}
}
@media screen and (max-width: $screen-md-min) {
.sn-component {
.md\:hidden {
display: none;
}
.md\:mr-0 {
margin-right: 0;
}
}
}

View File

@@ -1,6 +1,6 @@
{ {
"name": "standard-notes-web", "name": "standard-notes-web",
"version": "3.9.1", "version": "3.9.2",
"license": "AGPL-3.0-or-later", "license": "AGPL-3.0-or-later",
"repository": { "repository": {
"type": "git", "type": "git",
@@ -72,7 +72,7 @@
"@reach/listbox": "^0.16.2", "@reach/listbox": "^0.16.2",
"@standardnotes/features": "1.8.1", "@standardnotes/features": "1.8.1",
"@standardnotes/sncrypto-web": "1.5.3", "@standardnotes/sncrypto-web": "1.5.3",
"@standardnotes/snjs": "2.17.4", "@standardnotes/snjs": "2.17.5",
"mobx": "^6.3.5", "mobx": "^6.3.5",
"mobx-react-lite": "^3.2.1", "mobx-react-lite": "^3.2.1",
"preact": "^10.5.15", "preact": "^10.5.15",

View File

@@ -2166,13 +2166,20 @@
dependencies: dependencies:
"@standardnotes/auth" "^3.8.1" "@standardnotes/auth" "^3.8.1"
"@standardnotes/features@1.8.1", "@standardnotes/features@^1.8.1": "@standardnotes/features@1.8.1":
version "1.8.1" version "1.8.1"
resolved "https://registry.yarnpkg.com/@standardnotes/features/-/features-1.8.1.tgz#addea86a8a4288a0046bc674a8e76f1bac3c2f89" resolved "https://registry.yarnpkg.com/@standardnotes/features/-/features-1.8.1.tgz#addea86a8a4288a0046bc674a8e76f1bac3c2f89"
integrity sha512-yDbMLu9SnwR4cmjsIMgpxBOK9kIbWVQ7WezfJ5MN0FAwD2IbfKCMaWBMUJStCtSqkKE4dkL3BC+sIxik/4RwdQ== integrity sha512-yDbMLu9SnwR4cmjsIMgpxBOK9kIbWVQ7WezfJ5MN0FAwD2IbfKCMaWBMUJStCtSqkKE4dkL3BC+sIxik/4RwdQ==
dependencies: dependencies:
"@standardnotes/common" "^1.2.1" "@standardnotes/common" "^1.2.1"
"@standardnotes/features@^1.8.2":
version "1.8.2"
resolved "https://registry.yarnpkg.com/@standardnotes/features/-/features-1.8.2.tgz#ecc8162ca80ee3740468aa55a64c23b519c13505"
integrity sha512-EYeYYT/WBIh7fMVTVhsy0INjVdyHVtnH90pbZQHNPpsUkLdj05DzuyxUKjsc0oxiskmZjPOVSfXt8l3RL5Av4g==
dependencies:
"@standardnotes/common" "^1.2.1"
"@standardnotes/settings@^1.2.1": "@standardnotes/settings@^1.2.1":
version "1.2.1" version "1.2.1"
resolved "https://registry.yarnpkg.com/@standardnotes/settings/-/settings-1.2.1.tgz#4c7656ea86d784a2f77c70acc89face5d28da024" resolved "https://registry.yarnpkg.com/@standardnotes/settings/-/settings-1.2.1.tgz#4c7656ea86d784a2f77c70acc89face5d28da024"
@@ -2192,15 +2199,15 @@
buffer "^6.0.3" buffer "^6.0.3"
libsodium-wrappers "^0.7.9" libsodium-wrappers "^0.7.9"
"@standardnotes/snjs@2.17.4": "@standardnotes/snjs@2.17.5":
version "2.17.4" version "2.17.5"
resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.4.tgz#ebf9d59a297ee7d87db1631e8850ba53dd9e7bea" resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.5.tgz#19382b6d29947d896d543c7824a6129547196540"
integrity sha512-ucxhSG8scDZd+JguK0bPLNwSg99w+jpYnCM+RZpd6GTkVjHBy3DEFnM06KrDzubLAtbKE8b7I50DOI+5C4p2rg== integrity sha512-sdqcavG5C46VybOq2aQ8bEDEGvXE3sjjcwJJBVsTWCANQkFFh0k7gTA3y3n9ZiWncjoYpBOpuvwr6wpBwJE8EA==
dependencies: dependencies:
"@standardnotes/auth" "^3.8.1" "@standardnotes/auth" "^3.8.1"
"@standardnotes/common" "^1.2.1" "@standardnotes/common" "^1.2.1"
"@standardnotes/domain-events" "^2.5.1" "@standardnotes/domain-events" "^2.5.1"
"@standardnotes/features" "^1.8.1" "@standardnotes/features" "^1.8.2"
"@standardnotes/settings" "^1.2.1" "@standardnotes/settings" "^1.2.1"
"@standardnotes/sncrypto-common" "^1.5.2" "@standardnotes/sncrypto-common" "^1.5.2"