From 656ebedd783822602f6a94f072f8504ae6ef6b23 Mon Sep 17 00:00:00 2001 From: nebulaBdj Date: Fri, 29 Mar 2024 18:10:04 +0900 Subject: [PATCH] =?UTF-8?q?[Fix]=20=EC=BD=94=EB=93=9C=20=EC=A0=95=EB=A0=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/Components/Molecules/FeedCategory.tsx | 69 ++--- .../Molecules/FeedCategorySelect.tsx | 265 ++++++++++-------- .../src/Components/Molecules/FeedContent.tsx | 41 ++- .../src/Components/Molecules/FeedSortBase.tsx | 121 ++++---- .../Components/Molecules/FeedTopCategory.tsx | 103 +++---- .../Components/Molecules/WeatherNavbar.tsx | 122 ++++---- .../src/Components/Organisms/FeedContents.tsx | 21 +- .../Components/Organisms/FeedSearchSort.tsx | 41 +-- .../src/Components/Organisms/MainOrganism.tsx | 11 +- .../src/app/mypage/page.tsx | 2 + 10 files changed, 411 insertions(+), 385 deletions(-) diff --git a/weatherfit_refactoring/src/Components/Molecules/FeedCategory.tsx b/weatherfit_refactoring/src/Components/Molecules/FeedCategory.tsx index c16bf45..060f7b3 100644 --- a/weatherfit_refactoring/src/Components/Molecules/FeedCategory.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/FeedCategory.tsx @@ -1,39 +1,40 @@ -"use client" -import ButtonStore, { ButtonStyle } from "../Atoms/Button/ButtonStore" -import { CategoryData } from "@/Store/CategoryData" -import IconStore, { IconStyle } from "../Atoms/Icon/IconStore"; -import FeedCategorySelect from "./FeedCategorySelect"; -import { CategoryControl } from "@/Store/CategoryControl"; +'use client' +import ButtonStore, { ButtonStyle } from '../Atoms/Button/ButtonStore' +import { CategoryData } from '@/Store/CategoryData' +import IconStore, { IconStyle } from '../Atoms/Icon/IconStore' +import FeedCategorySelect from './FeedCategorySelect' +import { CategoryControl } from '@/Store/CategoryControl' export default function FeedCategory() { - - const {categoryData} = CategoryData(); - const {categoryControl, setCategoryControl} = CategoryControl() + const { categoryData } = CategoryData() + const { categoryControl, setCategoryControl } = CategoryControl() - const tabBooleanControl = () => { - if(categoryControl == false) { - setCategoryControl(true); - } else { - setCategoryControl(false); - } + const tabBooleanControl = () => { + if (categoryControl == false) { + setCategoryControl(true) + } else { + setCategoryControl(false) } + } - - return ( - - - - ) -} \ No newline at end of file + return ( + + ) +} diff --git a/weatherfit_refactoring/src/Components/Molecules/FeedCategorySelect.tsx b/weatherfit_refactoring/src/Components/Molecules/FeedCategorySelect.tsx index f954acb..6459b73 100644 --- a/weatherfit_refactoring/src/Components/Molecules/FeedCategorySelect.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/FeedCategorySelect.tsx @@ -1,137 +1,162 @@ -import { CategoryData } from "@/Store/CategoryData" -import { CategorySelectData } from "@/Store/CategorySelectData"; -import { unstable_getStaticParams } from "next/dist/build/templates/pages"; -import { Dispatch, SetStateAction, useEffect, useState } from "react"; -import InputStore, { InputStyle } from "../Atoms/Input/InputStore"; +import { CategoryData } from '@/Store/CategoryData' +import { CategorySelectData } from '@/Store/CategorySelectData' +import { unstable_getStaticParams } from 'next/dist/build/templates/pages' +import { Dispatch, SetStateAction, useEffect, useState } from 'react' +import InputStore, { InputStyle } from '../Atoms/Input/InputStore' import { WeatherTempMax } from '@/Store/WeatherMaxTemp' import { WeatherTempMin } from '@/Store/WeatherMinTemp' -import { CategoryControl } from "@/Store/CategoryControl"; +import { CategoryControl } from '@/Store/CategoryControl' +export default function FeedCategorySelect() { + const { categoryData } = CategoryData() + const { setTempMin } = WeatherTempMin() + const { setTempMax } = WeatherTempMax() + const { categoryControl, setCategoryControl } = CategoryControl() + const { selectData, setSelectData } = CategorySelectData() -export default function FeedCategorySelect () { + const [categoryTitleStyle, setCategoryTitleStyle] = useState('') + const [categoryList, setCategoryList] = useState([]) + const [localTempMax, setLocalTempMax] = useState(null) + const [localTempMin, setLocalTempMin] = useState(null) - const {categoryData} = CategoryData(); - const { setTempMin } = WeatherTempMin(); - const { setTempMax } = WeatherTempMax(); - const {categoryControl, setCategoryControl} = CategoryControl(); - const {selectData, setSelectData} = CategorySelectData(); + //카테고리에 맞춰서 하위 카테고리 불러오기 + const selectCategory = (selectedCategory: string) => { + console.log('선택한 카테고리 타이틀', selectedCategory) + const filtering: TabMenu[] = categoryData.filter( + categorydata => categorydata.value == selectedCategory, + ) + setCategoryList(filtering[0].selectLists) + } - const [categoryTitleStyle, setCategoryTitleStyle] = useState(""); - const [categoryList, setCategoryList] = useState([]); - const [localTempMax, setLocalTempMax] = useState(null) - const [localTempMin, setLocalTempMin] = useState(null) + //하위 카테고리 선택시 검색 데이터에 넣기 + const categorySearch = (inputData: string) => { + setSelectData([...selectData, inputData]) + } - //카테고리에 맞춰서 하위 카테고리 불러오기 - const selectCategory = (selectedCategory: string) => { - console.log("선택한 카테고리 타이틀", selectedCategory); - const filtering:TabMenu[] = categoryData.filter((categorydata) => categorydata.value == selectedCategory) - setCategoryList(filtering[0].selectLists) - } + //검색 데이터에서 삭제 버튼을 누른 카테고리 없애기 + const selectCancle = (selectCancle: string) => { + const filterCansleCategory: string[] = selectData.filter( + selectdata => selectdata != selectCancle, + ) + console.log('삭제할 카테고리', selectCancle) + setSelectData(filterCansleCategory) + } - //하위 카테고리 선택시 검색 데이터에 넣기 - const categorySearch = (inputData : string) => { - setSelectData([...selectData, inputData]) + const searchCategory = async () => { + // 상위 컴포넌트에서 함수 받아온후 바로 실행해버리자 + console.log(selectData) + let url: string = 'https://www.jerneithe.site//board/search?categories=' + for (let i = 0; i < selectData.length; i++) { + url += selectData[i] } + console.log(url) + const callSearchData = await fetch(url, { + method: 'GET', + }) + + const callSearchDataToJson = await callSearchData.json() - //검색 데이터에서 삭제 버튼을 누른 카테고리 없애기 - const selectCancle = (selectCancle : string) => { - const filterCansleCategory:string[] = selectData.filter((selectdata) => selectdata != selectCancle) - console.log("삭제할 카테고리", selectCancle); - setSelectData(filterCansleCategory) + console.log('카테고리 검색 데이터', callSearchDataToJson) + + if (localTempMax != undefined) { + setTempMax(localTempMax) } - const searchCategory = async() => { - // 상위 컴포넌트에서 함수 받아온후 바로 실행해버리자 - console.log(selectData) - let url:string = "https://www.jerneithe.site//board/search?categories=" - for (let i = 0; i < selectData.length; i++){ - url += selectData[i] - } - console.log(url) - const callSearchData = await fetch(url,{ - method: "GET" - }) + if (localTempMin != undefined) { + setTempMin(localTempMin) + } - const callSearchDataToJson = await callSearchData.json() + setCategoryControl(false) + } - console.log("카테고리 검색 데이터", callSearchDataToJson) - - if (localTempMax != undefined) { - setTempMax(localTempMax) - } + return ( +
+
+ + 카테고리 +
- if (localTempMin != undefined) { - setTempMin(localTempMin) - } +
+ {categoryData.map(categoryTitle => { + return ( + + ) + })} +
- setCategoryControl(false); - - } +
+ {categoryList && + categoryList.map(categoryList => { + return ( + + ) + })} +
- - return ( -
- -
- - 카테고리 -
- -
- {categoryData.map((categoryTitle)=>{ - return( - - ) - })} -
- -
- {categoryList && - categoryList.map((categoryList)=>{ - return( - - ) - }) - } -
- -
-

온도 설정 :

- ) => setLocalTempMax(parseInt(e.target.value))} - value={localTempMax || ""} - placeholderContents="최고온도를 입력해주세요." - style=" w-[70px] h-[30px] text-[13px] ml-2 mr-1" - />℃ - ) => setLocalTempMin(parseInt(e.target.value))} - value={localTempMin || ""} - placeholderContents="최저온도를 입력해주세요." - style=" w-[70px] h-[30px] text-[13px] ml-2 mr-1" - />℃ -
-
- {selectData.map((data, index)=>{ - return( -

- {data} - -

- ) - })} -
-
- - -
-
- ) -} \ No newline at end of file +
+

온도 설정 :

+ ) => + setLocalTempMax(parseInt(e.target.value)) + } + value={localTempMax || ''} + placeholderContents="최고온도를 입력해주세요." + style=" w-[70px] h-[30px] text-[13px] ml-2 mr-1" + /> + ℃ + ) => + setLocalTempMin(parseInt(e.target.value)) + } + value={localTempMin || ''} + placeholderContents="최저온도를 입력해주세요." + style=" w-[70px] h-[30px] text-[13px] ml-2 mr-1" + /> + ℃ +
+
+ {selectData.map((data, index) => { + return ( +

+ {data} + +

+ ) + })} +
+
+ + +
+
+ ) +} diff --git a/weatherfit_refactoring/src/Components/Molecules/FeedContent.tsx b/weatherfit_refactoring/src/Components/Molecules/FeedContent.tsx index a360e44..5bf11ad 100644 --- a/weatherfit_refactoring/src/Components/Molecules/FeedContent.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/FeedContent.tsx @@ -7,53 +7,48 @@ import { AuthTokenStore } from '@/Store/AuthToken' import { AuthUserNickStore } from '@/Store/AuthUserNick' import { FeedData } from '@/Store/FeedData' - interface Props { DataforFeed: FEEDDATA } export default function FeedContent({ DataforFeed }: Props) { - const {feedData, setFeedData} = FeedData() - const date = new Date(DataforFeed.createDate); - const createDate:string = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDay()}`; + const { feedData, setFeedData } = FeedData() + const date = new Date(DataforFeed.createDate) + const createDate: string = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDay()}` const { accesstoken } = AuthTokenStore() const { userNick } = AuthUserNickStore() - const likeChecker = ( likelist:LIKE[], nickName:string | null ) => { - if( likelist.some((list) => list.nickName === nickName ) ) { + const likeChecker = (likelist: LIKE[], nickName: string | null) => { + if (likelist.some(list => list.nickName === nickName)) { return true } else { return false } } - const isUserLiked:boolean = likeChecker( DataforFeed.likelist, userNick ); - + const isUserLiked: boolean = likeChecker(DataforFeed.likelist, userNick) - const clickLike = async() => { + const clickLike = async () => { const sendToLikeAPI = `https://www.jerneithe.site/board/like/${DataforFeed.boardId}` try { const res = await fetch(sendToLikeAPI, { - method: "POST", - headers: { - "Content-Type": "application/json", - Authorization: "Bearer " + accesstoken, - } + method: 'POST', + headers: { + 'Content-Type': 'application/json', + Authorization: 'Bearer ' + accesstoken, + }, }) if (res.ok) { - console.log("좋아요 변경 성공"); + console.log('좋아요 변경 성공') // 성공적으로 처리된 경우 추가적인 작업 수행 } else { // throw new Error('Network response was not ok.') - console.error("좋아요 변경 실패:", res.status); + console.error('좋아요 변경 실패:', res.status) // 실패한 경우에 대한 처리 } - } catch (error) { - console.error("좋아요 변경 실패:", error); + console.error('좋아요 변경 실패:', error) } - - } return ( @@ -98,11 +93,7 @@ export default function FeedContent({ DataforFeed }: Props) {
{ - const sorted = [...feedData].sort((a, b) => b.likeCount - a.likeCount); - setFeedData(sorted); - }; - - const sortByNewest = () => { - const sorted = [...feedData].sort((a, b) => { - const dateA = a.createDate ? new Date(a.createDate) : new Date(); - const dateB = b.createDate ? new Date(b.createDate) : new Date(); - return dateB.getTime() - dateA.getTime(); // 최신 날짜 순으로 정렬 - }); - setFeedData(sorted); - }; - - const sortByOldest = () => { - const sorted = [...feedData].sort((a, b) => { - const dateA = a.createDate ? new Date(a.createDate) : new Date(); - const dateB = b.createDate ? new Date(b.createDate) : new Date(); - return dateA.getTime() - dateB.getTime(); // 오래된 날짜 순으로 정렬 - }); - setFeedData(sorted); - }; - - - const handleSort = (event: React.ChangeEvent) => { - console.log("정렬할 기준", event.target.value); - let sortTitle:string = event.target.value; - - if(sortTitle == "최신순") { - setFeedSort("NOW"); - sortByNewest(); - } - else if(sortTitle == "추천순"){ - setFeedSort("HOT"); - sortByLikes(); - - } - else if(sortTitle == "오래된순"){ - setFeedSort("OLD"); - sortByOldest(); - } +'use client' +import { FeedSort } from '@/Store/FeedSort' +import { FeedData } from '@/Store/FeedData' + +export default function FeedSortBase() { + const { feedSort, setFeedSort } = FeedSort() + const { feedData, setFeedData } = FeedData() + + const sortByLikes = () => { + const sorted = [...feedData].sort((a, b) => b.likeCount - a.likeCount) + setFeedData(sorted) + } + + const sortByNewest = () => { + const sorted = [...feedData].sort((a, b) => { + const dateA = a.createDate ? new Date(a.createDate) : new Date() + const dateB = b.createDate ? new Date(b.createDate) : new Date() + return dateB.getTime() - dateA.getTime() // 최신 날짜 순으로 정렬 + }) + setFeedData(sorted) + } + + const sortByOldest = () => { + const sorted = [...feedData].sort((a, b) => { + const dateA = a.createDate ? new Date(a.createDate) : new Date() + const dateB = b.createDate ? new Date(b.createDate) : new Date() + return dateA.getTime() - dateB.getTime() // 오래된 날짜 순으로 정렬 + }) + setFeedData(sorted) + } + + const handleSort = (event: React.ChangeEvent) => { + console.log('정렬할 기준', event.target.value) + let sortTitle: string = event.target.value + + if (sortTitle == '최신순') { + setFeedSort('NOW') + sortByNewest() + } else if (sortTitle == '추천순') { + setFeedSort('HOT') + sortByLikes() + } else if (sortTitle == '오래된순') { + setFeedSort('OLD') + sortByOldest() } - - return ( -
- -
- ) - -} \ No newline at end of file + } + + return ( +
+ +
+ ) +} diff --git a/weatherfit_refactoring/src/Components/Molecules/FeedTopCategory.tsx b/weatherfit_refactoring/src/Components/Molecules/FeedTopCategory.tsx index 223fdcc..dff27c9 100644 --- a/weatherfit_refactoring/src/Components/Molecules/FeedTopCategory.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/FeedTopCategory.tsx @@ -1,53 +1,62 @@ -"use client" -import { useEffect, useState } from "react"; -import BestCategory from "../../../public/dummy_data/bestcategory.json"; -import ButtonStore, { ButtonStyle } from "../Atoms/Button/ButtonStore"; -import { FeedData } from "@/Store/FeedData"; +'use client' +import { useEffect, useState } from 'react' +import BestCategory from '../../../public/dummy_data/bestcategory.json' +import ButtonStore, { ButtonStyle } from '../Atoms/Button/ButtonStore' +import { FeedData } from '@/Store/FeedData' -export default function FeedTopCategory(){ - const {feedData, setFeedData} = FeedData() - const [topCategory, setTopCategory] = useState([]) +export default function FeedTopCategory() { + const { feedData, setFeedData } = FeedData() + const [topCategory, setTopCategory] = useState([]) - //임시 top5 카테고리 - const topCate:string[] = BestCategory.best_category_data - - //게시글 백엔드 복구 후 실행 - const callTopCategory = async() => { - const callTop = await fetch("https://www.jerneithe.site/board/tops", { - method: "GET" - }); - const toJson = await callTop.json(); - console.log(toJson) ; - setTopCategory(toJson.data); - } + //임시 top5 카테고리 + const topCate: string[] = BestCategory.best_category_data - useEffect(()=>{ - // callTopCategory() - },[]) + //게시글 백엔드 복구 후 실행 + const callTopCategory = async () => { + const callTop = await fetch('https://www.jerneithe.site/board/tops', { + method: 'GET', + }) + const toJson = await callTop.json() + console.log(toJson) + setTopCategory(toJson.data) + } - const gotoCategory = async(restopCategory:string) => { - console.log("클릭한 카테고리 검색으로 이동") - const clickCategoryData = await fetch(`https://www.jerneithe.site/board/search?categories=${restopCategory}`,{ - method: "GET" - }) - const clickCategoryDataToJson:FEEDDATA[] = await clickCategoryData.json() - setFeedData(clickCategoryDataToJson) - } + useEffect(() => { + // callTopCategory() + }, []) - return ( -
-
-

오늘의 카테고리 :

-
- {topCate.concat(topCate).map((topcategory, index)=>{ - return( - gotoCategory(topcategory)} > - {topcategory} - - ) - })} -
-
-
+ const gotoCategory = async (restopCategory: string) => { + console.log('클릭한 카테고리 검색으로 이동') + const clickCategoryData = await fetch( + `https://www.jerneithe.site/board/search?categories=${restopCategory}`, + { + method: 'GET', + }, ) -} \ No newline at end of file + const clickCategoryDataToJson: FEEDDATA[] = await clickCategoryData.json() + setFeedData(clickCategoryDataToJson) + } + + return ( +
+
+

+ 오늘의 카테고리 : +

+
+ {topCate.concat(topCate).map((topcategory, index) => { + return ( + gotoCategory(topcategory)}> + {topcategory} + + ) + })} +
+
+
+ ) +} diff --git a/weatherfit_refactoring/src/Components/Molecules/WeatherNavbar.tsx b/weatherfit_refactoring/src/Components/Molecules/WeatherNavbar.tsx index 9c6eccd..bc2df6d 100644 --- a/weatherfit_refactoring/src/Components/Molecules/WeatherNavbar.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/WeatherNavbar.tsx @@ -1,4 +1,4 @@ -"use client" +'use client' import { useEffect, useState } from 'react' import Image from 'next/image' //Zustand @@ -15,11 +15,11 @@ export default function WeatherNavbar() { const { temperatureMin, setTempMin } = WeatherTempMin() const { temperatureMax, setTempMax } = WeatherTempMax() const { weatherIcon, setIcon } = WeatherIcon() - const [ latitude_state, setLatitude ] = useState(); - const [ longitude_state, setLongitude ] = useState(); + const [latitude_state, setLatitude] = useState() + const [longitude_state, setLongitude] = useState() const [address, setAddress] = useState() - // 렌더링 속도 비교해보기 + // 렌더링 속도 비교해보기 // const getLocation = async() => { // try { // // 위치 노출이 허용되어 있는지 확인하고 현재 위치 가져오기 @@ -32,10 +32,10 @@ export default function WeatherNavbar() { // // 위도와 경도 가져오기 // setLatitude(position.coords.latitude) // setLongitude(position.coords.longitude) - + // } catch (error) { // console.error("Error getting location:", error); - // } + // } // } // const getWeather = async() => { @@ -45,7 +45,7 @@ export default function WeatherNavbar() { // `https://api.openweathermap.org/data/2.5/weather?lat=${latitude_state}&lon=${longitude_state}&appid=${API_KEY}&units=metric` // ); // const weatherData = await weatherResponse.json(); - + // // 날씨 정보 저장하기 // setTemp(weatherData.main.temp.toFixed(1)); // setTempMax(weatherData.main.temp_max.toFixed(1)); @@ -72,66 +72,64 @@ export default function WeatherNavbar() { // " " + // addressData.documents[0].address.region_2depth_name, // ); - + // } catch (error) { // console.error("Error getting location:", error); // } // } - useEffect(()=>{ - const getLocation = async () => { - try { - const position = await new Promise( - (resolve, reject) => { - navigator.geolocation.getCurrentPosition(resolve, reject); - }, - ); - - const latitude = position.coords.latitude; - // console.log("위도", latitude); - const longitude = position.coords.longitude; - // console.log("경도", longitude); - - const weatherResponse = await fetch( - `https://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longitude}&appid=${API_KEY}&units=metric`, - ); - const weatherData = await weatherResponse.json(); - setTemp(weatherData.main.temp.toFixed(1)); - // max = weatherData.main.temp_max.toFixed(1); - setTempMax(weatherData.main.temp_max.toFixed(1)); - setTempMin(weatherData.main.temp_min.toFixed(1)); - // setWeat(weatherData.weather[0].main); - setIcon(weatherData.weather[0].icon); - - // console.log("데이터", weatherData); - // console.log(`온도 : ${temp} ,최고온도 ${max},최저온도 ${min}, 날씨 : ${weat}`); - - - const addressResponse = await fetch( - `https://dapi.kakao.com/v2/local/geo/coord2address.json?x=${longitude}&y=${latitude}`, - { - method: "GET", - headers: { Authorization: `KakaoAK ${KAKAO_API_KEY}` }, - }, - ); - const addressData = await addressResponse.json(); - setAddress( - addressData.documents[0].address.region_1depth_name + - " " + - addressData.documents[0].address.region_2depth_name, - ); - - // console.log(address); - } catch (error) { - console.error("Error getting location:", error); - } - }; - - getLocation(); - // getWeather(); - // getAddress(); - - }, []); + useEffect(() => { + const getLocation = async () => { + try { + const position = await new Promise( + (resolve, reject) => { + navigator.geolocation.getCurrentPosition(resolve, reject) + }, + ) + + const latitude = position.coords.latitude + // console.log("위도", latitude); + const longitude = position.coords.longitude + // console.log("경도", longitude); + + const weatherResponse = await fetch( + `https://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longitude}&appid=${API_KEY}&units=metric`, + ) + const weatherData = await weatherResponse.json() + setTemp(weatherData.main.temp.toFixed(1)) + // max = weatherData.main.temp_max.toFixed(1); + setTempMax(weatherData.main.temp_max.toFixed(1)) + setTempMin(weatherData.main.temp_min.toFixed(1)) + // setWeat(weatherData.weather[0].main); + setIcon(weatherData.weather[0].icon) + + // console.log("데이터", weatherData); + // console.log(`온도 : ${temp} ,최고온도 ${max},최저온도 ${min}, 날씨 : ${weat}`); + + const addressResponse = await fetch( + `https://dapi.kakao.com/v2/local/geo/coord2address.json?x=${longitude}&y=${latitude}`, + { + method: 'GET', + headers: { Authorization: `KakaoAK ${KAKAO_API_KEY}` }, + }, + ) + const addressData = await addressResponse.json() + setAddress( + addressData.documents[0].address.region_1depth_name + + ' ' + + addressData.documents[0].address.region_2depth_name, + ) + + // console.log(address); + } catch (error) { + console.error('Error getting location:', error) + } + } + + getLocation() + // getWeather(); + // getAddress(); + }, []) return (
diff --git a/weatherfit_refactoring/src/Components/Organisms/FeedContents.tsx b/weatherfit_refactoring/src/Components/Organisms/FeedContents.tsx index 81ff901..3b8e4f3 100644 --- a/weatherfit_refactoring/src/Components/Organisms/FeedContents.tsx +++ b/weatherfit_refactoring/src/Components/Organisms/FeedContents.tsx @@ -1,31 +1,30 @@ 'use client' -import { useEffect, useState } from 'react'; +import { useEffect, useState } from 'react' import FeedContent from '../Molecules/FeedContent' import { FeedData } from '@/Store/FeedData' import { WeatherTempMax } from '@/Store/WeatherMaxTemp' import { WeatherTempMin } from '@/Store/WeatherMinTemp' interface Props { - response : FEEDDATA[] + response: FEEDDATA[] } -export default function FeedContents({response}:Props) { - const {feedData, setFeedData} = FeedData() +export default function FeedContents({ response }: Props) { + const { feedData, setFeedData } = FeedData() const { temperatureMin } = WeatherTempMin() const { temperatureMax } = WeatherTempMax() - useEffect(() => { - console.log("받아온 feedData", response) - const copyResponse:FEEDDATA[] = [...response] + console.log('받아온 feedData', response) + const copyResponse: FEEDDATA[] = [...response] const filterByTemp = copyResponse.filter( - (copyRes) => - copyRes.temperature >= temperatureMin && - copyRes.temperature <= temperatureMax + copyRes => + copyRes.temperature >= temperatureMin && + copyRes.temperature <= temperatureMax, ) setFeedData(response) - }, []); + }, []) return (
diff --git a/weatherfit_refactoring/src/Components/Organisms/FeedSearchSort.tsx b/weatherfit_refactoring/src/Components/Organisms/FeedSearchSort.tsx index cfbbe9a..5dab733 100644 --- a/weatherfit_refactoring/src/Components/Organisms/FeedSearchSort.tsx +++ b/weatherfit_refactoring/src/Components/Organisms/FeedSearchSort.tsx @@ -1,23 +1,24 @@ -import ButtonStore, { ButtonStyle } from "../Atoms/Button/ButtonStore"; +import ButtonStore, { ButtonStyle } from '../Atoms/Button/ButtonStore' -import FeedLogo from "../Molecules/FeedLogo"; -import FeedSearch from "../Molecules/FeedSearch"; -import FeedTopCategory from "../Molecules/FeedTopCategory"; -import WeatherNavbar from "../Molecules/WeatherNavbar"; -import FeedCategory from "../Molecules/FeedCategory"; -import FeedSortBase from "../Molecules/FeedSortBase"; +import Header from '../Molecules/Header' +import FeedLogo from '../Molecules/FeedLogo' +import FeedSearch from '../Molecules/FeedSearch' +import FeedTopCategory from '../Molecules/FeedTopCategory' +import WeatherNavbar from '../Molecules/WeatherNavbar' +import FeedCategory from '../Molecules/FeedCategory' +import FeedSortBase from '../Molecules/FeedSortBase' -export default function FeedSearchSort(){ - - return ( +export default function FeedSearchSort() { + return (
- - -
) -} \ No newline at end of file +
+ +
+ ) +} diff --git a/weatherfit_refactoring/src/Components/Organisms/MainOrganism.tsx b/weatherfit_refactoring/src/Components/Organisms/MainOrganism.tsx index 2971436..031b696 100644 --- a/weatherfit_refactoring/src/Components/Organisms/MainOrganism.tsx +++ b/weatherfit_refactoring/src/Components/Organisms/MainOrganism.tsx @@ -1,5 +1,6 @@ 'use client' +import TextStore, { TextStyle } from '../Atoms/Text/TextStore' import { useEffect, useState } from 'react' import { WeatherTempMax } from '@/Store/WeatherMaxTemp' import { WeatherTempMin } from '@/Store/WeatherMinTemp' @@ -40,15 +41,19 @@ export default function MainOrganism() { return ( <> -
다른 캐스터들은 이렇게 입었어요!
-
+
+ + 다른 캐스터들은 이렇게 입었어요! + crown - BEST 3 + BEST 3
diff --git a/weatherfit_refactoring/src/app/mypage/page.tsx b/weatherfit_refactoring/src/app/mypage/page.tsx index 023b0bd..3b8678f 100644 --- a/weatherfit_refactoring/src/app/mypage/page.tsx +++ b/weatherfit_refactoring/src/app/mypage/page.tsx @@ -4,6 +4,7 @@ import React, { useEffect, useState } from 'react' import ProfileInfo from '@/Components/Molecules/ProfileInfo' import ProfileHeader from '@/Components/Organisms/ProfileHeader' import ProfileBoard from '@/Components/Organisms/ProfileBoard' +import NavBar from '@/Components/Molecules/NavBar' import { AuthTokenStore } from '@/Store/AuthToken' import { LoadingStore } from '@/Store/Loading' import { CheckStore } from '@/Store/Check' @@ -112,6 +113,7 @@ export default function Mypage() { /> )} + {/* {loading ? ( ) : (