Merge branch 'release/3.9.5'

2021-11-12 12:41:22 -06:00
parent 9dffe2470e 76258f5462
commit c4c98c8105
10 changed files with 71 additions and 45 deletions
--- a/app/assets/javascripts/components/ComponentView/IsExpired.tsx
+++ b/app/assets/javascripts/components/ComponentView/IsExpired.tsx
@@ -25,7 +25,7 @@ export const IsExpired: FunctionalComponent<IProps> = ({
                  rel={'noopener'}
                  target={'_blank'}
                >
-                  Your Extended subscription expired on {expiredDate}
+                  Your subscription expired on {expiredDate}
                </a>
                <div className={'sk-p'}>
                  Extensions are in a read-only state.
--- a/app/assets/javascripts/components/ComponentView/index.tsx
+++ b/app/assets/javascripts/components/ComponentView/index.tsx
@@ -82,12 +82,12 @@ export const ComponentView: FunctionalComponent<IProps> = observer(
        }
      }();

-      setIsExpired(component.valid_until && component.valid_until <= new Date());
+      setIsExpired(component.isExpired);

-      const readonlyState = application.componentManager!.getReadonlyStateForComponent(component);
+      const readonlyState = application.componentManager.getReadonlyStateForComponent(component);

      if (!readonlyState.lockReadonly) {
-        application.componentManager!.setReadonlyStateForComponent(component, isExpired);
+        application.componentManager.setReadonlyStateForComponent(component, isExpired);
      }
      setIsComponentValid(!offlineRestricted && !hasUrlError);

@@ -155,7 +155,7 @@ export const ComponentView: FunctionalComponent<IProps> = observer(
        }
      }
      clearTimeout(loadTimeout);
-      await application.componentManager!.registerComponentWindow(
+      await application.componentManager.registerComponentWindow(
        component,
        iframe.contentWindow!
      );
@@ -198,7 +198,7 @@ export const ComponentView: FunctionalComponent<IProps> = observer(
          return;
        }

-        const iframe = application.componentManager!.iframeForComponent(
+        const iframe = application.componentManager.iframeForComponent(
          component.uuid
        );
        if (!iframe) {
@@ -218,7 +218,7 @@ export const ComponentView: FunctionalComponent<IProps> = observer(
    const expiredDate = isExpired ? component.dateToLocalizedString(component.valid_until) : '';

    const getUrl = () => {
-      const url = component ? application.componentManager!.urlForComponent(component) : '';
+      const url = component ? application.componentManager.urlForComponent(component) : '';
      return url as string;
    };

@@ -265,13 +265,13 @@ export const ComponentView: FunctionalComponent<IProps> = observer(
        return;
      }

-      const unregisterComponentHandler = application.componentManager!.registerHandler({
+      const unregisterComponentHandler = application.componentManager.registerHandler({
        identifier: 'component-view-' + Math.random(),
        areas: [component.area],
        actionHandler: (component, action, data) => {
          switch (action) {
            case (ComponentAction.SetSize):
-              application.componentManager!.handleSetSizeEvent(component, data);
+              application.componentManager.handleSetSizeEvent(component, data);
              break;
            case (ComponentAction.KeyDown):
              application.io.handleComponentKeyDown(data.keyboardModifier);
--- a/app/assets/javascripts/components/shared/ModalDialog.tsx
+++ b/app/assets/javascripts/components/shared/ModalDialog.tsx
@@ -31,7 +31,7 @@ export const ModalDialogLabel: FunctionComponent<{
  closeDialog: () => void;
  className?: string;
 }> = ({ children, closeDialog, className }) => (
-  <AlertDialogLabel className={className}>
+  <AlertDialogLabel className={`sk-panel-header px-4.5 ${className}`}>
    <div className="w-full flex flex-row justify-between items-center">
      <div className="flex-grow color-text text-base font-medium">
        {children}
--- a/app/assets/javascripts/preferences/panes/account/Authentication.tsx
+++ b/app/assets/javascripts/preferences/panes/account/Authentication.tsx
@@ -3,7 +3,6 @@ import { Button } from '@/components/Button';
 import {
  PreferencesGroup,
  PreferencesSegment,
-  Subtitle,
  Text,
  Title,
 } from '@/preferences/components';
@@ -11,6 +10,7 @@ import { WebApplication } from '@/ui_models/application';
 import { AppState } from '@/ui_models/app_state';
 import { observer } from 'mobx-react-lite';
 import { FunctionComponent } from 'preact';
+import AccountIllustration from '../../../../svg/il-account.svg';

 export const Authentication: FunctionComponent<{
  application: WebApplication;
@@ -32,32 +32,27 @@ export const Authentication: FunctionComponent<{
    <PreferencesGroup>
      <PreferencesSegment>
        <div className="flex flex-col items-center px-12">
+          <AccountIllustration className="mb-3" />
          <Title>You're not signed in</Title>
-          <Subtitle className="text-center">
+          <Text className="text-center mb-3">
            Sign in to sync your notes and preferences across all your devices
            and enable end-to-end encryption.
-          </Subtitle>
-          <div className="min-h-3" />
-          <div className="flex flex-row w-full">
-            <Button
-              type="primary"
-              onClick={clickSignIn}
-              label="Sign in"
-              className="flex-grow"
-            />
-            <div className="min-w-3" />
-            <Button
-              type="primary"
-              onClick={clickRegister}
-              label="Register"
-              className="flex-grow"
-            />
-          </div>
-          <div className="min-h-3" />
-          <Text className="text-center">
-            Standard Notes is free on every platform, and comes standard with
-            sync and encryption.
          </Text>
+          <Button
+            type="primary"
+            label="Create free account"
+            onClick={clickRegister}
+            className="mb-3"
+          />
+          <div className="text-input">
+            Already have an account?{' '}
+            <button
+              className="border-0 p-0 bg-default color-info underline cursor-pointer"
+              onClick={clickSignIn}
+            >
+              Sign in
+            </button>
+          </div>
        </div>
      </PreferencesSegment>
    </PreferencesGroup>
--- a/app/assets/javascripts/preferences/panes/account/changeEmail/index.tsx
+++ b/app/assets/javascripts/preferences/panes/account/changeEmail/index.tsx
@@ -154,10 +154,7 @@ export const ChangeEmail: FunctionalComponent<Props> = ({
  return (
    <div>
      <ModalDialog>
-        <ModalDialogLabel
-          closeDialog={handleDialogClose}
-          className="sk-panel-header px-4.5"
-        >
+        <ModalDialogLabel closeDialog={handleDialogClose}>
          Change Email
        </ModalDialogLabel>
        <ModalDialogDescription className="px-4.5">
--- a/app/assets/javascripts/purchaseFlow/PurchaseFlowWrapper.tsx
+++ b/app/assets/javascripts/purchaseFlow/PurchaseFlowWrapper.tsx
@@ -10,7 +10,9 @@ export type PurchaseFlowWrapperProps = {
  application: WebApplication;
 };

-export const getPurchaseFlowUrl = async (application: WebApplication): Promise<string | undefined> => {
+export const getPurchaseFlowUrl = async (
+  application: WebApplication
+): Promise<string | undefined> => {
  const currentUrl = window.location.origin;
  const successUrl = isDesktopApplication() ? `standardnotes://` : currentUrl;
  if (application.noAccount()) {
@@ -27,8 +29,11 @@ export const loadPurchaseFlowUrl = async (
  application: WebApplication
 ): Promise<boolean> => {
  const url = await getPurchaseFlowUrl(application);
+  const params = new URLSearchParams(window.location.search);
+  const period = params.get('period') ? `&period=${params.get('period')}` : '';
+  const plan = params.get('plan') ? `&plan=${params.get('plan')}` : '';
  if (url) {
-    window.location.assign(url);
+    window.location.assign(`${url}${period}${plan}`);
    return true;
  }
  return false;
--- a/app/assets/stylesheets/_sn.scss
+++ b/app/assets/stylesheets/_sn.scss
@@ -24,6 +24,10 @@
  display: none;
 }

+.underline {
+  text-decoration: underline;
+}
+
 .hover\:underline:hover {
  text-decoration: underline;
 }
--- a/app/assets/svg/il-account.svg
+++ b/app/assets/svg/il-account.svg
@@ -0,0 +1,25 @@
+<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="60" cy="60" r="60" fill="#F4F5F7" />
+  <g filter="url(#filter0_d_118_16)">
+    <rect x="31" y="31" width="58" height="58" rx="4" fill="white" />
+    <rect x="64" y="45" width="17" height="4" rx="2" fill="#BBBEC4" />
+    <rect x="64" y="51" width="17" height="4" rx="2" fill="#BBBEC4" />
+    <rect x="64" y="57" width="17" height="4" rx="2" fill="#BBBEC4" />
+    <path
+      d="M54 45C55.9891 45 57.8968 45.7902 59.3033 47.1967C60.7098 48.6032 61.5 50.5109 61.5 52.5C61.5 54.4891 60.7098 56.3968 59.3033 57.8033C57.8968 59.2098 55.9891 60 54 60C52.0109 60 50.1032 59.2098 48.6967 57.8033C47.2902 56.3968 46.5 54.4891 46.5 52.5C46.5 50.5109 47.2902 48.6032 48.6967 47.1967C50.1032 45.7902 52.0109 45 54 45ZM54 61.875C59.0063 61.875 69 64.3687 69 69.375V75H39V69.375C39 64.3687 48.9937 61.875 54 61.875Z"
+      fill="#BBBEC4" />
+  </g>
+  <defs>
+    <filter id="filter0_d_118_16" x="19" y="23" width="82" height="82" filterUnits="userSpaceOnUse"
+      color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+        result="hardAlpha" />
+      <feOffset dy="4" />
+      <feGaussianBlur stdDeviation="6" />
+      <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.16 0" />
+      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_118_16" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_118_16" result="shape" />
+    </filter>
+  </defs>
+</svg>
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "standard-notes-web",
-  "version": "3.9.2",
+  "version": "3.9.3",
  "license": "AGPL-3.0-or-later",
  "repository": {
    "type": "git",
@@ -72,7 +72,7 @@
    "@reach/listbox": "^0.16.2",
    "@standardnotes/features": "1.8.1",
    "@standardnotes/sncrypto-web": "1.5.3",
-    "@standardnotes/snjs": "2.17.5",
+    "@standardnotes/snjs": "2.17.7",
    "mobx": "^6.3.5",
    "mobx-react-lite": "^3.2.1",
    "preact": "^10.5.15",
--- a/yarn.lock
+++ b/yarn.lock
@@ -2199,10 +2199,10 @@
    buffer "^6.0.3"
    libsodium-wrappers "^0.7.9"

-"@standardnotes/snjs@2.17.5":
-  version "2.17.5"
-  resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.5.tgz#19382b6d29947d896d543c7824a6129547196540"
-  integrity sha512-sdqcavG5C46VybOq2aQ8bEDEGvXE3sjjcwJJBVsTWCANQkFFh0k7gTA3y3n9ZiWncjoYpBOpuvwr6wpBwJE8EA==
+"@standardnotes/snjs@2.17.7":
+  version "2.17.7"
+  resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.7.tgz#10f56e46d6a992e84da94fb7b9ec8dfc8a9a8da3"
+  integrity sha512-7BxEywqhIfYHfkKDlS466vMeWPznXwXrQVj21eKG4ibiAyYhuTXRUYhnCwZKdloNm9Wl0iChJXuiWfev2+tGqg==
  dependencies:
    "@standardnotes/auth" "^3.8.1"
    "@standardnotes/common" "^1.2.1"