l-min-components 1.0.705 → 1.0.708

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.
@@ -1,4 +1,4 @@
1
- import React from "react";
1
+ import React, { useState } from "react";
2
2
  import {
3
3
  BannerWrapper,
4
4
  InstructorContainer,
@@ -7,7 +7,7 @@ import {
7
7
  Container,
8
8
  Upgrade,
9
9
  Users,
10
- UploadProgressContainer
10
+ UploadProgressContainer,
11
11
  } from "../styles";
12
12
  import Button from "../../button";
13
13
  import CircularProgressBar from "../components/progressBar";
@@ -25,76 +25,75 @@ import SliderIcon from "../assets/slider";
25
25
 
26
26
  /**
27
27
  * @param {{
28
- * CourseClick: function,
29
- * UpgradeClick: function,
30
- * }} props - properties of graph Component
31
- *
32
- */
33
-
34
- const EnterpriseRightBar = ({UpgradeClick, CourseClick}) => {
28
+ * CourseClick: function,
29
+ * UpgradeClick: function,
30
+ * }} props - properties of graph Component
31
+ *
32
+ */
35
33
 
34
+ const EnterpriseRightBar = ({ UpgradeClick, CourseClick, gracePeriod, planState}) => {
35
+
36
36
  return (
37
- <InstructorContainer>
38
- <BannerWrapper>
39
- <div className="head_instructor head_enterprise">
40
- <h3>Best Course</h3>
41
- </div>
42
- <NewLanguage>
43
- <div className="top_section">
44
- <div className="lession_cont">
45
- <LessonIcon />
46
- <p> 9 lessions</p>
37
+ <InstructorContainer className={planState === "GRACE PERIOD" ? "grace_period" : ""}>
38
+ <BannerWrapper>
39
+ <div className="head_instructor head_enterprise">
40
+ <h3>Best Course</h3>
41
+ </div>
42
+ <NewLanguage>
43
+ <div className="top_section">
44
+ <div className="lession_cont">
45
+ <LessonIcon />
46
+ <p> 9 lessions</p>
47
+ </div>
48
+ <div className="flag_cont">
49
+ <LessonFlag />
50
+ </div>
47
51
  </div>
48
- <div className="flag_cont">
49
- <LessonFlag />
50
52
 
53
+ <div className="buttom_section">
54
+ <p>French for Beginners</p>
51
55
  </div>
56
+ </NewLanguage>
57
+ <SliderIcon />
58
+ </BannerWrapper>
59
+ <RecentAdded>
60
+ <div className="top_area">
61
+ <h5>Recently added</h5>
62
+ <p>See all</p>
52
63
  </div>
53
-
54
- <div className="buttom_section">
55
- <p>French for Beginners</p>
64
+ <div className="users_list">
65
+ <div className="user">
66
+ <img src={Ellipse} alt="user" />
67
+ </div>
68
+ <div className="user">
69
+ <img src={Ellipse2} alt="user" />
70
+ </div>
71
+ <div className="user">
72
+ <img src={Ellipse3} alt="user" />
73
+ </div>
74
+ <div className="user">
75
+ <img src={Ellipse4} alt="user" />
76
+ </div>
56
77
  </div>
57
- </NewLanguage>
58
- <SliderIcon />
59
- </BannerWrapper>
60
- <RecentAdded>
61
- <div className="top_area">
62
- <h5>Recently added</h5>
63
- <p>See all</p>
64
- </div>
65
- <div className="users_list">
66
- <div className="user">
67
- <img src={Ellipse} alt="user" />
68
- </div>
69
- <div className="user">
70
- <img src={Ellipse2} alt="user" />
71
- </div>
72
- <div className="user">
73
- <img src={Ellipse3} alt="user" />
74
- </div>
75
- <div className="user">
76
- <img src={Ellipse4} alt="user" />
77
- </div>
78
- </div>
79
- <Button
80
- type="primary"
81
- text="Create Course"
82
- styles={{
83
- marginTop: "29px",
84
- fontSize: "16px",
85
- width: "203px",
86
- gap: "8px",
87
- padding: "20px 6px",
88
- height: "40px",
89
- boxShadow: "0px 10px 20px 0px rgba(254, 191, 16, 0.25)",
90
- }}
91
- onClick={CourseClick}
92
- />
93
- </RecentAdded>
94
-
95
- <UpgradeComponent UpgradeClick={UpgradeClick} />
96
-
97
- </InstructorContainer>
78
+ <Button
79
+ type="primary"
80
+ text="Create Course"
81
+ disabled={planState === "GRACE PERIOD"}
82
+ styles={{
83
+ marginTop: "29px",
84
+ fontSize: "16px",
85
+ width: "203px",
86
+ gap: "8px",
87
+ padding: "20px 6px",
88
+ height: "40px",
89
+ boxShadow: "0px 10px 20px 0px rgba(254, 191, 16, 0.25)",
90
+ }}
91
+ onClick={CourseClick}
92
+ />
93
+ </RecentAdded>
94
+
95
+ <UpgradeComponent UpgradeClick={UpgradeClick} gracePeriod={gracePeriod} planState={planState} />
96
+ </InstructorContainer>
98
97
  );
99
98
  };
100
99
 
@@ -7,11 +7,11 @@ import UpgradeIcon from "../assets/Feature.png";
7
7
  import EnterpriseUpgrade from "../assets/enterpriseUpgrade.png"
8
8
 
9
9
 
10
- const UpgradeComponent = ({UpgradeClick}) => {
10
+ const UpgradeComponent = ({UpgradeClick, gracePeriod, planState}) => {
11
11
 
12
12
  return (
13
13
 
14
- <Upgrade>
14
+ <Upgrade className={planState === "GRACE PERIOD" ? "deactivated" : ""}>
15
15
  <div className="container">
16
16
  <img src={EnterpriseUpgrade} alt="upgrad box" />
17
17
  <div className="upgrade_text">
@@ -22,7 +22,8 @@ const UpgradeComponent = ({UpgradeClick}) => {
22
22
  </p>
23
23
  <Button
24
24
  type="primary"
25
- text="Upgrade"
25
+ text="Buy Slot"
26
+ disabled={planState === "GRACE PERIOD"}
26
27
  styles={{
27
28
  marginTop: "12px",
28
29
  fontSize: "16px",
@@ -30,6 +31,7 @@ const UpgradeComponent = ({UpgradeClick}) => {
30
31
  height: "38.641px",
31
32
  gap: "8px",
32
33
  padding: "15.457px 30.913px",
34
+ boxShadow: "0px 10px 20px 0px rgba(254, 191, 16, 0.25)",
33
35
  }}
34
36
  onClick={UpgradeClick}
35
37
  />