From 5d7fe8b363fb2d615255958df722a8e194ed8676 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Sat, 23 Dec 2023 17:35:45 -0500
Subject: [PATCH] read current subscriber tier and don't show onboarding note

---
 frontend/package.json                           |  3 ++-
 frontend/src/App.tsx                            |  8 +++++---
 frontend/src/components/hosted/AppContainer.tsx | 10 ++++++++++
 frontend/src/store/store.ts                     | 11 +++++++++++
 frontend/yarn.lock                              |  9 ++++++++-
 5 files changed, 36 insertions(+), 5 deletions(-)
 create mode 100644 frontend/src/store/store.ts

diff --git a/frontend/package.json b/frontend/package.json
index ae7d13b..e9e7e1c 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -47,7 +47,8 @@
     "tailwind-merge": "^2.0.0",
     "tailwindcss-animate": "^1.0.7",
     "thememirror": "^2.0.1",
-    "vite-plugin-checker": "^0.6.2"
+    "vite-plugin-checker": "^0.6.2",
+    "zustand": "^4.4.7"
   },
   "devDependencies": {
     "@types/node": "^20.9.0",
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 414fc1a..1353160 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -41,6 +41,7 @@ import { extractHistoryTree } from "./components/history/utils";
 import toast from "react-hot-toast";
 import ImportCodeSection from "./components/ImportCodeSection";
 import { useAuth } from "@clerk/clerk-react";
+import { useStore } from "./store/store";
 
 const IS_OPENAI_DOWN = false;
 
@@ -57,8 +58,10 @@ function App({ navbarComponent }: Props) {
   const [updateInstruction, setUpdateInstruction] = useState("");
   const [isImportedFromCode, setIsImportedFromCode] = useState<boolean>(false);
 
+  // Relevant for hosted version only
   // TODO: Move to AppContainer
   const { getToken } = useAuth();
+  const subscriberTier = useStore((state) => state.subscriberTier);
 
   // Settings
   const [settings, setSettings] = usePersistedState<Settings>(
@@ -357,9 +360,8 @@ function App({ navbarComponent }: Props) {
           />
 
           {IS_RUNNING_ON_CLOUD &&
-            !(settings.openAiApiKey || settings.accessCode) && (
-              <OnboardingNote />
-            )}
+            !(settings.openAiApiKey || settings.accessCode) &&
+            subscriberTier === "free" && <OnboardingNote />}
 
           {IS_OPENAI_DOWN && (
             <div className="bg-black text-white dark:bg-white dark:text-black p-3 rounded">
diff --git a/frontend/src/components/hosted/AppContainer.tsx b/frontend/src/components/hosted/AppContainer.tsx
index 5a6dbe3..377574b 100644
--- a/frontend/src/components/hosted/AppContainer.tsx
+++ b/frontend/src/components/hosted/AppContainer.tsx
@@ -5,11 +5,14 @@ import { AlertDialog } from "@radix-ui/react-alert-dialog";
 import { AlertDialogContent } from "../ui/alert-dialog";
 import FullPageSpinner from "../custom-ui/FullPageSpinner";
 import { useAuthenticatedFetch } from "./useAuthenticatedFetch";
+import { useStore } from "../../store/store";
 
 function AppContainer() {
   const [showPopup, setShowPopup] = useState(false);
   const { isSignedIn, isLoaded } = useUser();
 
+  const setSubscriberTier = useStore((state) => state.setSubscriberTier);
+
   // For fetching user
   const authenticatedFetch = useAuthenticatedFetch();
   const isInitRequestInProgress = useRef(false);
@@ -34,6 +37,13 @@ function AppContainer() {
         // "http://localhost:8001/users/create",
         "POST"
       );
+
+      if (!user.subscriber_tier) {
+        setSubscriberTier("free");
+      } else {
+        setSubscriberTier(user.subscriber_tier);
+      }
+
       console.log(user);
 
       isInitRequestInProgress.current = false;
diff --git a/frontend/src/store/store.ts b/frontend/src/store/store.ts
new file mode 100644
index 0000000..2dfe689
--- /dev/null
+++ b/frontend/src/store/store.ts
@@ -0,0 +1,11 @@
+import { create } from "zustand";
+
+interface Store {
+  subscriberTier: string;
+  setSubscriberTier: (tier: string) => void;
+}
+
+export const useStore = create<Store>((set) => ({
+  subscriberTier: "",
+  setSubscriberTier: (tier: string) => set(() => ({ subscriberTier: tier })),
+}));
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 4722580..5068854 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -3660,7 +3660,7 @@ use-sidecar@^1.1.2:
     detect-node-es "^1.1.0"
     tslib "^2.0.0"
 
-use-sync-external-store@^1.2.0:
+use-sync-external-store@1.2.0, use-sync-external-store@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
   integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==
@@ -3871,3 +3871,10 @@ yocto-queue@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-1.0.0.tgz#7f816433fb2cbc511ec8bf7d263c3b58a1a3c251"
   integrity sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==
+
+zustand@^4.4.7:
+  version "4.4.7"
+  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.4.7.tgz#355406be6b11ab335f59a66d2cf9815e8f24038c"
+  integrity sha512-QFJWJMdlETcI69paJwhSMJz7PPWjVP8Sjhclxmxmxv/RYI7ZOvR5BHX+ktH0we9gTWQMxcne8q1OY8xxz604gw==
+  dependencies:
+    use-sync-external-store "1.2.0"