-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
ba6fe1c
commit 853c91a
Showing
27 changed files
with
759 additions
and
13 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| import React from 'react' | ||
| import MyProjectList from './list' | ||
|
|
||
| const MyProject = () => { | ||
| return ( | ||
| <> | ||
| <MyProjectList /> | ||
| </> | ||
| ) | ||
| } | ||
|
|
||
| export default MyProject |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| export {default} from './component'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,148 @@ | ||
| import cx from 'classnames'; | ||
| import { Menu } from '@headlessui/react'; | ||
| import MyProjectsSentence from 'containers/sentence/my-projects'; | ||
| import Wrapper from 'containers/wrapper'; | ||
| import { setSort } from 'store/myProjects'; | ||
| import { useFetchMemberProjects, useMyInfinityProjects } from 'hooks/my-projects'; | ||
| import { useCallback } from 'react'; | ||
| import { useAppDispatch, useAppSelector } from 'store/hooks'; | ||
| import Button from 'components/button'; | ||
| import Icon from 'components/icon'; | ||
| import Loading from 'components/loading'; | ||
| import CHEVRON_DOWN_SVG from 'svgs/ui/chevron-down.svg?sprite'; | ||
| import Cards from 'containers/cards'; | ||
| import Link from 'next/link'; | ||
|
|
||
| const MyProjectList = () => { | ||
| const { sort } = useAppSelector((state) => state['/myProjects']); | ||
|
|
||
| const dispatch = useAppDispatch(); | ||
| const { | ||
| data: myProjects, | ||
| fetchNextPage: fetchNextPageProjects, | ||
| hasNextPage: hasNextProjectsPage, | ||
| isFetchingNextPage: isFetchingNextProjectsPage, | ||
| isFetching: isFetchingMyProjects, | ||
| isFetched: isFetchedMyProjects, | ||
| } = useMyInfinityProjects({ | ||
| sort, | ||
| perPage: 12, | ||
| }); | ||
|
|
||
| const LOADING = isFetchingMyProjects && !isFetchingMyProjects; | ||
|
|
||
| const handleSortMyProjects = useCallback( | ||
| (value) => { | ||
| dispatch(setSort({ field: 'name', order: value })); | ||
| }, | ||
| [dispatch] | ||
| ); | ||
|
|
||
| const handleOnShowMore = useCallback(() => { | ||
| fetchNextPageProjects(); | ||
| }, [fetchNextPageProjects]); | ||
|
|
||
| return ( | ||
| <> | ||
| <Wrapper> | ||
| <div className="py-8"> | ||
| {!!myProjects.length && ( | ||
| <> | ||
| <MyProjectsSentence type="projects" /> | ||
| <div className="flex justify-between mt-10"> | ||
| <Menu as="div" className="relative"> | ||
| <Menu.Button className="flex items-center space-x-2"> | ||
| <p className="font-semibold">Sort by</p> | ||
| <Icon | ||
| icon={CHEVRON_DOWN_SVG} | ||
| className={cx({ | ||
| 'w-3 h-3': true, | ||
| })} | ||
| /> | ||
| </Menu.Button> | ||
| <Menu.Items className="absolute flex flex-col py-2 bg-white rounded-md shadow-lg focus:outline-none"> | ||
| <Menu.Item> | ||
| {({ active }) => ( | ||
| <button | ||
| className={cx({ | ||
| 'px-4 py-3': true, | ||
| 'bg-grey-20/20': active, | ||
| })} | ||
| type="button" | ||
| onClick={() => handleSortMyProjects('asc')} | ||
| > | ||
| A - Z | ||
| </button> | ||
| )} | ||
| </Menu.Item> | ||
| <Menu.Item> | ||
| {({ active }) => ( | ||
| <button | ||
| className={cx({ | ||
| 'px-4 py-3': true, | ||
| 'bg-grey-20/20': active, | ||
| })} | ||
| type="button" | ||
| onClick={() => handleSortMyProjects('desc')} | ||
| > | ||
| Z - A | ||
| </button> | ||
| )} | ||
| </Menu.Item> | ||
| </Menu.Items> | ||
| </Menu> | ||
| </div> | ||
| </> | ||
| )} | ||
| </div> | ||
|
|
||
| {!myProjects.length && !LOADING && ( | ||
| <div className="flex items-center justify-center px-5 grow "> | ||
| <div className="flex flex-col items-center py-12 pb-20 space-y-4"> | ||
| <p className="md:text-[40px] font-display font-medium">You have no projects added.</p> | ||
| <p className="max-w-sm text-center text-grey-20"> | ||
| Sorry, we have searched in our entire database but we couldn't find any results | ||
| fitting your search criteria. | ||
| </p> | ||
|
|
||
| <button className="px-4 py-2 text-black rounded-lg bg-green-10"> | ||
| <Link href="/my-projects/new">Add Product</Link> | ||
| </button> | ||
| </div> | ||
| </div> | ||
| )} | ||
|
|
||
| {!!myProjects.length && ( | ||
| <div className="pb-10"> | ||
| <Cards | ||
| pathname="/members/projects" | ||
| theme="bg-green-0" | ||
| data={myProjects} | ||
| project={true} | ||
| /> | ||
| </div> | ||
| )} | ||
|
|
||
| {hasNextProjectsPage && ( | ||
| <div className="flex justify-center py-10"> | ||
| <Button | ||
| type="button" | ||
| theme="black-alt" | ||
| size="xl" | ||
| className="overflow-hidden" | ||
| onClick={handleOnShowMore} | ||
| > | ||
| Show more | ||
| <Loading | ||
| visible={isFetchingNextProjectsPage} | ||
| className="absolute flex items-center justify-center w-full h-full bg-white" | ||
| /> | ||
| </Button> | ||
| </div> | ||
| )} | ||
| </Wrapper> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| export default MyProjectList; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| export {default} from './component'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| import React from 'react' | ||
| import { SentenceProps } from '../types' | ||
|
|
||
| const MyProjectsSentence: React.FC<SentenceProps> = ({type}) => { | ||
|
|
||
| return ( | ||
| <div className='relative text-sm font-semibold text-grey-20 min-h-[16px]'> | ||
|
|
||
| <> | ||
| <div className='inline mr-2 text-[32px] font-display font-thin text-black'> | ||
| An overview of all your Projects | ||
| </div> | ||
| </> | ||
| </div> | ||
| ) | ||
| } | ||
|
|
||
| export default MyProjectsSentence |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| export {default} from './component'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| import { useSession } from "next-auth/react"; | ||
| import { useRouter } from "next/router"; | ||
| import { useEffect } from "react"; | ||
|
|
||
| export default function ProtectedRoute({children} : { children: React.ReactNode}){ | ||
| const {status} = useSession(); | ||
| const router = useRouter(); | ||
|
|
||
| useEffect(() => { | ||
| if(status === "unauthenticated"){ | ||
| router.push("/auth/signin"); | ||
| } | ||
| }, [status, router]); | ||
|
|
||
| if(status === "loading"){ | ||
| return <div>Loading...</div> | ||
| } | ||
|
|
||
| return <> {children} </>; | ||
| } |
Oops, something went wrong.