l-min-components 1.7.1269 → 1.7.1287

package/package.json

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

package/src/components/AppMainLayout/index.jsx

@@ -109,6 +109,7 @@ const AppMainLayout = ({ children }) => {
   } = useHeader();
 
   // get current default account and store in cookie (from api)
+
   useEffect(() => {
     if (getDefaultAccount?.data) {
       const date = new Date();
@@ -305,6 +306,7 @@ const AppMainLayout = ({ children }) => {
         setNewNotifications,
         notificationMarkReadData,
         handleGetNotificationMarkRead,
+        planState,
       }}>
       {/* display mobile layout on device width*/}
       {deviceWidth < 1200 ? (

package/src/components/AppMainLayout/index.styled.js

@@ -18,6 +18,24 @@ export const Layout = styled.div`
     hasLayoutBackgroundImage ? "100%" : ""};
   background-position: ${({ hasLayoutBackgroundImage }) =>
     hasLayoutBackgroundImage ? "bottom" : ""};
+
+  scrollbar-width: thin;
+
+  min-height: 100vh;
+  /* "auto" or "thin" depending on browser support */
+  scrollbar-color: transparent transparent;
+
+  &::-webkit-scrollbar {
+    width: 6px;
+    /* adjust as needed */
+    background-color: transparent;
+    /* color value for track */
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: transparent;
+    /* color value for thumb */
+  }
 `;
 
 export const MainLayout = styled.div`
@@ -26,7 +44,8 @@ export const MainLayout = styled.div`
   justify-content: space-between;
   width: 100%;
   padding: 84px 20px 20px 0;
-  max-height: 100vh;
+  /* max-height: 100vh; */
+  min-height: 100vh;
 `;
 
 export const LeftLayout = styled.div`
@@ -44,23 +63,8 @@ export const CenterLayout = styled.div`
   @media screen and (max-width: 1023px) {
     margin-right: 0;
   }
-  overflow-y: scroll;
-  scrollbar-width: thin;
-  /* "auto" or "thin" depending on browser support */
-  scrollbar-color: transparent transparent;
-  /* color values for thumb and track */
 
-  &::-webkit-scrollbar {
-    width: 6px;
-    /* adjust as needed */
-    background-color: transparent;
-    /* color value for track */
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background-color: transparent;
-    /* color value for thumb */
-  }
+  /* color values for thumb and track */
 `;
 
 export const RightLayout = styled.div`

package/src/components/header/account-dropdown.jsx

@@ -50,7 +50,7 @@ const AccountDropdown = (props) => {
     // //console.log(id, "bam");
   };
 
-  console.log(props?.selectedAccount, "selected");
+  // console.log(props?.selectedAccount, "selected");
 
   return (
     <>

package/src/components/instructorAccountSwitcher/index.jsx

@@ -1,4 +1,4 @@
-import { useContext, useEffect, useState } from "react";
+import { useContext, useEffect, useMemo, useState } from "react";
 import styled from "styled-components";
 // import ExpiryModal from "./components/expiry modal";
 import Search from "../searchBar";
@@ -97,15 +97,36 @@ const InstructorAccountSwitcher = ({ generalData, onChange }) => {
     }
   };
 
-  useEffect(() => {
+  const { accountName, planState } = useContext(OutletContext);
+
+  // handle if account does not have subscription but is an affiliate
+  const prioritizedAffiliateId = useMemo(() => {
+    let prioritizedAffiliateId = null;
+
     if (cookieValue) {
+      // Priority 1: Use cookie value if it exists
+      prioritizedAffiliateId = cookieValue;
+    } else if (
+      !planState && // Check for NO subscription
+      getAllAffiliateData?.data?.results?.length > 0 // Check if the list exists and is not empty
+    ) {
+      // Priority 2: If no cookie, no subscription, and list exists...
+      // Assign the ID of the *first* affiliate directly from the results array
+      prioritizedAffiliateId = getAllAffiliateData.data.results[0]?.id; // Optional chaining on 'id'
+    }
+    return prioritizedAffiliateId;
+  }, [getAllAffiliateData, planState]);
+
+  useEffect(() => {
+    const cookie = prioritizedAffiliateId ?? cookieValue;
+    if (cookie) {
       setSwitchValue("affiliates");
-      onChange({ id: cookieValue });
+      onChange({ id: cookie });
     } else {
       setSwitchValue(null);
       onChange(null);
     }
-  }, []);
+  }, [prioritizedAffiliateId]);
 
   useEffect(() => {
     if (getAllAffiliateData?.data?.results?.length > 0) {
@@ -133,8 +154,6 @@ const InstructorAccountSwitcher = ({ generalData, onChange }) => {
     }
   };
 
-  const { accountName } = useContext(OutletContext);
-  console.log(selectedValue, "selected..");
   return getAllAffiliateData?.data?.results?.length > 0 && !search ? (
     <>
       {(setDefaultAffiliateData?.loading ||
@@ -217,20 +236,24 @@ const InstructorAccountSwitcher = ({ generalData, onChange }) => {
             </AffiliatesDropDown>
           )}
         </div>
-        <div className="btn__wrapper">
-          <button
-            className={switchValue !== "affiliates" ? "active" : ""}
-            onClick={() => handleSwitch(1)}>
-            <span>My Account</span>
-            <span className="circle"></span>
-          </button>
-          <button
-            className={switchValue === "affiliates" ? "active" : ""}
-            onClick={() => handleSwitch(2)}>
-            <span>Affiliates</span>
-            <span className="circle"></span>
-          </button>
-        </div>
+        {
+          <div className="btn__wrapper">
+            {!!!prioritizedAffiliateId && (
+              <button
+                className={switchValue !== "affiliates" ? "active" : ""}
+                onClick={() => handleSwitch(1)}>
+                <span>My Account</span>
+                <span className="circle"></span>
+              </button>
+            )}
+            <button
+              className={switchValue === "affiliates" ? "active" : ""}
+              onClick={() => handleSwitch(2)}>
+              <span>Affiliates</span>
+              <span className="circle"></span>
+            </button>
+          </div>
+        }
       </Container>
     </>
   ) : (