l-min-components 1.0.701 → 1.0.705

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "l-min-components",
-  "version": "1.0.701",
+  "version": "1.0.705",
   "type": "module",
   "files": [
     "src/assets",

package/src/components/AppMainLayout/index.jsx

@@ -26,6 +26,7 @@ import InstructorRightBar from "../fileRightBar/instructorRightBar";
 import EnterpriseRightBar from "../fileRightBar/enterpriseRightBar";
 import PersonalRightBar from "../fileRightBar/personalRightBar";
 import useHeader from "../header/getHeaderDetails";
+import GracePeriod from "../deactivated";
 
 const AppMainLayout = () => {
   const [isOpen, setIsOpen] = useState(true);
@@ -48,11 +49,15 @@ const AppMainLayout = () => {
   const [accessToken, setAccessToken] = useState("");
   const [envType, setEnvType] = useState("");
   const [newNotifications, setNewNotifications] = useState([]);
+  const [deactivated, setDeactivated] = useState(true) // testing, until we get account setup
+
   const {
     setDefaultAccount,
     handleSetDefaultAccount,
     notificationMarkReadData,
     handleGetNotificationMarkRead,
+    userPlanData,
+    handleGetUserPlan,
   } = useHeader();
 
   useEffect(() => {
@@ -128,6 +133,13 @@ const AppMainLayout = () => {
   }, []);
   console.log("envType", envType);
 
+  useEffect(() => {
+    handleGetUserPlan()
+  }, [])
+
+  const currentPlan = userPlanData?.data?.current_plan;
+  const planState = userPlanData?.data?.state
+
   return (
     <OutletContext.Provider
       value={{
@@ -206,7 +218,7 @@ const AppMainLayout = () => {
                 />
               )}
 
-            <Outlet />
+            {window.location.pathname.includes("enterprise") && deactivated ? <GracePeriod /> : <Outlet />}
           </CenterLayout>
 
           {rightLayout && !coming && (

package/src/components/deactivated/index.jsx

@@ -0,0 +1,82 @@
+import React from 'react';
+import { useLocation } from "react-router-dom";
+import styled from 'styled-components';
+
+const routes = [
+  { path: "dashboard", title: "Dashboard" },
+  { path: "reports", title: "Reports" },
+  { path: "courses", title: "Courses" },
+  { path: "manage-teams", title: "Manage Teams" },
+  { path: "msg/messages", title: "Messages" },
+  { path: "announcements", title: "Announcements" },
+  { path: "file-manager", title: "File Manager" },
+];
+
+const GracePeriod = () => {
+  const location = useLocation();
+
+  const getTitleFromPath = (path) => {
+    const route = routes.find(route => path.includes(route.path));
+    return route?.title || "Dashboard";
+  };
+
+  const pageTitle = getTitleFromPath(location.pathname);
+
+  return (
+    <GracePeriodWrapper>
+      <h1>{pageTitle}</h1>
+      <div className="gracePeriod_account">
+        <div className="content">
+          <p>Sorry, you can’t access your account</p>
+        </div>
+      </div>
+    </GracePeriodWrapper>
+  );
+};
+
+const GracePeriodWrapper = styled.div`
+  h1 {
+    margin-top: 0px;
+    margin-bottom: 20px;
+    color: #313333;
+    font-size: 24px;
+  }
+
+  .gracePeriod_account {
+    border-radius: 30.67px;
+    background: var(--white, #fff);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 670px;
+    flex-shrink: 0;
+
+    .content {
+      border-radius: 15px;
+      background: var(--Neutral-10, #f5f7f7);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      display: inline-flex;
+      padding: 30px 18px;
+      flex-direction: column;
+      align-items: center;
+      gap: 30px;
+
+      p {
+        color: var(--Neutral-90, #313333);
+        text-align: center;
+        font-feature-settings: "salt" on, "liga" off;
+        font-family: Nunito;
+        font-size: 25px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 120%; /* 30px */
+        width: 306px;
+      }
+    }
+  }
+`;
+
+export default GracePeriod;

package/src/components/deactivated/useAccount.js

@@ -0,0 +1,39 @@
+import useAxios from "axios-hooks";
+
+const useAccount = () => {
+
+  // current plan
+  const [{ ...userPlanData }, getUserPlan] = useAxios(
+    {
+      url: `/payment/v1/current_plan/`,
+      method: "GET",
+    },
+
+    {
+      manual: true,
+    }
+  );
+
+  const handleGetUserPlan = async () => {
+    try {
+      await getUserPlan();
+    } catch (err) {
+      console.log(err);
+    }
+  };
+
+
+
+  
+
+
+
+  return {
+
+    userPlanData,
+    handleGetUserPlan,
+  
+   
+  };
+};
+export default useAccount;

package/src/components/header/getHeaderDetails.js

@@ -154,6 +154,26 @@ const handleGetNotificationMarkRead = async () => {
     }
   };
 
+    // current plan
+    const [{ ...userPlanData }, getUserPlan] = useAxios(
+      {
+        url: `/payment/v1/current_plan/`,
+        method: "GET",
+      },
+  
+      {
+        manual: true,
+      }
+    );
+  
+    const handleGetUserPlan = async () => {
+      try {
+        await getUserPlan();
+      } catch (err) {
+        console.log(err);
+      }
+    };
+
   return {
     handleGetUserDetails,
     userDetails,
@@ -170,7 +190,10 @@ const handleGetNotificationMarkRead = async () => {
     notificationMarkReadData,
     handleGetNotificationMarkRead,
     notificationData,
-    handleGetNotification
+    handleGetNotification,
+
+    userPlanData,
+    handleGetUserPlan,
   };
 };
 export default useHeader;