diff --git a/frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx b/frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx index 2d58d5cd8..57d0820bd 100644 --- a/frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx +++ b/frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx @@ -16,6 +16,7 @@ import task from "../../../assets/task.svg"; import VectorDbIcon from "../../../assets/vector-db.svg"; import TextExtractorIcon from "../../../assets/text-extractor.svg"; import { useSessionStore } from "../../../store/session-store"; +import { useMemo } from "react"; let getMenuItem; try { @@ -31,10 +32,16 @@ try { // Plugin unavailable. } +let unstractSubscriptionPlan; +let unstractSubscriptionPlanStore; let dashboardSideMenuItem; +let UNSTRACT_SUBSCRIPTION_PLANS; try { - dashboardSideMenuItem = - require("../../../plugins/unstract-subscription/helper/constants").dashboardSideMenuItem; + unstractSubscriptionPlanStore = require("../../../plugins/store/unstract-subscription-plan-store"); + const unstractSubscriptionConstants = require("../../../plugins/unstract-subscription/helper/constants"); + dashboardSideMenuItem = unstractSubscriptionConstants?.dashboardSideMenuItem; + UNSTRACT_SUBSCRIPTION_PLANS = + unstractSubscriptionConstants?.UNSTRACT_SUBSCRIPTION_PLANS; } catch (err) { // Plugin unavailable. } @@ -43,6 +50,18 @@ const SideNavBar = ({ collapsed }) => { const navigate = useNavigate(); const { sessionDetails } = useSessionStore(); const { orgName, flags } = sessionDetails; + + try { + if (unstractSubscriptionPlanStore?.useUnstractSubscriptionPlanStore) { + unstractSubscriptionPlan = + unstractSubscriptionPlanStore?.useUnstractSubscriptionPlanStore( + (state) => state?.unstractSubscriptionPlan + ); + } + } catch (error) { + // Do nothing + } + let menu; if (sideMenu) { menu = sideMenu.useSideMenu(); @@ -170,7 +189,26 @@ const SideNavBar = ({ collapsed }) => { const data = menu || unstractMenuItems; if (getMenuItem && flags?.app_deployment) { - data[0]?.subMenu?.splice(1, 0, getMenuItem?.default(orgName)); + data[0]?.subMenu?.splice(1, 0, getMenuItem.default(orgName)); + } + + const shouldDisableAll = useMemo(() => { + if (!unstractSubscriptionPlan || !UNSTRACT_SUBSCRIPTION_PLANS) { + return false; + } + + return ( + !unstractSubscriptionPlan?.subscriptionId && + unstractSubscriptionPlan?.planType !== UNSTRACT_SUBSCRIPTION_PLANS?.TRIAL + ); + }, [unstractSubscriptionPlan]); + + if (shouldDisableAll) { + data.forEach((mainMenuItem) => { + mainMenuItem.subMenu.forEach((subMenuItem) => { + subMenuItem.disable = true; + }); + }); } return ( @@ -184,53 +222,51 @@ const SideNavBar = ({ collapsed }) => { >
- {data?.map((item, index) => { - return ( -
- {!collapsed && ( - - {item.mainTitle} - - )} - - {item.subMenu.map((el) => { - return ( - - { - !el.disable && navigate(el.path); - }} - > - side_icon - {!collapsed && ( -
- - {el.title} - - - {el.description} - -
- )} -
-
- ); - })} -
- {index < data.length - 1 && ( - - )} -
- ); - })} + {data?.map((item, index) => ( +
+ {!collapsed && ( + + {item.mainTitle} + + )} + + {item.subMenu.map((el) => ( + + { + if (!el.disable) { + navigate(el.path); + } + }} + > + side_icon + {!collapsed && ( +
+ + {el.title} + + + {el.description} + +
+ )} +
+
+ ))} +
+ {index < data.length - 1 && ( + + )} +
+ ))}
diff --git a/frontend/src/components/navigations/top-nav-bar/TopNavBar.jsx b/frontend/src/components/navigations/top-nav-bar/TopNavBar.jsx index 2dd2d23ed..7cf512ad4 100644 --- a/frontend/src/components/navigations/top-nav-bar/TopNavBar.jsx +++ b/frontend/src/components/navigations/top-nav-bar/TopNavBar.jsx @@ -68,6 +68,17 @@ try { // Ignore if hook not available } +let unstractSubscriptionPlan; +let unstractSubscriptionPlanStore; +let UNSTRACT_SUBSCRIPTION_PLANS; +try { + unstractSubscriptionPlanStore = require("../../../plugins/store/unstract-subscription-plan-store"); + UNSTRACT_SUBSCRIPTION_PLANS = + require("../../../plugins/unstract-subscription/helper/constants").UNSTRACT_SUBSCRIPTION_PLANS; +} catch (err) { + // Plugin unavailable. +} + function TopNavBar({ isSimpleLayout, topNavBarOptions }) { const navigate = useNavigate(); const { sessionDetails } = useSessionStore(); @@ -89,6 +100,28 @@ function TopNavBar({ isSimpleLayout, topNavBarOptions }) { ); } + try { + if (unstractSubscriptionPlanStore?.useUnstractSubscriptionPlanStore) { + unstractSubscriptionPlan = + unstractSubscriptionPlanStore?.useUnstractSubscriptionPlanStore( + (state) => state?.unstractSubscriptionPlan + ); + } + } catch (error) { + // Do nothing + } + + const shouldDisableRouting = useMemo(() => { + if (!unstractSubscriptionPlan || !UNSTRACT_SUBSCRIPTION_PLANS) { + return false; + } + + return ( + !unstractSubscriptionPlan?.subscriptionId && + unstractSubscriptionPlan?.planType !== UNSTRACT_SUBSCRIPTION_PLANS?.TRIAL + ); + }, [unstractSubscriptionPlan]); + const isUnstract = !(selectedProduct && selectedProduct !== "unstract"); // Check user role and whether the onboarding is incomplete @@ -185,6 +218,7 @@ function TopNavBar({ isSimpleLayout, topNavBarOptions }) { @@ -223,6 +257,7 @@ function TopNavBar({ isSimpleLayout, topNavBarOptions }) { @@ -238,6 +273,7 @@ function TopNavBar({ isSimpleLayout, topNavBarOptions }) { @@ -250,6 +286,7 @@ function TopNavBar({ isSimpleLayout, topNavBarOptions }) { @@ -277,6 +314,7 @@ function TopNavBar({ isSimpleLayout, topNavBarOptions }) { cascadeOptions, orgName, orgId, + shouldDisableRouting, ]); // Function to get the initials from the user name diff --git a/frontend/src/helpers/GetStaticData.js b/frontend/src/helpers/GetStaticData.js index e75e1e560..fc597d652 100644 --- a/frontend/src/helpers/GetStaticData.js +++ b/frontend/src/helpers/GetStaticData.js @@ -170,21 +170,30 @@ const listOfAppDeployments = [ }, ]; -const getReadableDateAndTime = (timestamp) => { +const getReadableDateAndTime = (timestamp, includeTime = true) => { const currentDate = new Date(timestamp); - // Options for formatting the date and time - const options = { - year: "numeric", - month: "long", - day: "numeric", + if (isNaN(currentDate)) { + return "Invalid date"; + } + + // Options for formatting the date + const dateOptions = { year: "numeric", month: "long", day: "numeric" }; + const formattedDate = currentDate.toLocaleDateString("en-US", dateOptions); + + if (!includeTime) { + return formattedDate; + } + + // Options for formatting the time + const timeOptions = { hour: "2-digit", minute: "2-digit", second: "2-digit", timeZoneName: "short", }; - const formattedDate = currentDate.toLocaleDateString("en-US", options); - const formattedTime = currentDate.toLocaleTimeString("en-US", options); + const formattedTime = currentDate.toLocaleTimeString("en-US", timeOptions); + return formattedDate + ", " + formattedTime; }; diff --git a/frontend/src/routes/useMainAppRoutes.js b/frontend/src/routes/useMainAppRoutes.js index f77e96ad5..7309a63b7 100644 --- a/frontend/src/routes/useMainAppRoutes.js +++ b/frontend/src/routes/useMainAppRoutes.js @@ -109,7 +109,10 @@ function useMainAppRoutes() { } /> )} {UnstractSubscriptionPage && ( - } /> + } + /> )} } />