From ce5281ff77781e2dac2e4539a75fb9d491277b95 Mon Sep 17 00:00:00 2001 From: Puskar Adhikari Date: Wed, 4 Aug 2021 16:11:49 +0545 Subject: [PATCH 1/2] console clean of course view --- public/index.html | 35 +-- .../myCoursesCard/MyCoursesCard.jsx | 11 +- .../searchComponent/SearchComponent.jsx | 9 +- src/components/sidebar/Sidebar.jsx | 278 +++++++++++++----- src/components/subHeader/SubHeader.jsx | 46 ++- .../dashboardLayout/DashboardLayout.jsx | 103 ++++++- .../courseCollection/CourseCollection.jsx | 67 +++-- .../courses/courseUsers/CourseUsers.jsx | 26 +- 8 files changed, 413 insertions(+), 162 deletions(-) diff --git a/public/index.html b/public/index.html index 03c7f5c37..d9cc8eace 100644 --- a/public/index.html +++ b/public/index.html @@ -3,43 +3,26 @@ - + - - - + Planet Farms
- - + diff --git a/src/components/myCoursesCard/MyCoursesCard.jsx b/src/components/myCoursesCard/MyCoursesCard.jsx index fbef47700..e1de27c3b 100644 --- a/src/components/myCoursesCard/MyCoursesCard.jsx +++ b/src/components/myCoursesCard/MyCoursesCard.jsx @@ -64,18 +64,19 @@ export default MyCoursesCard const CourseCard = ({ data }) => { return ( - data && data.map(item => { + data && + data.map((item, i) => { return ( - +

{item.name}

{item.activity || item.status}

- { - item.lesson &&
+ {item.lesson && ( +
{item.lesson}
- } + )}
) diff --git a/src/components/searchComponent/SearchComponent.jsx b/src/components/searchComponent/SearchComponent.jsx index 5cbc618ea..cfb941901 100644 --- a/src/components/searchComponent/SearchComponent.jsx +++ b/src/components/searchComponent/SearchComponent.jsx @@ -4,7 +4,14 @@ import './SearchComponent.scss' const SearchComponent = ({ className, search, setSearch, showEditIcon }) => { return (
- Search setSearch(e.target.value)} className='search-1' placeholder='Search...' /> + Search{' '} + setSearch(e.target.value)} + className='search-1' + placeholder='Search...' + /> {showEditIcon && edit icon}
) diff --git a/src/components/sidebar/Sidebar.jsx b/src/components/sidebar/Sidebar.jsx index afad5a5a9..e7db3802b 100644 --- a/src/components/sidebar/Sidebar.jsx +++ b/src/components/sidebar/Sidebar.jsx @@ -7,7 +7,7 @@ import './Sidebar.css' const Sidebar = ({ setToggle, toggle, mobileView, burgerActive }) => { const [dropdownActive, setDropdownActive] = useState(true) - const { currentCommunity } = useSelector(state => state.activeCommunity) + const { currentCommunity } = useSelector((state) => state.activeCommunity) const history = useHistory() const handleToggle = () => { setToggle(!toggle) @@ -23,7 +23,9 @@ const Sidebar = ({ setToggle, toggle, mobileView, burgerActive }) => { dropdown: [ { name: 'Members', - slug: `/community-members/${currentCommunity && currentCommunity.slug}`, + slug: `/community-members/${ + currentCommunity && currentCommunity.slug + }`, initial: 'Me' }, { @@ -67,33 +69,60 @@ const Sidebar = ({ setToggle, toggle, mobileView, burgerActive }) => { }, []) return ( <> - { - !mobileView - ? <> + {!mobileView ? ( + <> +
- {toggle - ? full logo - : p-icon logo} + {toggle ? ( + full logo + ) : ( + p-icon logo + )}
- +
-
-
calendar-icon history.push('/calendar/my-events')} - /> +
+ +
+
+ calendar-icon history.push('/calendar/my-events')} + />
- - :
- -
- } + + ) : ( +
+ +
+ )} ) } @@ -110,46 +139,66 @@ function MainNav ({ dropdownActive, setDropdownActive, navMenu, toggle }) { return ( <>
    - { - navMenu.map(navitem => { + {navMenu.map((navitem) => { return ( -
  • 0 ? 'list-items' : 'list-items-menu'} key={navitem.name}> +
  • 0 ? 'list-items' : 'list-items-menu' + } + key={navitem.name} + >
    history.push(`${navitem.slug}`) - : () => history.push(`${navitem.slug}`)} - className={`${pathname === `${navitem.slug}` ? ' text-menu text-active' : 'text-menu'}`} + onClick={ + navitem.name === 'Ragarians' + ? handleOnClick + : navitem.name === 'Library' + ? () => history.push(`${navitem.slug}`) + : () => history.push(`${navitem.slug}`) + } + className={`${ + pathname === `${navitem.slug}` + ? ' text-menu text-active' + : 'text-menu' + }`} > -
    history.push(`${navitem.slug}`)} className='align-content'> - { - (navitem.name === 'Courses' || navitem.name === 'Calendar') - ?
    {navitem.image}
    - :
    {navitem.image}
    - } {navitem.name} +
    history.push(`${navitem.slug}`)} + className='align-content' + > + {navitem.name === 'Courses' || navitem.name === 'Calendar' ? ( +
    {navitem.image}
    + ) : ( +
    {navitem.image}
    + )}{' '} + {navitem.name}
    -
    { - navitem.dropdown.length > 0 && <> -
      - { - navitem.dropdown.map(item => { - return ( -
      -
    • history.push(`${item.slug}`)} className='dropdown-item'> - {toggle ? item.name : item.initial} -
      • -
      - ) - }) - } -
    - - } +
    + {navitem.dropdown.length > 0 && ( + <> +
      + {navitem.dropdown.map((item) => { + return ( +
      +
    • history.push(`${item.slug}`)} + className='dropdown-item' + > + {toggle ? item.name : item.initial} +
      • +
      + ) + })} +
    + + )}
    • ) - }) - } + })}
) @@ -157,40 +206,125 @@ function MainNav ({ dropdownActive, setDropdownActive, navMenu, toggle }) { function RagIcon () { return ( - - - - - - - + + + + + + + ) } function Book () { return ( - - - + + + ) } function Cap () { return ( - - + + ) } function CalendarIcon () { return ( - - - - + + + + ) } diff --git a/src/components/subHeader/SubHeader.jsx b/src/components/subHeader/SubHeader.jsx index 2628162f5..34016a175 100644 --- a/src/components/subHeader/SubHeader.jsx +++ b/src/components/subHeader/SubHeader.jsx @@ -24,26 +24,50 @@ const SubHeader = ({ search, setSearch, nav, setCreateActive, btnName }) => { return (
- {windowWidth > 640 - ? <> + {windowWidth > 640 ? ( + <>
    - {nav.map((menu) => ( -
  • - {menu.label} + {nav.map((menu, i) => ( +
  • + + {menu.label} +
    • ))}
- - - : <> + + + ) : ( + <> - - } + + + )}
- +
diff --git a/src/layout/dashboardLayout/DashboardLayout.jsx b/src/layout/dashboardLayout/DashboardLayout.jsx index 847f2072d..be379da8d 100644 --- a/src/layout/dashboardLayout/DashboardLayout.jsx +++ b/src/layout/dashboardLayout/DashboardLayout.jsx @@ -122,24 +122,53 @@ const DashboardLayout = ({ title, children }) => {
- text logo of planet farm - avatar-img + text logo of planet farm + avatar-img

{title}

{children}
-
activeUser()} className={`mobile-tab-wrapper ${userActive ? 'bgactive' : ''} `}> - +
activeUser()} + className={`mobile-tab-wrapper ${userActive ? 'bgactive' : ''} `} + > + + +
-
activeMessage()} className={`mobile-tab-wrapper ${messageActive ? 'bgactive' : ''}`}> +
activeMessage()} + className={`mobile-tab-wrapper ${ + messageActive ? 'bgactive' : '' + }`} + >
-
activeNotification()} className={`mobile-tab-wrapper ${notificationActive ? 'bgactive' : ''}`}> +
activeNotification()} + className={`mobile-tab-wrapper ${ + notificationActive ? 'bgactive' : '' + }`} + >
-
{ activeBurger(); SignOutModal(e) }} className={`mobile-tab-wrapper ${burgerActive ? 'bgactive' : ''}`}> +
{ + activeBurger() + SignOutModal(e) + }} + className={`mobile-tab-wrapper ${burgerActive ? 'bgactive' : ''}`} + >
@@ -151,17 +180,49 @@ const DashboardLayout = ({ title, children }) => { function Hamburger () { return ( - - - - + + + + ) } function NotificationMenu () { return ( - + + + { setCreateActive={setActive} btnName='Add Courses' /> - - + +
) @@ -55,13 +63,16 @@ const CourseUserCard = ({ name, data, btnName, subName }) => { <>

{name}

- { - data.map(item => { - return ( - - ) - }) - } + {data.map((item, i) => { + return ( + + ) + })} ) @@ -69,10 +80,12 @@ const CourseUserCard = ({ name, data, btnName, subName }) => { export const BackgroundUserCard = ({ item, btnName, subName }) => { return ( - +
@@ -85,15 +98,23 @@ function CourseUserContent ({ item, btnName }) { return (

{item.title}

- {btnName === 'Edit Collection' - ? - - : } + + )}
) } diff --git a/src/screens/courses/courseUsers/CourseUsers.jsx b/src/screens/courses/courseUsers/CourseUsers.jsx index bf787e9ee..04dfeb502 100644 --- a/src/screens/courses/courseUsers/CourseUsers.jsx +++ b/src/screens/courses/courseUsers/CourseUsers.jsx @@ -40,13 +40,9 @@ const CourseUserCard = ({ name }) => { <>

{name}

- { - farming.map(item => { - return ( - - ) - }) - } + {farming.map((item, i) => { + return + })} ) @@ -55,12 +51,22 @@ const CourseUserCard = ({ name }) => { export const BackgroundUserCard = ({ item }) => { const [savedActive, setSavedActive] = useState(false) return ( - +

{item.title}

-
From 7875262a410d35f29c2a7311afef896254a43795 Mon Sep 17 00:00:00 2001 From: Puskar Adhikari Date: Wed, 4 Aug 2021 16:33:37 +0545 Subject: [PATCH 2/2] useEffect memory leak dependency removed --- src/components/subHeader/SubHeader.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/subHeader/SubHeader.jsx b/src/components/subHeader/SubHeader.jsx index 34016a175..fe04c40af 100644 --- a/src/components/subHeader/SubHeader.jsx +++ b/src/components/subHeader/SubHeader.jsx @@ -19,7 +19,7 @@ const SubHeader = ({ search, setSearch, nav, setCreateActive, btnName }) => { if (!userInfo) { history.push('/login') } - }, [search, dispatch, history, userInfo]) + }, [userInfo]) return (