From 52bb4ce4c373eb7a3c9598e6faa2cd0144e6fee9 Mon Sep 17 00:00:00 2001
From: AykutSarac <aykutsarac0@gmail.com>
Date: Sat, 4 May 2024 23:47:15 +0300
Subject: [PATCH] feat: all remove premium states

---
 src/containers/Modals/AccountModal/index.tsx | 41 ++++++--------------
 src/containers/Modals/CloudModal/index.tsx   | 15 ++++---
 src/containers/Toolbar/index.tsx             | 27 +------------
 src/layout/Navbar/index.tsx                  |  8 +---
 src/store/useModal.ts                        |  3 --
 src/store/useUser.ts                         |  8 ----
 6 files changed, 21 insertions(+), 81 deletions(-)

diff --git a/src/containers/Modals/AccountModal/index.tsx b/src/containers/Modals/AccountModal/index.tsx
index dbbe78f..4d62220 100644
--- a/src/containers/Modals/AccountModal/index.tsx
+++ b/src/containers/Modals/AccountModal/index.tsx
@@ -16,10 +16,6 @@ import useUser from "src/store/useUser";
 
 export const AccountModal: React.FC<ModalProps> = ({ opened, onClose }) => {
   const user = useUser(state => state.user);
-  const isPremium = useUser(state => state.premium);
-  const isOrg = useUser(state => state.organization);
-  const isOrgAdmin = useUser(state => state.orgAdmin);
-  const premiumCancelled = useUser(state => state.premiumCancelled);
   const setVisible = useModal(state => state.setVisible);
   const logout = useUser(state => state.logout);
 
@@ -48,12 +44,11 @@ export const AccountModal: React.FC<ModalProps> = ({ opened, onClose }) => {
               <Text fz="xs" c="dimmed">
                 <Badge
                   size="sm"
-                  variant={isPremium ? "gradient" : "dot"}
-                  color={premiumCancelled || !isPremium ? "dark" : "green"}
+                  variant="dot"
+                  color="dark"
                   gradient={{ from: "#8800fe", to: "#ff00cc", deg: 35 }}
                 >
-                  {isPremium ? "Premium" : "Free"}{" "}
-                  {premiumCancelled ? "(Cancelled)" : isOrg && "(Organization)"}
+                  Free
                 </Badge>
               </Text>
             </Group>
@@ -63,28 +58,14 @@ export const AccountModal: React.FC<ModalProps> = ({ opened, onClose }) => {
 
       <Divider py="xs" />
       <Group justify="right">
-        {isPremium && !premiumCancelled ? (
-          <Button
-            variant="light"
-            color="red"
-            onClick={() => {
-              setVisible("cancelPremium")(true);
-              onClose();
-            }}
-            disabled={isOrg && !isOrgAdmin}
-          >
-            Cancel Subscription
-          </Button>
-        ) : (
-          <Button
-            variant="gradient"
-            gradient={{ from: "teal", to: "lime", deg: 105 }}
-            leftSection={<IoRocketSharp />}
-            onClick={() => setVisible("premium")(true)}
-          >
-            UPGRADE TO PREMIUM!
-          </Button>
-        )}
+        <Button
+          variant="gradient"
+          gradient={{ from: "teal", to: "lime", deg: 105 }}
+          leftSection={<IoRocketSharp />}
+          onClick={() => setVisible("premium")(true)}
+        >
+          Upgrade to Premium
+        </Button>
         <Button
           color="red"
           onClick={() => {
diff --git a/src/containers/Modals/CloudModal/index.tsx b/src/containers/Modals/CloudModal/index.tsx
index 69e10d7..b13654e 100644
--- a/src/containers/Modals/CloudModal/index.tsx
+++ b/src/containers/Modals/CloudModal/index.tsx
@@ -33,7 +33,6 @@ import { VscAdd, VscEdit, VscLock, VscUnlock } from "react-icons/vsc";
 import { FileFormat } from "src/enums/file.enum";
 import { documentSvc } from "src/services/document.service";
 import useFile, { File } from "src/store/useFile";
-import useUser from "src/store/useUser";
 
 dayjs.extend(relativeTime);
 
@@ -86,9 +85,9 @@ const UpdateNameModal: React.FC<{
   );
 };
 
+const TOTAL_QUOTA = 25;
+
 export const CloudModal: React.FC<ModalProps> = ({ opened, onClose }) => {
-  const totalQuota = useUser(state => (state.premium ? 200 : 25));
-  const isPremium = useUser(state => state.premium);
   const getContents = useFile(state => state.getContents);
   const setHasChanges = useFile(state => state.setHasChanges);
   const getFormat = useFile(state => state.getFormat);
@@ -101,8 +100,8 @@ export const CloudModal: React.FC<ModalProps> = ({ opened, onClose }) => {
 
   const isCreateDisabled = React.useMemo(() => {
     if (!data?.length) return false;
-    return isPremium ? data.length >= 200 : data.length >= 25;
-  }, [isPremium, data?.length]);
+    return data.length >= TOTAL_QUOTA;
+  }, [data?.length]);
 
   const onCreate = async () => {
     try {
@@ -227,8 +226,8 @@ export const CloudModal: React.FC<ModalProps> = ({ opened, onClose }) => {
                 thickness={6}
                 sections={[
                   {
-                    value: (data.length * 100) / totalQuota,
-                    color: data.length > totalQuota / 1.5 ? "red" : "blue",
+                    value: (data.length * 100) / TOTAL_QUOTA,
+                    color: data.length > TOTAL_QUOTA / 1.5 ? "red" : "blue",
                   },
                 ]}
               />
@@ -237,7 +236,7 @@ export const CloudModal: React.FC<ModalProps> = ({ opened, onClose }) => {
                   Total Quota
                 </Text>
                 <Text fw={700} size="lg">
-                  {data.length} / {totalQuota}
+                  {data.length} / {TOTAL_QUOTA}
                 </Text>
               </div>
             </Group>
diff --git a/src/containers/Toolbar/index.tsx b/src/containers/Toolbar/index.tsx
index e0d9ebe..d9435b7 100644
--- a/src/containers/Toolbar/index.tsx
+++ b/src/containers/Toolbar/index.tsx
@@ -1,17 +1,15 @@
 import React from "react";
-import { Badge, Flex, Group, Indicator, Select, Text } from "@mantine/core";
+import { Flex, Group, Indicator, Select, Text } from "@mantine/core";
 import { useSessionStorage } from "@mantine/hooks";
 import toast from "react-hot-toast";
 import { AiOutlineFullscreen } from "react-icons/ai";
 import { AiFillGift } from "react-icons/ai";
-import { BsBoxArrowUpLeft } from "react-icons/bs";
 import { FiDownload } from "react-icons/fi";
 import { SearchInput } from "src/components/SearchInput";
 import { FileFormat } from "src/enums/file.enum";
 import { JSONCrackLogo } from "src/layout/JsonCrackLogo";
 import useFile from "src/store/useFile";
 import useModal from "src/store/useModal";
-import useUser from "src/store/useUser";
 import { AccountMenu } from "./AccountMenu";
 import { FileMenu } from "./FileMenu";
 import { Logo } from "./Logo";
@@ -35,7 +33,6 @@ export const Toolbar: React.FC<{ isWidget?: boolean }> = ({ isWidget = false })
   const setVisible = useModal(state => state.setVisible);
   const setFormat = useFile(state => state.setFormat);
   const format = useFile(state => state.format);
-  const premium = useUser(state => state.premium);
   const [seenPremium, setSeenPremium] = useSessionStorage({
     key: "seenPremium",
     defaultValue: false,
@@ -78,7 +75,7 @@ export const Toolbar: React.FC<{ isWidget?: boolean }> = ({ isWidget = false })
         </Group>
       )}
       <Group gap="xs" justify="right" w="100%" style={{ flexWrap: "nowrap" }}>
-        {!premium && !isWidget && (
+        {!isWidget && (
           <Styles.StyledToolElement
             onClick={() => {
               setSeenPremium(true);
@@ -106,26 +103,6 @@ export const Toolbar: React.FC<{ isWidget?: boolean }> = ({ isWidget = false })
           </Styles.StyledToolElement>
         )}
 
-        {premium && !isWidget && (
-          <a href="https://app.jsoncrack.com/sign-in">
-            <Styles.StyledToolElement>
-              <Text
-                display="flex"
-                c="teal"
-                fz="xs"
-                fw={600}
-                style={{ textAlign: "center", gap: 8, alignItems: "center" }}
-              >
-                <BsBoxArrowUpLeft />
-                Premium editor has moved!
-                <Badge size="xs" variant="light" color="teal">
-                  New
-                </Badge>
-              </Text>
-            </Styles.StyledToolElement>
-          </a>
-        )}
-
         <SearchInput />
         {!isWidget && (
           <>
diff --git a/src/layout/Navbar/index.tsx b/src/layout/Navbar/index.tsx
index 44d7858..0728d27 100644
--- a/src/layout/Navbar/index.tsx
+++ b/src/layout/Navbar/index.tsx
@@ -1,9 +1,7 @@
 import React from "react";
 import Link from "next/link";
 import { Button } from "@mantine/core";
-import { useDisclosure } from "@mantine/hooks";
 import styled from "styled-components";
-import useUser from "src/store/useUser";
 import { JSONCrackLogo } from "../JsonCrackLogo";
 
 const StyledNavbarWrapper = styled.div`
@@ -36,10 +34,6 @@ const Right = styled.div`
 `;
 
 export const Navbar = () => {
-  const hasSession = useUser(state => !!state.user);
-  const premium = useUser(state => state.premium);
-  const [opened, { toggle }] = useDisclosure();
-
   return (
     <StyledNavbarWrapper className="navbar">
       <StyledNavbar>
@@ -100,7 +94,7 @@ export const Navbar = () => {
           <Button
             component={Link}
             prefetch={false}
-            href={premium ? "https://app.jsoncrack.com/editor" : "/editor"}
+            href="/editor"
             color="dark"
             visibleFrom="sm"
             radius="xl"
diff --git a/src/store/useModal.ts b/src/store/useModal.ts
index ab4d2d6..6922e46 100644
--- a/src/store/useModal.ts
+++ b/src/store/useModal.ts
@@ -30,7 +30,6 @@ const initialStates: ModalState = {
 };
 
 const authModals: Modal[] = ["cloud", "account"];
-const premiumModals: Modal[] = [];
 
 const useModal = create<ModalState & ModalActions>()(set => ({
   ...initialStates,
@@ -39,8 +38,6 @@ const useModal = create<ModalState & ModalActions>()(set => ({
 
     if (authModals.includes(modal) && !user.isAuthenticated) {
       return set({ login: true });
-    } else if (premiumModals.includes(modal) && !user.premium) {
-      return set({ premium: true });
     }
 
     if (visible) gaEvent("modal", `open ${modal}`);
diff --git a/src/store/useUser.ts b/src/store/useUser.ts
index cc867ac..d2afbe9 100644
--- a/src/store/useUser.ts
+++ b/src/store/useUser.ts
@@ -12,19 +12,11 @@ interface UserActions {
 interface UserStates {
   user: User | null;
   isAuthenticated: boolean;
-  premium: boolean;
-  premiumCancelled: boolean;
-  organization: boolean;
-  orgAdmin: boolean;
 }
 
 const initialStates: UserStates = {
   user: null,
   isAuthenticated: false,
-  premium: false,
-  premiumCancelled: false,
-  organization: false,
-  orgAdmin: false,
 };
 
 const useUser = create<UserStates & UserActions>()(set => ({