l-min-components 1.0.1087 → 1.0.1088

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/package.json +1 -1
  2. package/src/assets/raw_svg/community.svg +5 -0
  3. package/src/assets/raw_svg/notification.svg +6 -0
  4. package/src/assets/raw_svg/settings_future.svg +3 -0
  5. package/src/assets/svg/setting.jsx +5 -5
  6. package/src/components/AppMainLayout/index.jsx +9 -0
  7. package/src/components/header/assets/svg/book.jsx +2 -1
  8. package/src/components/header/assets/svg/notification.jsx +29 -27
  9. package/src/components/header/assets/svg/setting.jsx +7 -6
  10. package/src/components/header/index.jsx +19 -11
  11. package/src/components/sideBar/sideMenu/index.jsx +3 -0
  12. package/src/components/sideNav/styles/index.jsx +2 -2
  13. package/src/components/sideNav/svg/commIcon.jsx +6 -6
  14. package/src/components/sideNav/svg/dictionaryIcon.jsx +8 -8
  15. package/src/components/sideNav/svg/duetIcon.jsx +7 -7
  16. package/src/components/sideNav/svg/fun.jsx +11 -11
  17. package/src/components/sideNav/svg/speechIcon.jsx +4 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "l-min-components",
3
- "version": "1.0.1087",
3
+ "version": "1.0.1088",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "src/assets",
package/src/assets/raw_svg/community.svg ADDED
@@ -0,0 +1,5 @@
1
+ <svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M9 19.5H8.5C4.5 19.5 2.5 18.5 2.5 13.5V8.5C2.5 4.5 4.5 2.5 8.5 2.5H16.5C20.5 2.5 22.5 4.5 22.5 8.5V13.5C22.5 17.5 20.5 19.5 16.5 19.5H16C15.69 19.5 15.39 19.65 15.2 19.9L13.7 21.9C13.04 22.78 11.96 22.78 11.3 21.9L9.8 19.9C9.64 19.68 9.27 19.5 9 19.5Z" stroke="#ADB3B3" stroke-width="1.0856" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
3
+ <path d="M7.5 8.5H17.5" stroke="#ADB3B3" stroke-width="1.0856" stroke-linecap="round" stroke-linejoin="round"/>
4
+ <path d="M7.5 13.5H13.5" stroke="#ADB3B3" stroke-width="1.0856" stroke-linecap="round" stroke-linejoin="round"/>
5
+ </svg>
package/src/assets/raw_svg/notification.svg ADDED
@@ -0,0 +1,6 @@
1
+ <svg width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M10.7328 3.59375C7.78222 3.59375 5.38433 5.99163 5.38433 8.94218V11.5183C5.38433 12.0621 5.15257 12.8911 4.87623 13.3546L3.85112 15.0572C3.21822 16.1091 3.65501 17.2768 4.81383 17.669C8.65579 18.9527 12.8008 18.9527 16.6428 17.669C17.7214 17.3125 18.1938 16.0378 17.6055 15.0572L16.5804 13.3546C16.313 12.8911 16.0812 12.0621 16.0812 11.5183V8.94218C16.0812 6.00055 13.6744 3.59375 10.7328 3.59375Z" stroke="#4A4D4D" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"/>
3
+ <path d="M12.3822 3.85169C12.1058 3.77146 11.8206 3.70906 11.5264 3.67341C10.6707 3.56644 9.85059 3.62884 9.08398 3.85169C9.34249 3.19205 9.9843 2.72852 10.7331 2.72852C11.4819 2.72852 12.1237 3.19205 12.3822 3.85169Z" stroke="#4A4D4D" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
4
+ <path d="M13.407 17.9902C13.407 19.4611 12.2036 20.6645 10.7328 20.6645C10.0019 20.6645 9.32439 20.3614 8.84303 19.88C8.36167 19.3987 8.05859 18.7212 8.05859 17.9902" stroke="#4A4D4D" stroke-width="1.5" stroke-miterlimit="10"/>
5
+ <circle cx="17.0186" cy="5" r="4.5" fill="#F39B33" stroke="white"/>
6
+ </svg>
package/src/assets/raw_svg/settings_future.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="23" height="22" viewBox="0 0 23 22" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M11.3219 20.5016L2.85352 15.5988V5.79336L11.3219 0.890625L19.7902 5.79336V15.5988L11.3219 20.5016ZM11.3219 2.95156L4.63633 6.82115V14.571L11.3219 18.4415L18.0074 14.571V6.82115L11.3219 2.95066V2.95156ZM11.3219 14.2617C10.3765 14.259 9.47037 13.8836 8.80008 13.217C7.78053 12.1971 7.47568 10.6635 8.02766 9.33127C8.57965 7.99901 9.87979 7.13047 11.3219 7.13047C12.267 7.133 13.1729 7.50844 13.8428 8.17519C15.2347 9.56757 15.2347 11.8246 13.8428 13.217C13.1728 13.8835 12.2669 14.2589 11.3219 14.2617ZM11.3219 8.91327C10.4713 8.9131 9.7391 9.51377 9.573 10.3479C9.40691 11.1821 9.8532 12.0174 10.6389 12.3431C11.4247 12.6687 12.331 12.3939 12.8037 11.6868C13.2763 10.9797 13.1837 10.0372 12.5823 9.43564C12.2487 9.10027 11.7949 8.9122 11.3219 8.91327Z" fill="#4A4D4D"/>
3
+ </svg>
package/src/assets/svg/setting.jsx CHANGED
@@ -1,15 +1,15 @@
1
1
  import React from "react";
2
2
  export const SettingIcon = ({ width, height, fill }) => (
3
3
  <svg
4
- width={width || "17"}
5
- height={width || "21"}
6
- viewBox="0 0 17 21"
4
+ width={width || "23"}
5
+ height={height || "22"}
6
+ viewBox="0 0 23 22"
7
7
  fill="none"
8
8
  xmlns="http://www.w3.org/2000/svg"
9
9
  >
10
10
  <path
11
- d="M8.48398 20.5025L0.015625 15.5998V5.79433L8.48398 0.891602L16.9523 5.79433V15.5998L8.48398 20.5025ZM8.48398 2.95253L1.79844 6.82212V14.572L8.48398 18.4425L15.1695 14.572V6.82212L8.48398 2.95164V2.95253ZM8.48398 14.2627C7.53863 14.26 6.63248 13.8846 5.96219 13.218C4.94264 12.1981 4.63778 10.6645 5.18977 9.33225C5.74176 7.99999 7.04189 7.13144 8.48398 7.13144C9.4291 7.13398 10.335 7.50942 11.0049 8.17617C12.3968 9.56855 12.3968 11.8256 11.0049 13.218C10.3349 13.8845 9.42904 14.2599 8.48398 14.2627ZM8.48398 8.91425C7.63344 8.91407 6.90121 9.51474 6.73511 10.3489C6.56901 11.1831 7.01531 12.0184 7.80105 12.344C8.58679 12.6697 9.49313 12.3949 9.96579 11.6878C10.4384 10.9807 10.3458 10.0381 9.74443 9.43662C9.41083 9.10125 8.95701 8.91317 8.48398 8.91425Z"
12
- fill="#4A4D4D"
11
+ d="M11.3219 20.5016L2.85352 15.5988V5.79336L11.3219 0.890625L19.7902 5.79336V15.5988L11.3219 20.5016ZM11.3219 2.95156L4.63633 6.82115V14.571L11.3219 18.4415L18.0074 14.571V6.82115L11.3219 2.95066V2.95156ZM11.3219 14.2617C10.3765 14.259 9.47037 13.8836 8.80008 13.217C7.78053 12.1971 7.47568 10.6635 8.02766 9.33127C8.57965 7.99901 9.87979 7.13047 11.3219 7.13047C12.267 7.133 13.1729 7.50844 13.8428 8.17519C15.2347 9.56757 15.2347 11.8246 13.8428 13.217C13.1728 13.8835 12.2669 14.2589 11.3219 14.2617ZM11.3219 8.91327C10.4713 8.9131 9.7391 9.51377 9.573 10.3479C9.40691 11.1821 9.8532 12.0174 10.6389 12.3431C11.4247 12.6687 12.331 12.3939 12.8037 11.6868C13.2763 10.9797 13.1837 10.0372 12.5823 9.43564C12.2487 9.10027 11.7949 8.9122 11.3219 8.91327Z"
12
+ fill={fill || "#4A4D4D"}
13
13
  />
14
14
  </svg>
15
15
  );
package/src/components/AppMainLayout/index.jsx CHANGED
@@ -59,6 +59,15 @@ const AppMainLayout = () => {
59
59
  return () => window.removeEventListener("resize", handleResize);
60
60
  }, []);
61
61
 
62
+ // on page load check local storage for state of isOpen and set that to the state that controls the opening and closing of the navbar
63
+
64
+ useEffect(() => {
65
+ window.localStorage.getItem("isOpen") &&
66
+ setIsOpen(
67
+ window.localStorage.getItem("isOpen") === "true" ? true : false
68
+ );
69
+ }, []);
70
+
62
71
  const {
63
72
  setDefaultAccount,
64
73
  handleSetDefaultAccount,
package/src/components/header/assets/svg/book.jsx CHANGED
@@ -5,7 +5,8 @@ export const BookIcon = ({ width, height, fill }) => (
5
5
  height={height || "24"}
6
6
  viewBox="0 0 23 24"
7
7
  fill="none"
8
- xmlns="http://www.w3.org/2000/svg">
8
+ xmlns="http://www.w3.org/2000/svg"
9
+ >
9
10
  <path
10
11
  d="M21.0807 16.1404V4.57336C21.0807 3.42336 20.1416 2.57044 19.0011 2.66627H18.9436C16.9311 2.83877 13.8741 3.86419 12.1682 4.93752L12.0053 5.04294C11.7274 5.21544 11.2674 5.21544 10.9895 5.04294L10.7499 4.89919C9.04406 3.83544 5.99656 2.81961 3.98406 2.65669C2.84365 2.56086 1.91406 3.42336 1.91406 4.56377V16.1404C1.91406 17.0604 2.66156 17.9229 3.58156 18.0379L3.85948 18.0763C5.93906 18.3542 9.14948 19.4084 10.9895 20.4146L11.0278 20.4338C11.2866 20.5775 11.6986 20.5775 11.9478 20.4338C13.7878 19.4179 17.0078 18.3542 19.097 18.0763L19.4132 18.0379C20.3332 17.9229 21.0807 17.0604 21.0807 16.1404Z"
11
12
  stroke="#00C2C2"
package/src/components/header/assets/svg/notification.jsx CHANGED
@@ -5,29 +5,30 @@ export const NotificationIcon = ({ width, height, fill }) => (
5
5
  height={height || "23"}
6
6
  viewBox="0 0 23 23"
7
7
  fill="none"
8
- xmlns="http://www.w3.org/2000/svg">
8
+ xmlns="http://www.w3.org/2000/svg"
9
+ >
9
10
  <path
10
- d="M10.891 3.59375C7.94042 3.59375 5.54254 5.99163 5.54254 8.94218V11.5183C5.54254 12.0621 5.31077 12.8911 5.03444 13.3546L4.00932 15.0572C3.37642 16.1091 3.81321 17.2768 4.97204 17.669C8.814 18.9527 12.959 18.9527 16.801 17.669C17.8796 17.3125 18.352 16.0378 17.7637 15.0572L16.7386 13.3546C16.4712 12.8911 16.2394 12.0621 16.2394 11.5183V8.94218C16.2394 6.00055 13.8326 3.59375 10.891 3.59375Z"
11
+ d="M10.7328 3.59375C7.78222 3.59375 5.38433 5.99163 5.38433 8.94218V11.5183C5.38433 12.0621 5.15257 12.8911 4.87623 13.3546L3.85112 15.0572C3.21822 16.1091 3.65501 17.2768 4.81383 17.669C8.65579 18.9527 12.8008 18.9527 16.6428 17.669C17.7214 17.3125 18.1938 16.0378 17.6055 15.0572L16.5804 13.3546C16.313 12.8911 16.0812 12.0621 16.0812 11.5183V8.94218C16.0812 6.00055 13.6744 3.59375 10.7328 3.59375Z"
11
12
  stroke="#4A4D4D"
12
- strokeWidth="1.5"
13
- strokeMiterlimit="10"
14
- strokeLinecap="round"
13
+ stroke-width="1.5"
14
+ stroke-miterlimit="10"
15
+ stroke-linecap="round"
15
16
  />
16
17
  <path
17
- d="M12.5404 3.85266C12.2641 3.77244 11.9788 3.71004 11.6846 3.67438C10.8289 3.56741 10.0088 3.62981 9.24219 3.85266C9.5007 3.19302 10.1425 2.72949 10.8913 2.72949C11.6401 2.72949 12.2819 3.19302 12.5404 3.85266Z"
18
+ d="M12.3822 3.85169C12.1058 3.77146 11.8206 3.70906 11.5264 3.67341C10.6707 3.56644 9.85059 3.62884 9.08398 3.85169C9.34249 3.19205 9.9843 2.72852 10.7331 2.72852C11.4819 2.72852 12.1237 3.19205 12.3822 3.85169Z"
18
19
  stroke="#4A4D4D"
19
- strokeWidth="1.5"
20
- strokeMiterlimit="10"
21
- strokeLinecap="round"
22
- strokeLinejoin="round"
20
+ stroke-width="1.5"
21
+ stroke-miterlimit="10"
22
+ stroke-linecap="round"
23
+ stroke-linejoin="round"
23
24
  />
24
25
  <path
25
- d="M13.5672 17.9902C13.5672 19.4611 12.3638 20.6645 10.893 20.6645C10.162 20.6645 9.48455 20.3614 9.00319 19.88C8.52183 19.3987 8.21875 18.7212 8.21875 17.9902"
26
+ d="M13.407 17.9902C13.407 19.4611 12.2036 20.6645 10.7328 20.6645C10.0019 20.6645 9.32439 20.3614 8.84303 19.88C8.36167 19.3987 8.05859 18.7212 8.05859 17.9902"
26
27
  stroke="#4A4D4D"
27
- strokeWidth="1.5"
28
- strokeMiterlimit="10"
28
+ stroke-width="1.5"
29
+ stroke-miterlimit="10"
29
30
  />
30
- <circle cx="17.1797" cy="5" r="4.5" fill="#F39B33" stroke="white" />
31
+ <circle cx="17.0186" cy="5" r="4.5" fill="#F39B33" stroke="white" />
31
32
  </svg>
32
33
  );
33
34
  export const NotificationEmptyIcon = ({ width, height, fill }) => (
@@ -36,27 +37,28 @@ export const NotificationEmptyIcon = ({ width, height, fill }) => (
36
37
  height={height || "23"}
37
38
  viewBox="0 0 23 23"
38
39
  fill="none"
39
- xmlns="http://www.w3.org/2000/svg">
40
+ xmlns="http://www.w3.org/2000/svg"
41
+ >
40
42
  <path
41
- d="M10.891 3.59375C7.94042 3.59375 5.54254 5.99163 5.54254 8.94218V11.5183C5.54254 12.0621 5.31077 12.8911 5.03444 13.3546L4.00932 15.0572C3.37642 16.1091 3.81321 17.2768 4.97204 17.669C8.814 18.9527 12.959 18.9527 16.801 17.669C17.8796 17.3125 18.352 16.0378 17.7637 15.0572L16.7386 13.3546C16.4712 12.8911 16.2394 12.0621 16.2394 11.5183V8.94218C16.2394 6.00055 13.8326 3.59375 10.891 3.59375Z"
43
+ d="M10.7328 3.59375C7.78222 3.59375 5.38433 5.99163 5.38433 8.94218V11.5183C5.38433 12.0621 5.15257 12.8911 4.87623 13.3546L3.85112 15.0572C3.21822 16.1091 3.65501 17.2768 4.81383 17.669C8.65579 18.9527 12.8008 18.9527 16.6428 17.669C17.7214 17.3125 18.1938 16.0378 17.6055 15.0572L16.5804 13.3546C16.313 12.8911 16.0812 12.0621 16.0812 11.5183V8.94218C16.0812 6.00055 13.6744 3.59375 10.7328 3.59375Z"
42
44
  stroke="#4A4D4D"
43
- strokeWidth="1.5"
44
- strokeMiterlimit="10"
45
- strokeLinecap="round"
45
+ stroke-width="1.5"
46
+ stroke-miterlimit="10"
47
+ stroke-linecap="round"
46
48
  />
47
49
  <path
48
- d="M12.5404 3.85266C12.2641 3.77244 11.9788 3.71004 11.6846 3.67438C10.8289 3.56741 10.0088 3.62981 9.24219 3.85266C9.5007 3.19302 10.1425 2.72949 10.8913 2.72949C11.6401 2.72949 12.2819 3.19302 12.5404 3.85266Z"
50
+ d="M12.3822 3.85169C12.1058 3.77146 11.8206 3.70906 11.5264 3.67341C10.6707 3.56644 9.85059 3.62884 9.08398 3.85169C9.34249 3.19205 9.9843 2.72852 10.7331 2.72852C11.4819 2.72852 12.1237 3.19205 12.3822 3.85169Z"
49
51
  stroke="#4A4D4D"
50
- strokeWidth="1.5"
51
- strokeMiterlimit="10"
52
- strokeLinecap="round"
53
- strokeLinejoin="round"
52
+ stroke-width="1.5"
53
+ stroke-miterlimit="10"
54
+ stroke-linecap="round"
55
+ stroke-linejoin="round"
54
56
  />
55
57
  <path
56
- d="M13.5672 17.9902C13.5672 19.4611 12.3638 20.6645 10.893 20.6645C10.162 20.6645 9.48455 20.3614 9.00319 19.88C8.52183 19.3987 8.21875 18.7212 8.21875 17.9902"
58
+ d="M13.407 17.9902C13.407 19.4611 12.2036 20.6645 10.7328 20.6645C10.0019 20.6645 9.32439 20.3614 8.84303 19.88C8.36167 19.3987 8.05859 18.7212 8.05859 17.9902"
57
59
  stroke="#4A4D4D"
58
- strokeWidth="1.5"
59
- strokeMiterlimit="10"
60
+ stroke-width="1.5"
61
+ stroke-miterlimit="10"
60
62
  />
61
63
  </svg>
62
64
  );
package/src/components/header/assets/svg/setting.jsx CHANGED
@@ -1,14 +1,15 @@
1
1
  import React from "react";
2
2
  export const SettingIcon = ({ width, height, fill }) => (
3
3
  <svg
4
- width={width || "17"}
5
- height={width || "21"}
6
- viewBox="0 0 17 21"
4
+ width={width || "23"}
5
+ height={height || "22"}
6
+ viewBox="0 0 23 22"
7
7
  fill="none"
8
- xmlns="http://www.w3.org/2000/svg">
8
+ xmlns="http://www.w3.org/2000/svg"
9
+ >
9
10
  <path
10
- d="M8.48398 20.5025L0.015625 15.5998V5.79433L8.48398 0.891602L16.9523 5.79433V15.5998L8.48398 20.5025ZM8.48398 2.95253L1.79844 6.82212V14.572L8.48398 18.4425L15.1695 14.572V6.82212L8.48398 2.95164V2.95253ZM8.48398 14.2627C7.53863 14.26 6.63248 13.8846 5.96219 13.218C4.94264 12.1981 4.63778 10.6645 5.18977 9.33225C5.74176 7.99999 7.04189 7.13144 8.48398 7.13144C9.4291 7.13398 10.335 7.50942 11.0049 8.17617C12.3968 9.56855 12.3968 11.8256 11.0049 13.218C10.3349 13.8845 9.42904 14.2599 8.48398 14.2627ZM8.48398 8.91425C7.63344 8.91407 6.90121 9.51474 6.73511 10.3489C6.56901 11.1831 7.01531 12.0184 7.80105 12.344C8.58679 12.6697 9.49313 12.3949 9.96579 11.6878C10.4384 10.9807 10.3458 10.0381 9.74443 9.43662C9.41083 9.10125 8.95701 8.91317 8.48398 8.91425Z"
11
- fill="#4A4D4D"
11
+ d="M11.3219 20.5016L2.85352 15.5988V5.79336L11.3219 0.890625L19.7902 5.79336V15.5988L11.3219 20.5016ZM11.3219 2.95156L4.63633 6.82115V14.571L11.3219 18.4415L18.0074 14.571V6.82115L11.3219 2.95066V2.95156ZM11.3219 14.2617C10.3765 14.259 9.47037 13.8836 8.80008 13.217C7.78053 12.1971 7.47568 10.6635 8.02766 9.33127C8.57965 7.99901 9.87979 7.13047 11.3219 7.13047C12.267 7.133 13.1729 7.50844 13.8428 8.17519C15.2347 9.56757 15.2347 11.8246 13.8428 13.217C13.1728 13.8835 12.2669 14.2589 11.3219 14.2617ZM11.3219 8.91327C10.4713 8.9131 9.7391 9.51377 9.573 10.3479C9.40691 11.1821 9.8532 12.0174 10.6389 12.3431C11.4247 12.6687 12.331 12.3939 12.8037 11.6868C13.2763 10.9797 13.1837 10.0372 12.5823 9.43564C12.2487 9.10027 11.7949 8.9122 11.3219 8.91327Z"
12
+ fill={fill || "#4A4D4D"}
12
13
  />
13
14
  </svg>
14
15
  );
package/src/components/header/index.jsx CHANGED
@@ -28,6 +28,12 @@ import { getCookie } from "./getCookies";
28
28
  // import { data } from "../GraphMap/data";
29
29
  import { languagesData, selectedLanguageData } from "./languages";
30
30
  import { QuestionMark } from "./assets/svg/questionMark";
31
+ import Learn from "../../assets/svg/learning";
32
+ import CommunityIcon from "../sideNav/svg/commIcon";
33
+ import DuetIcon from "../sideNav/svg/duetIcon";
34
+ import SpeechIcon from "../sideNav/svg/speechIcon";
35
+ import DictionaryIcon from "../sideNav/svg/dictionaryIcon";
36
+ import FunIcon from "../sideNav/svg/fun";
31
37
 
32
38
  /**
33
39
  * @param {{
@@ -305,6 +311,17 @@ const HeaderComponent = (props) => {
305
311
  if (path.includes("dictionary")) return "Dictionary";
306
312
  return props.findText("Learning");
307
313
  };
314
+ const getNavLinkIcon = () => {
315
+ const path = window.location.pathname;
316
+ if (path.includes("fun")) return <FunIcon width={23} height={23} />;
317
+ if (path.includes("community"))
318
+ return <CommunityIcon width={23} height={23} />;
319
+ if (path.includes("explore")) return <DuetIcon width={23} height={23} />;
320
+ if (path.includes("connect")) return <SpeechIcon width={23} height={23} />;
321
+ if (path.includes("dictionary"))
322
+ return <DictionaryIcon width={23} height={23} />;
323
+ return <BookIcon width={23} height={23} />;
324
+ };
308
325
 
309
326
  // websocket for notifications initialization
310
327
  const [socketUrl, setSocketUrl] = useState(
@@ -427,19 +444,10 @@ const HeaderComponent = (props) => {
427
444
  >
428
445
  <li>
429
446
  <a className={isHomePage() ? "active" : ""}>
430
- <BookIcon /> {getNavLinkLabel()}
431
- </a>
432
- </li>
433
- {/* <li>
434
- <a href="#">
435
- <PeopleIcon /> Friends
447
+ {getNavLinkIcon()} {getNavLinkLabel()}
436
448
  </a>
437
449
  </li>
438
- <li>
439
- <a href="#">
440
- <MessageIcon /> Messages
441
- </a>
442
- </li> */}
450
+
443
451
  <li>
444
452
  <a
445
453
  onClick={() => {
package/src/components/sideBar/sideMenu/index.jsx CHANGED
@@ -35,6 +35,7 @@ const SideMenu = ({
35
35
  const { setGeneralData, generalData } = useContext(OutletContext);
36
36
  const onToggle = () => {
37
37
  setIsOpen(!isOpen);
38
+ window.localStorage.setItem("isOpen", !isOpen);
38
39
  };
39
40
 
40
41
  useEffect(() => {
@@ -63,9 +64,11 @@ const SideMenu = ({
63
64
  }, [userType]);
64
65
 
65
66
  const [routeFilter, setRouteFilter] = useState();
67
+
66
68
  useEffect(() => {
67
69
  setRouteFilter(filteredRoutes);
68
70
  }, []);
71
+
69
72
  // filter route to remove contract
70
73
  const affiliatesFilteredRoute = filteredRoutes?.filter(
71
74
  (route) => !route.affiliates
package/src/components/sideNav/styles/index.jsx CHANGED
@@ -5,7 +5,7 @@ export const NavWrapper = styled.nav`
5
5
  background-color: #ffffff;
6
6
  width: 61px;
7
7
  position: fixed;
8
- height: 625px;
8
+ height: 625px;
9
9
  /* top: 10%; */
10
10
  left: 0;
11
11
  overflow-x: hidden;
@@ -29,7 +29,7 @@ export const NavItem = styled.div`
29
29
  text-align: center;
30
30
  `;
31
31
 
32
- export const NavLinkStyled = styled(NavLink)`
32
+ export const NavLinkStyled = styled.a`
33
33
  color: rgba(95, 95, 95, 0.479);
34
34
  text-decoration: none;
35
35
  display: flex;
package/src/components/sideNav/svg/commIcon.jsx CHANGED
@@ -1,15 +1,15 @@
1
- const CommunityIcon = () => {
1
+ const CommunityIcon = ({}) => {
2
2
  return (
3
3
  <svg
4
- width="21"
5
- height="21"
4
+ width={width || "21"}
5
+ height={height || "21"}
6
6
  viewBox="0 0 21 21"
7
7
  fill="none"
8
8
  xmlns="http://www.w3.org/2000/svg"
9
9
  >
10
10
  <path
11
11
  d="M7.58073 16.3327H7.16406C3.83073 16.3327 2.16406 15.4993 2.16406 11.3327V7.16602C2.16406 3.83268 3.83073 2.16602 7.16406 2.16602H13.8307C17.1641 2.16602 18.8307 3.83268 18.8307 7.16602V11.3327C18.8307 14.666 17.1641 16.3327 13.8307 16.3327H13.4141C13.1557 16.3327 12.9057 16.4577 12.7474 16.666L11.4974 18.3327C10.9474 19.066 10.0474 19.066 9.4974 18.3327L8.2474 16.666C8.11406 16.4827 7.80573 16.3327 7.58073 16.3327Z"
12
- stroke="#ADB3B3"
12
+ stroke={stroke || "#ADB3B3"}
13
13
  stroke-width="1.0856"
14
14
  stroke-miterlimit="10"
15
15
  stroke-linecap="round"
@@ -17,14 +17,14 @@ const CommunityIcon = () => {
17
17
  />
18
18
  <path
19
19
  d="M6.33594 7.16602H14.6693"
20
- stroke="#ADB3B3"
20
+ stroke={stroke || "#ADB3B3"}
21
21
  stroke-width="1.0856"
22
22
  stroke-linecap="round"
23
23
  stroke-linejoin="round"
24
24
  />
25
25
  <path
26
26
  d="M6.33594 11.334H11.3359"
27
- stroke="#ADB3B3"
27
+ stroke={stroke || "#ADB3B3"}
28
28
  stroke-width="1.0856"
29
29
  stroke-linecap="round"
30
30
  stroke-linejoin="round"
package/src/components/sideNav/svg/dictionaryIcon.jsx CHANGED
@@ -1,31 +1,31 @@
1
- const DictionaryIcon = () => {
1
+ const DictionaryIcon = ({ width, height, fill }) => {
2
2
  return (
3
3
  <svg
4
- width="14"
5
- height="19"
4
+ width={width || "14"}
5
+ height={height || "19"}
6
6
  viewBox="0 0 14 19"
7
7
  fill="none"
8
8
  xmlns="http://www.w3.org/2000/svg"
9
9
  >
10
10
  <path
11
11
  d="M2.17966 0.431108C1.59313 0.502443 1.1572 0.716446 0.733159 1.14445C0.400265 1.47338 0.186262 1.83402 0.0713344 2.25806C0.00396302 2.49584 0 2.94763 0 9.50643C0 16.0652 0.00396302 16.517 0.0713344 16.7548C0.305153 17.5989 0.990755 18.2885 1.8428 18.5302C2.08851 18.5976 2.39763 18.6016 8.04493 18.6016H13.9895V11.9041C13.9895 8.21845 13.9776 5.15899 13.9617 5.09955C13.9221 4.96084 13.7517 4.76269 13.5971 4.67947C13.4822 4.61606 13.0582 4.6121 7.72789 4.59228L1.98151 4.57247L1.7041 4.43772C1.00661 4.0969 0.594453 3.32411 0.72127 2.58699C0.844123 1.86572 1.4148 1.2792 2.12022 1.14445C2.25496 1.12067 4.41084 1.10482 8.16382 1.10482H14.0014L13.9696 0.958191C13.9102 0.69663 13.7002 0.490555 13.4307 0.431108C13.2484 0.387516 2.53237 0.387516 2.17966 0.431108ZM1.30383 5.01632C1.4148 5.07181 1.60106 5.15503 1.72391 5.20259C1.94188 5.28581 1.94584 5.28581 7.62089 5.2977L13.2959 5.30562V11.6068V17.908H7.81111C4.29591 17.908 2.25496 17.8922 2.12022 17.8684C1.64465 17.7773 1.14531 17.4166 0.919421 17.0045C0.68164 16.5685 0.693529 16.8856 0.693529 10.4694V4.59228L0.899606 4.75477C1.01057 4.84195 1.19287 4.96084 1.30383 5.01632Z"
12
- fill="#ADB3B3"
12
+ fill={fill || "#ADB3B3"}
13
13
  />
14
14
  <path
15
15
  d="M4.36646 7.4497C4.33079 7.46952 4.27531 7.53689 4.2436 7.59633C4.12471 7.82619 2.98733 10.7509 2.91203 11.0204C2.85655 11.2066 2.82088 11.492 2.80503 11.817L2.78125 12.3242L3.13396 12.3123L3.48667 12.3004L3.51045 11.8209C3.52233 11.5594 3.54611 11.3255 3.56197 11.2978C3.60556 11.2265 6.237 11.2304 6.24493 11.2978C6.24889 11.3255 6.26078 11.5633 6.27663 11.8249L6.30041 12.3004L6.65312 12.3123L7.00583 12.3242L6.98205 11.817C6.97016 11.5078 6.93053 11.1987 6.88298 11.0323C6.74427 10.5171 5.56725 7.59237 5.46025 7.4933C5.37307 7.41404 5.32551 7.40611 4.90147 7.40611C4.64783 7.40611 4.40609 7.42592 4.36646 7.4497ZM5.49196 9.32817C5.74955 9.97811 5.95167 10.521 5.94374 10.5329C5.92393 10.5488 3.85523 10.5448 3.83938 10.525C3.83145 10.5171 4.0296 10.0059 4.27531 9.38762C4.52102 8.76543 4.73502 8.22645 4.74691 8.18682C4.76672 8.13531 4.80635 8.11945 4.8975 8.12738C5.02036 8.13927 5.02432 8.14323 5.49196 9.32817Z"
16
- fill="#ADB3B3"
16
+ fill={fill || "#ADB3B3"}
17
17
  />
18
18
  <path
19
19
  d="M7.71094 11.2492V11.6058H9.38333H11.0597L9.42693 13.2386C8.52732 14.1382 7.77435 14.9268 7.75057 14.9863C7.73075 15.0497 7.71094 15.2597 7.71094 15.4539V15.8066H9.81134H11.9157L11.9038 15.4579L11.8919 15.1131L10.2275 15.1012L8.56695 15.0933L10.1958 13.4566C11.8206 11.8278 11.8246 11.8238 11.8721 11.6058C11.8959 11.4869 11.9117 11.2809 11.9038 11.1501L11.8919 10.9123L9.80341 10.9004L7.71094 10.8925V11.2492Z"
20
- fill="#ADB3B3"
20
+ fill={fill || "#ADB3B3"}
21
21
  />
22
22
  <path
23
23
  d="M2.0392 1.9017C1.84105 1.99285 1.62308 2.17911 1.53986 2.34159C1.50815 2.40104 1.48438 2.45652 1.48438 2.47237C1.48438 2.48426 4.1396 2.49219 7.38928 2.49219H13.2942V2.15533V1.81847H7.75784C2.27302 1.81847 2.21753 1.82244 2.0392 1.9017Z"
24
- fill="#ADB3B3"
24
+ fill={fill || "#ADB3B3"}
25
25
  />
26
26
  <path
27
27
  d="M1.48438 3.26011C1.48438 3.37503 1.7499 3.66434 1.95994 3.77926L2.1779 3.89815L7.73802 3.91004L13.2942 3.91797V3.5613V3.20463H7.38928C2.30868 3.20463 1.48438 3.21255 1.48438 3.26011Z"
28
- fill="#ADB3B3"
28
+ fill={fill || "#ADB3B3"}
29
29
  />
30
30
  </svg>
31
31
  );
package/src/components/sideNav/svg/duetIcon.jsx CHANGED
@@ -1,27 +1,27 @@
1
- const DuetIcon = () => {
1
+ const DuetIcon = ({ width, height, fill }) => {
2
2
  return (
3
3
  <svg
4
- width="21"
5
- height="20"
4
+ width={width || "21"}
5
+ height={height || "20"}
6
6
  viewBox="0 0 21 20"
7
7
  fill="none"
8
8
  xmlns="http://www.w3.org/2000/svg"
9
9
  >
10
10
  <path
11
11
  d="M18.0026 8.33398C15.2938 8.49109 12.6887 9.4301 10.5026 11.0373C8.31652 9.4301 5.71138 8.49109 3.00261 8.33398V10.8007C2.55984 10.8015 2.13554 10.9782 1.82301 11.2918C1.51047 11.6055 1.33528 12.0304 1.33594 12.4732V13.3098C1.33594 14.234 3.00261 15.1498 3.00261 15.1498V16.8223C5.21594 16.9647 7.35049 17.6985 9.18344 18.9473C9.64626 19.2685 10.087 19.6204 10.5026 20.0007C10.9182 19.6204 11.359 19.2685 11.8218 18.9473C13.6547 17.6985 15.7893 16.9647 18.0026 16.8223V14.9823C18.4454 14.9814 18.8697 14.8048 19.1822 14.4911C19.4947 14.1775 19.6699 13.7526 19.6693 13.3098V12.4732C19.6699 12.0304 19.4947 11.6055 19.1822 11.2918C18.8697 10.9782 18.4454 10.8015 18.0026 10.8007V8.33398ZM10.5026 17.8523C8.77426 16.5857 6.77882 15.7316 4.66927 15.3557V10.2307C6.28601 10.5563 7.821 11.203 9.18344 12.1323C9.64626 12.4535 10.087 12.8054 10.5026 13.1857C10.9182 12.8054 11.359 12.4535 11.8218 12.1323C13.1841 11.2027 14.7191 10.5558 16.3359 10.2298V15.3557C14.2264 15.7316 12.231 16.5857 10.5026 17.8523ZM9.66927 6.66732H11.3359V7.50065H9.66927V6.66732ZM9.66927 3.33398H11.3359V4.16732H9.66927V3.33398Z"
12
- fill="#ADB2B2"
12
+ fill={fill || "#ADB2B2"}
13
13
  />
14
14
  <path
15
15
  d="M9.66355 8.33283H11.3302V9.16617H9.66355V8.33283ZM7.99689 4.16617C8.2179 4.16617 8.42986 4.07837 8.58614 3.92209C8.74242 3.76581 8.83022 3.55385 8.83022 3.33283C8.83099 3.22428 8.81019 3.11665 8.769 3.0162C8.72781 2.91576 8.66707 2.8245 8.59031 2.74774C8.51355 2.67098 8.42229 2.61024 8.32185 2.56905C8.2214 2.52787 8.11378 2.50706 8.00522 2.50783C7.89633 2.50729 7.7884 2.52819 7.68759 2.56936C7.58678 2.61052 7.49507 2.67114 7.41769 2.74774C7.26141 2.90246 7.17299 3.11292 7.17189 3.33283C7.17078 3.55274 7.25708 3.76408 7.4118 3.92036C7.56651 4.07664 7.77698 4.16506 7.99689 4.16617Z"
16
- fill="#ADB2B2"
16
+ fill={fill || "#ADB2B2"}
17
17
  />
18
18
  <path
19
19
  d="M12.9974 4.16667C13.4576 4.16667 13.8307 3.79357 13.8307 3.33333C13.8307 2.8731 13.4576 2.5 12.9974 2.5C12.5372 2.5 12.1641 2.8731 12.1641 3.33333C12.1641 3.79357 12.5372 4.16667 12.9974 4.16667Z"
20
- fill="#ADB2B2"
20
+ fill={fill || "#ADB2B2"}
21
21
  />
22
22
  <path
23
23
  d="M13.8307 6.66667H7.16406C6.50122 6.666 5.86572 6.4024 5.39703 5.9337C4.92833 5.465 4.66472 4.8295 4.66406 4.16667V2.5C4.66472 1.83716 4.92833 1.20166 5.39703 0.732964C5.86572 0.264266 6.50122 0.000661846 7.16406 0L13.8307 0C14.4936 0.000661846 15.1291 0.264266 15.5978 0.732964C16.0665 1.20166 16.3301 1.83716 16.3307 2.5V4.16667C16.3301 4.8295 16.0665 5.465 15.5978 5.9337C15.1291 6.4024 14.4936 6.666 13.8307 6.66667ZM7.16406 1.66667C6.94312 1.66689 6.73128 1.75476 6.57505 1.91099C6.41882 2.06722 6.33095 2.27905 6.33073 2.5V4.16667C6.33095 4.38761 6.41882 4.59945 6.57505 4.75568C6.73128 4.91191 6.94312 4.99978 7.16406 5H13.8307C14.0517 4.99978 14.2635 4.91191 14.4197 4.75568C14.576 4.59945 14.6638 4.38761 14.6641 4.16667V2.5C14.6638 2.27905 14.576 2.06722 14.4197 1.91099C14.2635 1.75476 14.0517 1.66689 13.8307 1.66667H7.16406Z"
24
- fill="#ADB2B2"
24
+ fill={fill || "#ADB2B2"}
25
25
  />
26
26
  </svg>
27
27
  );
package/src/components/sideNav/svg/fun.jsx CHANGED
@@ -1,15 +1,15 @@
1
- const FunIcon = () => {
1
+ const FunIcon = ({ width, height, stroke }) => {
2
2
  return (
3
3
  <svg
4
- width="21"
5
- height="21"
4
+ width={width || "21"}
5
+ height={height || "21"}
6
6
  viewBox="0 0 21 21"
7
7
  fill="none"
8
8
  xmlns="http://www.w3.org/2000/svg"
9
9
  >
10
10
  <path
11
11
  d="M8.47135 10.8828L5.92969 13.4245"
12
- stroke="#ADB3B3"
12
+ stroke={stroke || "#ADB3B3"}
13
13
  stroke-width="1.0856"
14
14
  stroke-miterlimit="10"
15
15
  stroke-linecap="round"
@@ -17,7 +17,7 @@ const FunIcon = () => {
17
17
  />
18
18
  <path
19
19
  d="M5.96094 10.9082L8.5026 13.4499"
20
- stroke="#ADB3B3"
20
+ stroke={stroke || "#ADB3B3"}
21
21
  stroke-width="1.0856"
22
22
  stroke-miterlimit="10"
23
23
  stroke-linecap="round"
@@ -25,7 +25,7 @@ const FunIcon = () => {
25
25
  />
26
26
  <path
27
27
  d="M11.7734 12.166H11.7818"
28
- stroke="#ADB3B3"
28
+ stroke={stroke || "#ADB3B3"}
29
29
  stroke-width="1.44747"
30
30
  stroke-miterlimit="10"
31
31
  stroke-linecap="round"
@@ -33,7 +33,7 @@ const FunIcon = () => {
33
33
  />
34
34
  <path
35
35
  d="M15.0547 12.166H15.063"
36
- stroke="#ADB3B3"
36
+ stroke={stroke || "#ADB3B3"}
37
37
  stroke-width="1.44747"
38
38
  stroke-miterlimit="10"
39
39
  stroke-linecap="round"
@@ -41,7 +41,7 @@ const FunIcon = () => {
41
41
  />
42
42
  <path
43
43
  d="M13.4141 13.8174V13.8008"
44
- stroke="#ADB3B3"
44
+ stroke={stroke || "#ADB3B3"}
45
45
  stroke-width="1.44747"
46
46
  stroke-miterlimit="10"
47
47
  stroke-linecap="round"
@@ -49,7 +49,7 @@ const FunIcon = () => {
49
49
  />
50
50
  <path
51
51
  d="M13.4141 10.5342V10.5176"
52
- stroke="#ADB3B3"
52
+ stroke={stroke || "#ADB3B3"}
53
53
  stroke-width="1.44747"
54
54
  stroke-miterlimit="10"
55
55
  stroke-linecap="round"
@@ -57,14 +57,14 @@ const FunIcon = () => {
57
57
  />
58
58
  <path
59
59
  d="M7.9974 18.8333H12.9974C17.1641 18.8333 18.8307 17.1667 18.8307 13V11.3333C18.8307 7.16667 17.1641 5.5 12.9974 5.5H7.9974C3.83073 5.5 2.16406 7.16667 2.16406 11.3333V13C2.16406 17.1667 3.83073 18.8333 7.9974 18.8333Z"
60
- stroke="#ADB3B3"
60
+ stroke={stroke || "#ADB3B3"}
61
61
  stroke-width="1.0856"
62
62
  stroke-linecap="round"
63
63
  stroke-linejoin="round"
64
64
  />
65
65
  <path
66
66
  d="M11.3401 2.16602L11.3318 3.00768C11.3234 3.46602 10.9568 3.83268 10.4984 3.83268H10.4734C10.0151 3.83268 9.64844 4.20768 9.64844 4.66602C9.64844 5.12435 10.0234 5.49935 10.4818 5.49935H11.3151"
67
- stroke="#ADB3B3"
67
+ stroke={stroke || "#ADB3B3"}
68
68
  stroke-width="1.0856"
69
69
  stroke-linecap="round"
70
70
  stroke-linejoin="round"
package/src/components/sideNav/svg/speechIcon.jsx CHANGED
@@ -1,15 +1,15 @@
1
- const SpeechIcon = () => {
1
+ const SpeechIcon = ({ width, height, fill }) => {
2
2
  return (
3
3
  <svg
4
- width="21"
5
- height="20"
4
+ width={width || "21"}
5
+ height={height || "20"}
6
6
  viewBox="0 0 21 20"
7
7
  fill="none"
8
8
  xmlns="http://www.w3.org/2000/svg"
9
9
  >
10
10
  <path
11
11
  d="M14.3516 6.14648C13.6988 5.5076 13.1746 4.76454 12.7791 3.91732C12.383 3.0701 12.1849 2.29232 12.1849 1.58398C12.1849 1.37565 12.2646 1.19843 12.4241 1.05232C12.5841 0.906762 12.7821 0.833984 13.0182 0.833984C13.2266 0.833984 13.4141 0.913707 13.5807 1.07315C13.7474 1.23315 13.8446 1.43121 13.8724 1.66732C13.9696 2.29232 14.1571 2.88954 14.4349 3.45898C14.7127 4.02843 15.0738 4.53537 15.5182 4.97982C15.9627 5.42426 16.4696 5.78871 17.0391 6.07315C17.6085 6.35815 18.2057 6.54926 18.8307 6.64648C19.0668 6.67426 19.2646 6.76787 19.4241 6.92732C19.5841 7.08732 19.6641 7.27148 19.6641 7.47982C19.6641 7.71593 19.5946 7.91398 19.4557 8.07398C19.3168 8.23343 19.1432 8.31315 18.9349 8.31315C18.2127 8.31315 17.428 8.11176 16.5807 7.70898C15.7335 7.30621 14.9905 6.78537 14.3516 6.14648ZM16.6849 3.81315C16.3238 3.45204 16.0391 3.06648 15.8307 2.65648C15.6224 2.24704 15.5182 1.86871 15.5182 1.52148C15.5182 1.32704 15.6016 1.16371 15.7682 1.03148C15.9349 0.899818 16.1363 0.833984 16.3724 0.833984C16.5668 0.833984 16.7371 0.906762 16.8832 1.05232C17.0288 1.19843 17.1432 1.38954 17.2266 1.62565C17.296 1.8201 17.3793 2.00065 17.4766 2.16732C17.5738 2.33398 17.6988 2.49371 17.8516 2.64648C18.0043 2.79926 18.1641 2.92065 18.3307 3.01065C18.4974 3.10121 18.678 3.18121 18.8724 3.25065C19.1085 3.33398 19.2996 3.45204 19.4457 3.60482C19.5913 3.7576 19.6641 3.93121 19.6641 4.12565C19.6641 4.36176 19.5982 4.56315 19.4666 4.72982C19.3343 4.89648 19.171 4.97982 18.9766 4.97982C18.6293 4.97982 18.2507 4.87565 17.8407 4.66732C17.4313 4.45898 17.046 4.17426 16.6849 3.81315ZM8.83073 10.834C7.91406 10.834 7.12934 10.5076 6.47656 9.85482C5.82378 9.20204 5.4974 8.41732 5.4974 7.50065C5.4974 6.58398 5.82378 5.79926 6.47656 5.14648C7.12934 4.49371 7.91406 4.16732 8.83073 4.16732C9.7474 4.16732 10.5321 4.49371 11.1849 5.14648C11.8377 5.79926 12.1641 6.58398 12.1641 7.50065C12.1641 8.41732 11.8377 9.20204 11.1849 9.85482C10.5321 10.5076 9.7474 10.834 8.83073 10.834ZM3.83073 17.5007C3.3724 17.5007 2.98017 17.3376 2.65406 17.0115C2.3274 16.6848 2.16406 16.2923 2.16406 15.834V15.1673C2.16406 14.709 2.28212 14.2784 2.51823 13.8757C2.75434 13.4729 3.08073 13.1673 3.4974 12.959C4.20573 12.5979 5.00434 12.2923 5.89323 12.0423C6.78212 11.7923 7.76128 11.6673 8.83073 11.6673C9.90017 11.6673 10.8793 11.7923 11.7682 12.0423C12.6571 12.2923 13.4557 12.5979 14.1641 12.959C14.5807 13.1673 14.9071 13.4729 15.1432 13.8757C15.3793 14.2784 15.4974 14.709 15.4974 15.1673V15.834C15.4974 16.2923 15.3343 16.6848 15.0082 17.0115C14.6816 17.3376 14.2891 17.5007 13.8307 17.5007H3.83073ZM3.83073 15.834H13.8307V15.1673C13.8307 15.0145 13.7927 14.8757 13.7166 14.7507C13.6399 14.6257 13.5391 14.5284 13.4141 14.459C12.9141 14.209 12.2718 13.959 11.4874 13.709C10.7024 13.459 9.81684 13.334 8.83073 13.334C7.84462 13.334 6.95906 13.459 6.17406 13.709C5.38962 13.959 4.7474 14.209 4.2474 14.459C4.1224 14.5284 4.02184 14.6257 3.94573 14.7507C3.86906 14.8757 3.83073 15.0145 3.83073 15.1673V15.834ZM8.83073 9.16732C9.28906 9.16732 9.68156 9.00398 10.0082 8.67732C10.3343 8.35121 10.4974 7.95898 10.4974 7.50065C10.4974 7.04232 10.3343 6.64982 10.0082 6.32315C9.68156 5.99704 9.28906 5.83398 8.83073 5.83398C8.3724 5.83398 7.98017 5.99704 7.65406 6.32315C7.3274 6.64982 7.16406 7.04232 7.16406 7.50065C7.16406 7.95898 7.3274 8.35121 7.65406 8.67732C7.98017 9.00398 8.3724 9.16732 8.83073 9.16732Z"
12
- fill="#ADB2B2"
12
+ fill={fill || "#ADB2B2"}
13
13
  />
14
14
  </svg>
15
15
  );