l-min-components 1.0.805 → 1.0.817

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "l-min-components",
-  "version": "1.0.805",
+  "version": "1.0.817",
   "type": "module",
   "files": [
     "src/assets",
@@ -18,8 +18,11 @@
     "axios-hooks": "^4.0.0",
     "chart.js": "4.4.1",
     "classnames": "^2.3.2",
+    "dexie": "^4.0.8",
+    "dexie-react-hooks": "^1.1.7",
     "emoji-picker-react": "^4.4.10",
     "i": "^0.3.7",
+    "iso-639-1": "^3.1.2",
     "js-cookie": "^3.0.5",
     "lottie-web": "^5.12.2",
     "moment": "^2.29.4",

package/src/components/AdminResetPassword/index.jsx

@@ -16,7 +16,7 @@ const AdminChangePassword = () => {
       </div>
       <div className="reset_form">
         <div className="rsf_header">
-        <span onClick={() => navigate(-1)}>
+          <span onClick={() => navigate(-1)}>
             <BackArrow /> Back{" "}
           </span>
           <img src={logo} alt="" />
@@ -25,7 +25,7 @@ const AdminChangePassword = () => {
         <div className="form_card">
           <h5 className="reset_txt"> RESET PASSWORD </h5>
           <p className="reset_subtile">
-          Enter your email to reset your password
+            Enter your email to reset your password
           </p>
 
           <form action="">

package/src/components/AdminSecuritySettings/2fa/index.jsx

@@ -36,7 +36,7 @@ const AdminTwoFaSecurity = () => {
   };
 
   const handleOptionChange = (newValue) => {
-    console.log("New value:", newValue);
+    //console.log("New value:", newValue);
     setType(newValue);
   };
 

package/src/components/AdminSecuritySettings/modals/otp-password-modal.jsx

@@ -76,7 +76,7 @@ const OTPSecurityModal = (props) => {
   const handlePaste = (event, index) => {
     event.preventDefault();
     const pastedText = event.clipboardData.getData("text");
-    console.log(pastedText, "text");
+    //console.log(pastedText, "text");
     const sanitizedText = pastedText.replace(/[^0-9]/g, "").slice(0, 6);
 
     const textArray = [];
@@ -97,8 +97,7 @@ const OTPSecurityModal = (props) => {
       style={modalCustomStyles}
       closeTimeoutMS={0}
       ariaHideApp={false}
-      contentLabel="Selected Option"
-    >
+      contentLabel="Selected Option">
       <ModalCardContainer>
         <CloseModalButton onClick={props.onRequestClose}>
           <IoMdClose />
@@ -110,9 +109,13 @@ const OTPSecurityModal = (props) => {
           <CardBody>
             <p className="mdld-2fa-title">
               An OTP has been sent to your{" "}
-              {props.OTPtype === "phone"
-                ? <>Phone <br /> number that ends with</>
-                : "email address"}{" "}
+              {props.OTPtype === "phone" ? (
+                <>
+                  Phone <br /> number that ends with
+                </>
+              ) : (
+                "email address"
+              )}{" "}
               {props.OTPvalue}
             </p>
 

package/src/components/ApiProgress/ApiConsumption/index.jsx

@@ -3,9 +3,9 @@ import { Container } from "./styles";
 import Switch from "../toggle";
 import ProgressBar from "../ApiProgressBar";
 import { BsCheck } from "react-icons/bs";
-import Alerm from "./assets/Vector"
+import Alerm from "./assets/Vector";
 
-const ApiConsumption = ({onClick}) => {
+const ApiConsumption = ({ onClick }) => {
   const [disabled, setDisabled] = useState(false);
   const [used, setUsed] = useState(300);
 
@@ -13,7 +13,7 @@ const ApiConsumption = ({onClick}) => {
     setUsed(newUsed);
   };
   const handleToggle = (e) => {
-    console.log(e.target.checked);
+    //console.log(e.target.checked);
 
     setDisabled(e.target.checked);
   };
@@ -30,18 +30,16 @@ const ApiConsumption = ({onClick}) => {
               onChange={handleToggle}
             />
           </div>
-         
+
           <p className="v-text">View Api consumption (sec)</p>
         </div>
-        
+
         <div className="notify">
           <p>Set Notification</p>
           <div className="bell" onClick={onClick}>
-            <Alerm/>
+            <Alerm />
           </div>
-         
         </div>
-        
       </div>
       <ProgressBar
         total={1000}

package/src/components/AppMainLayout/index.jsx

@@ -144,7 +144,7 @@ const AppMainLayout = () => {
       setEnvType("live");
     }
   }, []);
-  console.log("envType", envType);
+  //console.log("envType", envType);
 
   useEffect(() => {
     handleGetUserPlan();
@@ -153,8 +153,9 @@ const AppMainLayout = () => {
   const currentPlan = userPlanData?.data?.current_plan;
   const planState = userPlanData?.data?.state;
 
-  const { textSchema, setDefaultLang, defaultLang, findText } = useTranslation();
-  // console.log(findText());
+  const { textSchema, setDefaultLang, defaultLang, findText, isLoading, setIsLoading } =
+    useTranslation();
+  // //console.log(findText());
   return (
     textSchema && (
       <OutletContext.Provider
@@ -163,6 +164,8 @@ const AppMainLayout = () => {
           findText,
           defaultLang,
           setDefaultLang,
+          isLoading,
+          setIsLoading,
           setRightComponent,
           setRightLayout,
           generalData,
@@ -190,16 +193,14 @@ const AppMainLayout = () => {
           setNewNotifications,
           notificationMarkReadData,
           handleGetNotificationMarkRead,
-        }}
-      >
+        }}>
         {/* display mobile layout on device width*/}
         {deviceWidth < 1200 ? (
           <MobileLayout />
         ) : (
           <Layout
             coming={coming}
-            hasLayoutBackgroundImage={hasLayoutBackgroundImage}
-          >
+            hasLayoutBackgroundImage={hasLayoutBackgroundImage}>
             <HeaderComponent setNewNotifications={setNewNotifications} />
             <MainLayout coming={coming}>
               <LeftLayout>

package/src/components/banner/index.jsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useContext } from "react";
 import {
   AbsoluteSVG,
   ArrowIcon,
@@ -11,31 +11,39 @@ import {
 import BannerImg from "./assets/banner.png";
 import Button from "../button";
 import { FaArrowRight } from "react-icons/fa";
+import { OutletContext } from "../AppMainLayout";
+import useTranslation from "../../hooks/useTranslation";
 
 const Banner = () => {
+  const { textSchema, findText } = useTranslation();
+
   return (
-    <BannerWrapper>
-      <BannerTitle>Learn languages, anytime, anywhere.</BannerTitle>
-      <BannerSubtitle>
-        Join millions of users from all over the world to learn foreign
-        languages
-      </BannerSubtitle>
-      <BannerImage src={BannerImg} alt="Banner" />
-      <Button
-        type="primary"
-        text="Get started"
-        icon={{
-          jsx: FaArrowRight,
-          right: true,
-        }}
-        styles={{
-          marginTop: "29px",
-          fontSize: "16px",
-          width: "200px",
-          gap: "8px",
-        }}
-      />
-    </BannerWrapper>
+    textSchema && (
+      <BannerWrapper>
+        <BannerTitle>
+          {" "}
+          {findText("Learn languages, anytime, anywhere.")}
+        </BannerTitle>
+        <BannerSubtitle>
+          {findText(`Join millions of users from all over the world to learn foreign languages`)}
+        </BannerSubtitle>
+        <BannerImage src={BannerImg} alt="Banner" />
+        <Button
+          type="primary"
+          text="Get started"
+          icon={{
+            jsx: FaArrowRight,
+            right: true,
+          }}
+          styles={{
+            marginTop: "29px",
+            fontSize: "16px",
+            width: "200px",
+            gap: "8px",
+          }}
+        />
+      </BannerWrapper>
+    )
   );
 };
 

package/src/components/button/index.jsx

@@ -25,103 +25,105 @@ const ButtonComponent = (props) => {
   const handleClick = useCallback((e) => {
     props.onClick && props.onClick(e);
   }, []);
-  // console.log(props);
+  // //console.log(props);
   switch (props.type) {
     case "primary":
       return (
-        textSchema &&
-        <Button
-          disabled={props.disabled}
-          onClick={handleClick}
-          style={props.styles}>
-          {props.icon?.left && props.icon.jsx ? (
-            <props.icon.jsx
-              {...{
-                width: props.icon.width,
-                height: props.icon.height,
-                stroke: props.icon.stroke,
-              }}
-            />
-          ) : (
-            props.icon?.left && (
-              <TestIcon
+        textSchema && (
+          <Button
+            disabled={props.disabled}
+            onClick={handleClick}
+            style={props.styles}>
+            {props.icon?.left && props.icon.jsx ? (
+              <props.icon.jsx
                 {...{
                   width: props.icon.width,
                   height: props.icon.height,
                   stroke: props.icon.stroke,
                 }}
               />
-            )
-          )}
-          {findText(props.text) ?? "Text"}
-          {props.icon?.right && props.icon.jsx ? (
-            <props.icon.jsx
-              {...{
-                width: props.icon.width,
-                height: props.icon.height,
-                stroke: props.icon.stroke,
-              }}
-            />
-          ) : (
-            props.icon?.right && (
-              <TestIcon
+            ) : (
+              props.icon?.left && (
+                <TestIcon
+                  {...{
+                    width: props.icon.width,
+                    height: props.icon.height,
+                    stroke: props.icon.stroke,
+                  }}
+                />
+              )
+            )}
+            {findText(props.text) ?? "Text"}
+            {props.icon?.right && props.icon.jsx ? (
+              <props.icon.jsx
                 {...{
                   width: props.icon.width,
                   height: props.icon.height,
                   stroke: props.icon.stroke,
                 }}
               />
-            )
-          )}
-        </Button>
+            ) : (
+              props.icon?.right && (
+                <TestIcon
+                  {...{
+                    width: props.icon.width,
+                    height: props.icon.height,
+                    stroke: props.icon.stroke,
+                  }}
+                />
+              )
+            )}
+          </Button>
+        )
       );
     case "secondary":
       return (
-        textSchema &&
-        <SecondaryButton
-          disabled={props.disabled}
-          onClick={handleClick}
-          style={props.styles}>
-          {props.icon?.left && props.icon.jsx ? (
-            <props.icon.jsx
-              {...{
-                width: props.icon.width,
-                height: props.icon.height,
-                stroke: props.icon.stroke,
-              }}
-            />
-          ) : (
-            props.icon?.left && (
-              <TestIcon
+        textSchema && (
+          <SecondaryButton
+            disabled={props.disabled}
+            onClick={handleClick}
+            style={props.styles}>
+            {props.icon?.left && props.icon.jsx ? (
+              <props.icon.jsx
                 {...{
                   width: props.icon.width,
                   height: props.icon.height,
                   stroke: props.icon.stroke,
                 }}
               />
-            )
-          )}
-          {findText(props.text) ?? "Text"}
-          {props.icon?.right && props.icon.jsx ? (
-            <props.icon.jsx
-              {...{
-                width: props.icon.width,
-                height: props.icon.height,
-                stroke: props.icon.stroke,
-              }}
-            />
-          ) : (
-            props.icon?.right && (
-              <TestIcon
+            ) : (
+              props.icon?.left && (
+                <TestIcon
+                  {...{
+                    width: props.icon.width,
+                    height: props.icon.height,
+                    stroke: props.icon.stroke,
+                  }}
+                />
+              )
+            )}
+            {findText(props.text) ?? "Text"}
+            {props.icon?.right && props.icon.jsx ? (
+              <props.icon.jsx
                 {...{
                   width: props.icon.width,
                   height: props.icon.height,
                   stroke: props.icon.stroke,
                 }}
               />
-            )
-          )}
-        </SecondaryButton>
+            ) : (
+              props.icon?.right && (
+                <TestIcon
+                  {...{
+                    width: props.icon.width,
+                    height: props.icon.height,
+                    stroke: props.icon.stroke,
+                  }}
+                />
+              )
+            )}
+          </SecondaryButton>
+        )
       );
     case "tertiary":
       return (
@@ -172,51 +174,52 @@ const ButtonComponent = (props) => {
       );
     default:
       return (
-        textSchema &&
-        <Button
-          disabled={props.disabled}
-          onClick={handleClick}
-          style={props.styles}>
-          {props.icon?.left && props.icon.jsx ? (
-            <props.icon.jsx
-              {...{
-                width: props.icon.width,
-                height: props.icon.height,
-                stroke: props.icon.stroke,
-              }}
-            />
-          ) : (
-            props.icon?.left && (
-              <TestIcon
+        textSchema && (
+          <Button
+            disabled={props.disabled}
+            onClick={handleClick}
+            style={props.styles}>
+            {props.icon?.left && props.icon.jsx ? (
+              <props.icon.jsx
                 {...{
                   width: props.icon.width,
                   height: props.icon.height,
                   stroke: props.icon.stroke,
                 }}
               />
-            )
-          )}
-          {findText(props.text) ?? "Text"}
-          {props.icon?.right && props.icon.jsx ? (
-            <props.icon.jsx
-              {...{
-                width: props.icon.width,
-                height: props.icon.height,
-                stroke: props.icon.stroke,
-              }}
-            />
-          ) : (
-            props.icon?.right && (
-              <TestIcon
+            ) : (
+              props.icon?.left && (
+                <TestIcon
+                  {...{
+                    width: props.icon.width,
+                    height: props.icon.height,
+                    stroke: props.icon.stroke,
+                  }}
+                />
+              )
+            )}
+            {findText(props.text) ?? "Text"}
+            {props.icon?.right && props.icon.jsx ? (
+              <props.icon.jsx
                 {...{
                   width: props.icon.width,
                   height: props.icon.height,
                   stroke: props.icon.stroke,
                 }}
               />
-            )
-          )}
-        </Button>
+            ) : (
+              props.icon?.right && (
+                <TestIcon
+                  {...{
+                    width: props.icon.width,
+                    height: props.icon.height,
+                    stroke: props.icon.stroke,
+                  }}
+                />
+              )
+            )}
+          </Button>
+        )
       );
   }
 };

package/src/components/course/courseList/index.jsx

@@ -9,27 +9,30 @@ const CourseList = ({ courses, onCourseSelect }) => {
 
   // const handleCourseSelect = (courseId) => {
   //   setSelectedCourseId(courseId);
-  //   console.log(selectedCourseId);
+  //   //console.log(selectedCourseId);
   //   // onCourseSelect(courseId);
   // };
 
   const handleCourseSelect = (courseId) => {
     if (selectedCourseIds.includes(courseId)) {
-      setSelectedCourseIds((prevSelected) => 
+      setSelectedCourseIds((prevSelected) =>
         prevSelected.filter((id) => id !== courseId)
       );
     } else {
       // Otherwise, add the course ID to the array
       setSelectedCourseIds((prevSelected) => [...prevSelected, courseId]);
     }
-    console.log(selectedCourseIds);
+    //console.log(selectedCourseIds);
     // onCourseSelect(courseId); // Adapt this callback for multiple selections if necessary
   };
 
   return (
     <CourseListWrapper>
       {courses.map((course) => (
-        <div className="card" key={course.id} onClick={() => handleCourseSelect(course.id)}>
+        <div
+          className="card"
+          key={course.id}
+          onClick={() => handleCourseSelect(course.id)}>
           <CourseCard
             course={course}
             isSelected={selectedCourseIds.includes(course.id)}

package/src/components/deactivated/modal/subscription-expired-modal.jsx

@@ -9,7 +9,7 @@ import {
 } from "./index.styled";
 import Modal from "react-modal";
 import ButtonComponent from "../../button";
-import RemoveUser from "./img/removeUser.png"
+import RemoveUser from "./img/removeUser.png";
 import { ErrorBookIcon } from "./img/book";
 import moment from "moment";
 import { toast, ToastContainer } from "react-toastify";
@@ -99,30 +99,27 @@ const SubscriptionExpiredModal = ({
     }
   };
 
-  const expiryDate = moment("2024-05-31",
-    "YYYY-MM-DD"); // Replace with your expiry date
+  const expiryDate = moment("2024-05-31", "YYYY-MM-DD"); // Replace with your expiry date
 
-const isWithin10Days = moment().add(10, 'days').isSameOrBefore(expiryDate);
+  const isWithin10Days = moment().add(10, "days").isSameOrBefore(expiryDate);
 
-if (isWithin10Days) {
-  console.log('Expiry date is within 10 days');
-} else {
-  console.log('Expiry date is more than 10 days away');
-}
-console.log(isWithin10Days)
+  if (isWithin10Days) {
+    //console.log('Expiry date is within 10 days');
+  } else {
+    //console.log('Expiry date is more than 10 days away');
+  }
+  //console.log(isWithin10Days)
 
+  const [daysLeft, setDaysLeft] = useState(null);
 
-const [daysLeft, setDaysLeft] = useState(null);
-
-useEffect(() => {
-  const targetDate = moment(expiryDate);
-  const now = moment();
-  const diff = targetDate.diff(now, 'days');
-
-  setDaysLeft(diff);
-}, [expiryDate]);
-console.log(daysLeft)
+  useEffect(() => {
+    const targetDate = moment(expiryDate);
+    const now = moment();
+    const diff = targetDate.diff(now, "days");
 
+    setDaysLeft(diff);
+  }, [expiryDate]);
+  //console.log(daysLeft)
 
   return (
     <Modal
@@ -132,8 +129,7 @@ console.log(daysLeft)
       closeTimeoutMS={1000}
       ariaHideApp={false}
       contentLabel="Selected Option"
-      shouldCloseOnOverlayClick={false}
-    >
+      shouldCloseOnOverlayClick={false}>
       <ModalCardContainer>
         {/* <CloseModalButton
           onClick={() => {

package/src/components/deactivated/useAccount.js

@@ -1,7 +1,6 @@
 import useAxios from "axios-hooks";
 
 const useAccount = () => {
-
   // current plan
   const [{ ...userPlanData }, getUserPlan] = useAxios(
     {
@@ -18,22 +17,13 @@ const useAccount = () => {
     try {
       await getUserPlan();
     } catch (err) {
-      console.log(err);
+      //console.log(err);
     }
   };
 
-
-
-  
-
-
-
   return {
-
     userPlanData,
     handleGetUserPlan,
-  
-   
   };
 };
 export default useAccount;