l-min-components 1.0.197 → 1.0.203

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "l-min-components",
-  "version": "1.0.197",
+  "version": "1.0.203",
   "type": "module",
   "files": [
     "src/assets",
@@ -17,6 +17,7 @@
     "axios-hooks": "^4.0.0",
     "chart.js": "^4.2.1",
     "classnames": "^2.3.2",
+    "l-min-components": "^1.0.197",
     "moment": "^2.29.4",
     "prop-types": "^15.8.1",
     "rc-slider": "^10.1.1",

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

@@ -25,12 +25,16 @@ export const CenterLayout = styled.div`
   width: 100%;
   /* max-width: 900px; */
   margin: 0 20px;
+  overflow-y: scroll;
 `;
 
 export const RightLayout = styled.div`
   width: 100%;
   max-width: 232px;
-
+  position: fixed;
+  max-height: 609px;
+  height: 609px;
+  right: 20px;
   > div {
     width: 100%;
   }

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

@@ -25,22 +25,21 @@ const AccountDropdown = (props) => {
   const [selectedAccount, setSelectedAccount] = useState();
   const navigate = useNavigate();
   const { pathname } = useLocation();
-  useEffect(() => {
-    if (pathname?.includes("personal")) {
-      setSelectedAccount(personalAccountData[0]);
-    }
-    if (window.location.host?.includes("developer")) {
-      setSelectedAccount(developerAccountData[0]);
-    }
-    if (pathname?.includes("instructor")) {
-      setSelectedAccount(instructorAccountData[0]);
-    }
-    if (pathname?.includes("enterprise")) {
-      setSelectedAccount(enterpriseAccountData[0]);
-    }
-  }, [pathname]);
+  useEffect(() => {}, [pathname]);
   useEffect(() => {
     if (props?.data?.data) {
+      if (pathname?.includes("personal")) {
+        setSelectedAccount(personalAccountData[0]);
+      }
+      if (window.location.host?.includes("developer")) {
+        setSelectedAccount(developerAccountData[0]);
+      }
+      if (pathname?.includes("instructor")) {
+        setSelectedAccount(instructorAccountData[0]);
+      }
+      if (pathname?.includes("enterprise")) {
+        setSelectedAccount(enterpriseAccountData[0]);
+      }
       let personalArray = [];
       let developerArray = [];
       let instructorArray = [];

package/src/components/header/index.jsx

@@ -51,12 +51,12 @@ const HeaderComponent = (props) => {
     <Navbar>
       <img src={logo} alt="Learngual logo" />
       <Nav>
-        {/* <li>
+        <li>
           <a href="#" className="active">
             <BookIcon /> Learning
           </a>
         </li>
-        <li>
+        {/* <li>
           <a href="#">
             <PeopleIcon /> Friends
           </a>

package/src/components/sideBar/sideMenu/index.jsx

@@ -43,7 +43,8 @@ const SideMenu = ({
         className={cx(`${route.text}`, ({ isActive, isPending }) => {
           isActive ? "active" : "";
         })}
-        minimal={isOpen}>
+        minimal={isOpen}
+      >
         <IconContainer active={active}>{icon}</IconContainer>
 
         <TextContainer minimal={isOpen}>{text}</TextContainer>

package/src/components/sideBar/sideMenu/styles/index.jsx

@@ -2,12 +2,13 @@ import styled from "styled-components";
 import { NavLink } from "react-router-dom";
 
 export const SideMenuContainer = styled.div`
-  position: relative;
+  position: fixed;
 
   width: ${({ isOpen }) => (isOpen ? "239px" : "48px")};
-  height: 80vh;
+  height: 609px;
+  max-height: 609px;
   display: flex;
-  flex-direction: column; 
+  flex-direction: column;
 
   background-color: #00c2c2;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
@@ -43,6 +44,7 @@ export const NavigationItemContainer = styled(NavLink)`
   display: flex;
   align-items: center;
   gap: 10px;
+
   cursor: pointer;
   position: relative;
   padding: ${({ minimal }) => (minimal ? "12px 16px" : "12px 12px")};

package/src/components/sideNav/index.jsx

@@ -16,7 +16,11 @@ const SideBar = ({ routes }) => {
       <NavItems>
         {routes.map((route) => (
           <NavItem key={route.path}>
-            <NavLinkStyled to={route.path} activeClassName="active">
+            <NavLinkStyled
+              to={route.path}
+              activeClassName="active"
+              className={route?.label === "Learning" ? "active" : ""}
+            >
               <Icon>{route.icon}</Icon>
               <span className="text">{route.label}</span>
             </NavLinkStyled>