-
Notifications
You must be signed in to change notification settings - Fork 2
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
02e17fc
commit 8d5badd
Showing
8 changed files
with
181 additions
and
80 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
File renamed without changes.
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
2 changes: 1 addition & 1 deletion
2
...omponents/recruitment/RecruitmentCard.tsx → ...ents/recruitment/main/RecruitmentCard.tsx
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
2 changes: 1 addition & 1 deletion
2
...c/components/recruitment/ToggleButton.tsx → ...ponents/recruitment/main/ToggleButton.tsx
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
71 changes: 71 additions & 0 deletions
71
frontend/src/components/recruitment/noticification/NoticeModal.tsx
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,71 @@ | ||
import React, { PropsWithChildren, useEffect, useState } from 'react' | ||
import Noticification from './Noticification' | ||
|
||
type PropsType = { | ||
onClickToggleModal: () => void | ||
} | ||
|
||
type NotificationDataType = { | ||
id: number | ||
type: string | ||
content: string | ||
read: boolean | ||
} | ||
|
||
export default function NoticeModal({ | ||
onClickToggleModal, | ||
}: PropsWithChildren<PropsType>) { | ||
const accessToken = | ||
typeof window !== 'undefined' ? sessionStorage.getItem('accessToken') : null | ||
const persistToken = | ||
typeof window !== 'undefined' ? localStorage.getItem('persistToken') : null | ||
|
||
const [data, setData] = useState<NotificationDataType[]>([]) | ||
|
||
const getData = async ({ pageParam = 1 }) => { | ||
const params = new URLSearchParams() | ||
params.set('page', String(pageParam)) | ||
params.set('size', '12') | ||
params.set('direction', 'ASC') | ||
const res = await fetch( | ||
`${process.env.NEXT_PUBLIC_BASE_URL}/notifications?${params.toString()}`, | ||
{ | ||
headers: { | ||
'Content-Type': 'application/json', | ||
Authorization: `Bearer ${accessToken || persistToken}`, | ||
}, | ||
}, | ||
) | ||
|
||
if (!res.ok) { | ||
const resData = await res.json() | ||
throw new Error(resData.message) | ||
} | ||
|
||
const resData = await res.json() | ||
setData(resData.data) | ||
} | ||
|
||
useEffect(() => { | ||
getData({ pageParam: 1 }) | ||
}, []) | ||
|
||
return ( | ||
<div className="h-full w-full relative"> | ||
<div className="overflow-auto fixed z-50 w-[300px] h-[350px] rounded-[15px] bg-white shadow-md top-[70px] right-0"> | ||
{data.map((item: NotificationDataType) => ( | ||
<Noticification item={item} /> | ||
))} | ||
</div> | ||
<button | ||
aria-label="Toggle modal" | ||
className="fixed top-0 left-0 right-0 bottom-0 z-40 h-full w-screen" | ||
onClick={(e: React.MouseEvent) => { | ||
e.preventDefault() | ||
onClickToggleModal?.() | ||
}} | ||
type="button" | ||
/> | ||
</div> | ||
) | ||
} |
21 changes: 21 additions & 0 deletions
21
frontend/src/components/recruitment/noticification/Noticification.tsx
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,21 @@ | ||
import { HiOutlineUserCircle } from 'react-icons/hi2' | ||
|
||
type NotificationType = { | ||
item: { | ||
id: number | ||
type: string | ||
content: string | ||
read: boolean | ||
} | ||
} | ||
|
||
export default function RecruitmentCard({ item }: NotificationType) { | ||
return ( | ||
<div className="border-b-2 border-gray-200 flex items-center w-[290px] h-[50px] text-lightgray text-[11px] py-2 px-4 bg-white border-solid"> | ||
<div> | ||
<HiOutlineUserCircle strokeWidth="1" size="30" /> | ||
</div> | ||
<span className="ml-2">{item.content}</span> | ||
</div> | ||
) | ||
} |