From 73b91e59643872593af403db2a5967804d3aa4cc Mon Sep 17 00:00:00 2001
From: Mo <mo@standardnotes.org>
Date: Tue, 9 Nov 2021 19:33:10 -0600
Subject: [PATCH] fix: reload subscription state after event (#727)

* fix: reload subscription state after event

* chore: yarn.lock

* chore: lint

* fix: hook exhaustive deps
---
 .../panes/account/subscription/Subscription.tsx | 17 ++++++++++++++++-
 package.json                                    |  2 +-
 yarn.lock                                       |  8 ++++----
 3 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/preferences/panes/account/subscription/Subscription.tsx b/app/assets/javascripts/preferences/panes/account/subscription/Subscription.tsx
index 8dd21999853..c1c2476ac27 100644
--- a/app/assets/javascripts/preferences/panes/account/subscription/Subscription.tsx
+++ b/app/assets/javascripts/preferences/panes/account/subscription/Subscription.tsx
@@ -11,6 +11,7 @@ import { NoSubscription } from './NoSubscription';
 import { Text } from '@/preferences/components';
 import { observer } from 'mobx-react-lite';
 import { FunctionComponent } from 'preact';
+import { ApplicationEvent } from '@standardnotes/snjs';
 
 type Props = {
   application: WebApplication;
@@ -58,6 +59,20 @@ export const Subscription: FunctionComponent<Props> = observer(({
     }
   }, [getSubscription, getSubscriptions]);
 
+  useEffect(() => {
+    const removeUserRoleObserver = application.addEventObserver(
+      async () => {
+        await getSubscription();
+        await getSubscriptions();
+      },
+      ApplicationEvent.UserRolesChanged
+    );
+
+    return () => {
+      removeUserRoleObserver();
+    };
+  }, [application, getSubscription, getSubscriptions]);
+
   useEffect(() => {
     if (application.hasAccount()) {
       getSubscriptionInfo();
@@ -77,7 +92,7 @@ export const Subscription: FunctionComponent<Props> = observer(({
             ) : loading ? (
               <Text>Loading subscription information...</Text>
             ) : userSubscription && userSubscription.endsAt > now ? (
-              <SubscriptionInformation subscriptionState={subscriptionState} application={application}/>
+              <SubscriptionInformation subscriptionState={subscriptionState} application={application} />
             ) : (
               <NoSubscription application={application} />
             )}
diff --git a/package.json b/package.json
index 15586671cac..8d049a4aba7 100644
--- a/package.json
+++ b/package.json
@@ -72,7 +72,7 @@
     "@reach/listbox": "^0.16.2",
     "@standardnotes/features": "1.8.1",
     "@standardnotes/sncrypto-web": "1.5.3",
-    "@standardnotes/snjs": "2.17.2",
+    "@standardnotes/snjs": "2.17.4",
     "mobx": "^6.3.5",
     "mobx-react-lite": "^3.2.1",
     "preact": "^10.5.15",
diff --git a/yarn.lock b/yarn.lock
index ba7a8a23510..db843232df0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2192,10 +2192,10 @@
     buffer "^6.0.3"
     libsodium-wrappers "^0.7.9"
 
-"@standardnotes/snjs@2.17.2":
-  version "2.17.2"
-  resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.2.tgz#69a54769291495fe0f4062892a7defaf6b22c0ed"
-  integrity sha512-JSvCwfcDqphWiGSUD5rAbQSMBAd0nmuzeCTnEU2Ee916/nxpNXuiovPPx2xbnxh1hNgBa6cY4nbUsw6szuhCMA==
+"@standardnotes/snjs@2.17.4":
+  version "2.17.4"
+  resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.4.tgz#ebf9d59a297ee7d87db1631e8850ba53dd9e7bea"
+  integrity sha512-ucxhSG8scDZd+JguK0bPLNwSg99w+jpYnCM+RZpd6GTkVjHBy3DEFnM06KrDzubLAtbKE8b7I50DOI+5C4p2rg==
   dependencies:
     "@standardnotes/auth" "^3.8.1"
     "@standardnotes/common" "^1.2.1"