From 2f2122473d928f946133eb28399e105a48bf94c5 Mon Sep 17 00:00:00 2001 From: Yu Harin Date: Fri, 31 May 2024 15:28:38 +0900 Subject: [PATCH] =?UTF-8?q?[feat]=20#14=20=ED=94=84=EB=A1=9C=EC=A0=9D?= =?UTF-8?q?=ED=8A=B8=20data=20=ED=95=84=ED=84=B0=EB=A7=81=ED=95=B4?= =?UTF-8?q?=EC=84=9C=20assignee=20=EB=B0=B0=EC=97=B4=20=EB=B0=9B=EC=95=84?= =?UTF-8?q?=EC=98=A4=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/issue/InfoBox.tsx | 38 ++++++++++++++++++++++++++++++-- src/hooks/useFetchProject.tsx | 6 ++++- src/pages/project/index.tsx | 5 ++--- src/recoil/projectState.ts | 7 ++++++ src/recoil/state.ts | 5 +++++ 5 files changed, 55 insertions(+), 6 deletions(-) create mode 100644 src/recoil/projectState.ts diff --git a/src/components/issue/InfoBox.tsx b/src/components/issue/InfoBox.tsx index 5e0be6e..9cf5557 100644 --- a/src/components/issue/InfoBox.tsx +++ b/src/components/issue/InfoBox.tsx @@ -4,7 +4,10 @@ import { useRecoilState } from 'recoil'; import { modalState } from '@/recoil/state'; import SelectAssignee from '../modal/SelectAssignee'; import usePatch from '@/hooks/usePatch'; -import { UpdateIssueInfo } from '@/types/type'; +import { UpdateIssueInfo, ProjectInfo } from '@/types/type'; +import { projectState } from '@/recoil/projectState'; +import { contributerId } from '../../recoil/state'; +import useFetchProject from '@/hooks/useFetchProject'; interface InputProps { infoType: string; data: string; @@ -12,19 +15,50 @@ interface InputProps { isAssigned: number; } +const fetchProjectData = (data:any):ProjectInfo=>({ + projectId: data.projectId, + title: data.title, + adminName: data.adminName, + contributorNames: data.contributorNames + +}) + const InfoBox: React.FC = ({infoType, data, patchData, isAssigned}) => { const [isVisible, setVisiable] = useRecoilState(modalState); const [issueId, setIssueId] = useState(null); + const [projectId, setProjectId] = useState(null); + const [userId, setUserId] = useState(null); + const patchStatus = usePatch('issues/status', issueId ? Number(issueId) : 0) + const [projects, setProjects] = useRecoilState(projectState); + + const endpointP = '/projects'; + const {dataP, loadingP, errorP, refetch} = useFetchProject(endpointP, fetchProjectData, Number(userId)); + useEffect(() => { if (typeof window!== 'undefined'){ setIssueId(localStorage.getItem('issueId')); + setProjectId(localStorage.getItem('projectId')); + setUserId(localStorage.getItem('userId')); } - }, [setIssueId]); + if (dataP) { + setProjects(dataP); + } + + }, [dataP, setProjects, setIssueId, setProjectId]); + const contributerPerPj = projects + ? (projects as ProjectInfo[]) + .filter((item:ProjectInfo) => item.projectId===Number(projectId)) + .map((item:ProjectInfo) => item.contributorNames) + :[0, 1]; + + console.log(contributerPerPj); + + const handleAssignee = ()=>{ setVisiable(true); } diff --git a/src/hooks/useFetchProject.tsx b/src/hooks/useFetchProject.tsx index 834c0fc..5ee415a 100644 --- a/src/hooks/useFetchProject.tsx +++ b/src/hooks/useFetchProject.tsx @@ -1,6 +1,7 @@ import { useState, useEffect, useCallback } from 'react'; import { userIdState } from '@/recoil/userState'; import { useRecoilState } from 'recoil'; +import { projectState } from '@/recoil/projectState'; interface FetchResult{ dataP: T[] | null; @@ -14,19 +15,22 @@ const [dataP, setData] = useState(null); const [loadingP, setLoading] = useState(false); const [errorP, setError] = useState(null); const [userIdT, setUserId] = useRecoilState(userIdState); +const [projectData, setProjectData] = useRecoilState(projectState); const fetchData = useCallback(async () => { setLoading(true); try { const id = localStorage.getItem('userId'); const url = new URL(`${process.env.NEXT_PUBLIC_API_BASE_URL}${endpoint}?userId=${id}`); - const response = await fetch(url.toString()); + + if (!response.ok) { throw new Error('Network response was not ok'); } const result = await response.json(); setData(result); + setProjectData(result); setError(null); console.log(result); diff --git a/src/pages/project/index.tsx b/src/pages/project/index.tsx index 07d77b0..0547c07 100644 --- a/src/pages/project/index.tsx +++ b/src/pages/project/index.tsx @@ -2,8 +2,8 @@ import React, {useEffect, useState} from 'react'; import styled from 'styled-components'; import {useRouter} from 'next/router'; import NewProject from '@/components/modal/NewProject'; -import { useRecoilState} from 'recoil'; -import { modalState } from '@/recoil/state'; +import { useRecoilState } from 'recoil'; +import { modalState, contributerName } from '@/recoil/state'; import useFetchData from '@/hooks/useFetchData'; import useFetchProject from '@/hooks/useFetchProject'; import { User, ProjectInfo } from '@/types/type'; @@ -37,7 +37,6 @@ const Projects = () => { - const handleModal = ()=>{ setVisiable(true); } diff --git a/src/recoil/projectState.ts b/src/recoil/projectState.ts new file mode 100644 index 0000000..dc51407 --- /dev/null +++ b/src/recoil/projectState.ts @@ -0,0 +1,7 @@ +import { atom, useRecoilState } from 'recoil'; +import { ProjectInfo } from '@/types/type'; + +export const projectState = atom({ + key: 'projectState', + default: [] as ProjectInfo[], +}); \ No newline at end of file diff --git a/src/recoil/state.ts b/src/recoil/state.ts index cc6e3ed..3232a21 100644 --- a/src/recoil/state.ts +++ b/src/recoil/state.ts @@ -31,6 +31,11 @@ export const contributerName = atom({ default: [] }); +export const contributerNamePerPj = atom({ + key: 'contributerNamePerPj', + default: [] +}); + export const contributerId = atom({ key: 'contributerId', default: []