From 411b8d9f7b28dbd1856ddcc254843c0823aca38b Mon Sep 17 00:00:00 2001
From: gaeon <rkdjs1104@ajou.ac.kr>
Date: Sun, 10 Dec 2023 13:34:46 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20my=20channel=20useContext=EC=82=AC?=
=?UTF-8?q?=EC=9A=A9=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/calendar/calendar.js | 16 ++--------------
src/components/channel/addNotice.js | 6 ++++--
src/components/channel/existingChannel.js | 3 ++-
src/components/channel/iconModal.js | 6 ++++--
src/components/channel/myChannelModal.js | 1 -
src/components/channel/pictureModal.js | 7 ++++---
src/components/search.js | 19 +++++++++++++++----
7 files changed, 31 insertions(+), 27 deletions(-)
diff --git a/src/components/calendar/calendar.js b/src/components/calendar/calendar.js
index 8973202..bb768a9 100644
--- a/src/components/calendar/calendar.js
+++ b/src/components/calendar/calendar.js
@@ -100,11 +100,11 @@ const MySchedulerApp = () => {
const closeScheduleListModal = () => {
setScheduleListModalOpen(false);
};
+
const handleSaveEvent = async(formData) => {
try{
if (formData.endTime < formData.startTime) {
alert('종료 시간은 시작 시간보다 늦어야 합니다.');
- return;
}
const jsonData=JSON.stringify(formData);
console.log('Sending data to the server:', jsonData);
@@ -156,8 +156,6 @@ const MySchedulerApp = () => {
for (const backendData of data) {
const startDate = new Date(backendData.date);
-
- // "14:00" 형식의 문자열을 받아 현재 날짜에 추가
const startTimeParts = backendData.startTime.split(':');
const endTimeParts = backendData.endTime.split(':');
const startTime = new Date(startDate);
@@ -176,8 +174,6 @@ const MySchedulerApp = () => {
title: backendData.title,
color:clr,
content: backendData.content
-
- //comment: backendData.Description
});
}
@@ -406,21 +402,13 @@ const CustomEditItem = (props) => {
<MonthView />
</Scheduler>
- {/* <span className="buttonhidden">시간표</span> */}
</div>
<ScheduleAddModal
isOpen={isModalOpen}
onClose={closeModal}
onSave={handleSaveEvent}
/>
-
-
- {/* <ScheduleDeleteModal
- isOpen={isDeModalOpen}
- onClose={closeDeModal}
- onDelete={handleChange}
-
- /> */}
+
<ScheduleInquiryModal
isOpen={isInModalOpen}
onClose={closeInModal}
diff --git a/src/components/channel/addNotice.js b/src/components/channel/addNotice.js
index dc20385..f2300dd 100644
--- a/src/components/channel/addNotice.js
+++ b/src/components/channel/addNotice.js
@@ -1,7 +1,8 @@
-import React, {useState} from 'react';
+import React, {useState, useContext} from 'react';
import addNoticeStyles from "./addNotice.module.css";
-
+import { SearchContext } from '../search';
const AddNotice = ({ isOpen, onClose }) => {
+ const {setfetchCount}=useContext(SearchContext);
const [formData, setFormData] = useState({
title: '',
content: '',
@@ -52,6 +53,7 @@ const AddNotice = ({ isOpen, onClose }) => {
if (response.ok) {
// 성공적으로 공지가 생성됨
alert('새로운 공지가 성공적으로 생성되었습니다.');
+ setfetchCount( prevNum=> (prevNum+1));
onClose();
} else {
// 오류 처리
diff --git a/src/components/channel/existingChannel.js b/src/components/channel/existingChannel.js
index f9f7d5a..480a703 100644
--- a/src/components/channel/existingChannel.js
+++ b/src/components/channel/existingChannel.js
@@ -3,7 +3,7 @@ import { useNavigate } from 'react-router-dom';
import existingStyles from './existingChannel.module.css'
import Channel from './channel';
import AddNotice from './addNotice';
-
+// import { SearchContext } from '../search';
import ChangeIcon from './iconModal';
import ChangePicture from './pictureModal';
@@ -13,6 +13,7 @@ const ExistingChannel=({isOpen, onClose, data})=>{
const { userData } = useContext(AuthContext);
const [changePicture, setChangePicture]=useState('');
const [changeIcon, setChangeIcon]=useState('');
+ // const {setfetchCount}=useContext(SearchContext);
const openModal=()=>{
setIsModal(true);
}
diff --git a/src/components/channel/iconModal.js b/src/components/channel/iconModal.js
index ef5a1e3..e154d92 100644
--- a/src/components/channel/iconModal.js
+++ b/src/components/channel/iconModal.js
@@ -1,8 +1,9 @@
-import React, { useState } from 'react';
+import React, { useState, useContext} from 'react';
import iconStyles from './iconModal.module.css';
-
+import { SearchContext } from '../search';
const ChangeIcon=({ isOpen, onClose})=> {
const [image, setImage] = useState(null);
+ const {setfetchCount}=useContext(SearchContext);
const handleImageChange = (e) => {
@@ -34,6 +35,7 @@ const ChangeIcon=({ isOpen, onClose})=> {
const successData = await response.json();
console.log(successData);
alert('채널 프로필 수정을 성공하였습니다.');
+ setfetchCount( prevNum=> (prevNum+1));
onClose();
// 프로필 수정 후 로직 (예: 화면 갱신 등)
} catch (error) {
diff --git a/src/components/channel/myChannelModal.js b/src/components/channel/myChannelModal.js
index e8c473b..fd17db3 100644
--- a/src/components/channel/myChannelModal.js
+++ b/src/components/channel/myChannelModal.js
@@ -2,7 +2,6 @@ import React, {useState, useEffect} from 'react';
import { useNavigate } from 'react-router-dom';
import modalStyles from "./myChannelModal.module.css";
import CreateChannel from './createChannel'
-
const MyChannelModal=({isOpen, onClose})=>{
const [IsCreateModal, setCreateModal]=useState(false);
const openCreateModal=()=>{
diff --git a/src/components/channel/pictureModal.js b/src/components/channel/pictureModal.js
index b73c276..3419e2c 100644
--- a/src/components/channel/pictureModal.js
+++ b/src/components/channel/pictureModal.js
@@ -1,9 +1,9 @@
-import React, { useState } from 'react';
+import React, { useState, useContext } from 'react';
import pictureStyles from './pictureModal.module.css';
-
+import { SearchContext } from '../search';
const ChangePicture=({ isOpen, onClose})=> {
const [image, setImage] = useState(null);
-
+ const {setfetchCount}=useContext(SearchContext);
const handleImageChange = (e) => {
const selectedImage = e.target.files[0];
@@ -34,6 +34,7 @@ const ChangePicture=({ isOpen, onClose})=> {
const successData = await response.json();
console.log(successData);
alert('채널 배경 사진 수정을 성공하였습니다.');
+ setfetchCount( prevNum=> (prevNum+1));
onClose();
// 프로필 수정 후 로직 (예: 화면 갱신 등)
diff --git a/src/components/search.js b/src/components/search.js
index 128eae7..f90cfff 100644
--- a/src/components/search.js
+++ b/src/components/search.js
@@ -1,10 +1,10 @@
-import React, { useState } from 'react';
+import React, { useState, createContext, useEffect } from 'react';
import { useNavigate } from "react-router-dom";
import searchStyles from './search.module.css';
import CreateRecruit from './recruit/createRecruit';
import MyChannelModal from './channel/myChannelModal';
import ExistingChannel from './channel/existingChannel';
-
+export const SearchContext = createContext();
function Search({ currentPage, onUrlGenerated, onFirstQueryString, onSecondQueryString }){
const [isModalOpen, setIsModalOpen] = useState(false);
const [searchTerm, setSearchTerm] = useState('');
@@ -12,7 +12,12 @@ function Search({ currentPage, onUrlGenerated, onFirstQueryString, onSecondQuery
const [sortType, setSortType] = useState('');
const [haveChannel, sethaveChannel]=useState(true);
const [myChannelData, setmyChannelData]=useState('');
-
+ const [fetchCount, setfetchCount] = useState(0);
+ const searchValue = {
+ fetchCount,
+ setfetchCount,
+ };
+
const navigate = useNavigate();
const openModal = () => {
@@ -51,7 +56,10 @@ function Search({ currentPage, onUrlGenerated, onFirstQueryString, onSecondQuery
console.error('Error fetching weekly schedules:', error);
}
};
-
+ useEffect(() => {
+
+ fetchChannelData();
+ }, [fetchCount]);
const handleSearch = () => {
let searchURL = `${currentPage}/search`;
let firstQueryString = '?';
@@ -142,12 +150,15 @@ function Search({ currentPage, onUrlGenerated, onFirstQueryString, onSecondQuery
{currentPage === 'recruits' && (
<CreateRecruit isOpen={isModalOpen} onClose={closeModal}/>
)}
+
{currentPage === 'subscribes' && (!haveChannel)&&(
<MyChannelModal isOpen={isModalOpen} onClose={closeModal}/>
)}
+ <SearchContext.Provider value={searchValue}>
{currentPage==='subscribes' && (haveChannel) &&(
<ExistingChannel isOpen={isModalOpen} onClose={closeModal} data={myChannelData}/>
)}
+ </SearchContext.Provider>
</div>
)
--
GitLab