From 5fe16a7d29cb2c47c1f7c6a876ce83abe8a3cbc9 Mon Sep 17 00:00:00 2001 From: Gyuri <102032298+rangggu@users.noreply.github.com> Date: Thu, 2 Jan 2025 19:45:41 +0900 Subject: [PATCH] =?UTF-8?q?Revert=20"Revert=20"=EB=9E=9C=EB=94=A9=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=20=ED=8C=8C=ED=8B=B0=20?= =?UTF-8?q?=EB=A6=AC=EC=8A=A4=ED=8A=B8=EC=97=90=20=EB=93=9C=EB=9D=BC?= =?UTF-8?q?=EC=9D=B4=EB=B2=84=20=ED=94=84=EB=A1=9C=ED=95=84=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80""?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/driver.ts | 2 ++ .../LandingPage/PartyList/DriverBox/index.tsx | 35 +++++++++++++++++++ src/pages/LandingPage/PartyList/index.tsx | 30 ++++++++++++---- src/types/index.ts | 7 ++++ src/utils/index.ts | 12 +++++++ 5 files changed, 80 insertions(+), 6 deletions(-) create mode 100644 src/pages/LandingPage/PartyList/DriverBox/index.tsx diff --git a/src/api/driver.ts b/src/api/driver.ts index 1ec13ef5..77ca30d3 100644 --- a/src/api/driver.ts +++ b/src/api/driver.ts @@ -10,6 +10,8 @@ export const getRegionDriver = async ( true ); +export const getDriver = async () => await GET(`/driver/search`, true); + export const getDriverInfo = async (driverId: string | number) => await GET(`/driver/${driverId}`, true); diff --git a/src/pages/LandingPage/PartyList/DriverBox/index.tsx b/src/pages/LandingPage/PartyList/DriverBox/index.tsx new file mode 100644 index 00000000..d3876e4b --- /dev/null +++ b/src/pages/LandingPage/PartyList/DriverBox/index.tsx @@ -0,0 +1,35 @@ +import { memo, useCallback } from "react"; +import { useNavigate } from "react-router-dom"; +import { DriverData } from "@/types"; +import basicProfileImage from "@/assets/images/profileImage.png"; + +function DriverBox({ driverId, name, profileImg, region }: DriverData) { + const navigate = useNavigate(); + + const onClickHandler = useCallback(() => { + navigate(`/driver/profile/${driverId}`); + }, [driverId]); + + return ( +
+
+ {name} +
+ +
+
+
{`${region.length === 1 ? region : "다양한 지역"} ${name} 드라이버`}
+
+ ); +} + +export default memo(DriverBox); diff --git a/src/pages/LandingPage/PartyList/index.tsx b/src/pages/LandingPage/PartyList/index.tsx index d7e6aa57..3873311e 100644 --- a/src/pages/LandingPage/PartyList/index.tsx +++ b/src/pages/LandingPage/PartyList/index.tsx @@ -1,19 +1,31 @@ -import { memo, useCallback, useEffect, useState } from "react"; +import { memo, useCallback, useEffect, useMemo, useState } from "react"; import { useSelector } from "react-redux"; import { RootState } from "@/redux/store"; import { getPartyList } from "@/api/party"; -import { dateToString } from "@/utils"; -import { HeartParty } from "@/types"; +import { dateToString, shuffleArray } from "@/utils"; +import { DriverData, HeartParty } from "@/types"; import PartyBox from "./PartyBox"; import NoParty from "./NoParty"; +import { getDriver } from "@/api/driver"; +import DriverBox from "./DriverBox"; function PartyList() { const { region, nowDate, num, price } = useSelector( (state: RootState) => state.partyFilter ); const [partyData, setPartyData] = useState([]); + const [driverData, setDriverData] = useState([]); const [loading, setLoading] = useState(true); + const ramdomSeed = useMemo(() => { + const today = new Date(); + return ( + today.getFullYear() * 10000 + + (today.getMonth() + 1) * 100 + + today.getDate() + ); + }, []); + const getData = useCallback(async () => { const regionQuery = region === "모든 지역" ? "all" : region; const nowDateQuery = @@ -24,32 +36,38 @@ function PartyList() { const priceQuery = price; try { + const driverResult = await getDriver(); const result = await getPartyList( regionQuery, nowDateQuery, numQuery, priceQuery ); + + setDriverData(shuffleArray(driverResult.payload, ramdomSeed)); setPartyData(result.payload); } catch (e) { console.log(e); } finally { setLoading(false); } - }, [region, nowDate, num, price]); + }, [region, nowDate, num, price, ramdomSeed]); useEffect(() => { getData(); window.scrollTo({ top: 0 }); - }, [region, nowDate, num, price]); + }, [region, nowDate, num, price, ramdomSeed]); if (loading) return null; - if (partyData.length === 0) return ; + if (partyData.length === 0 && driverData.length === 0) return ; return (
{partyData.map((item) => ( ))} + {driverData.map((item) => ( + + ))}
); } diff --git a/src/types/index.ts b/src/types/index.ts index df073f1a..04a19938 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -142,6 +142,13 @@ export interface RegionDriverData { userNickname: string; } +export interface DriverData { + driverId: number; + name: string; + profileImg: string; + region: string[]; +} + export interface Message { type: string; userId: number; diff --git a/src/utils/index.ts b/src/utils/index.ts index 71e7d8f7..0748b50a 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,3 +1,5 @@ +import { DriverData } from "@/types"; + export function setScreenHeight() { const vh = window.innerHeight * 0.01; document.documentElement.style.setProperty("--vh", `${vh}px`); @@ -182,3 +184,13 @@ export const isIos = () => { UA.indexOf("ipod") > -1 ); }; + +export const shuffleArray = (array: DriverData[], seed: number) => { + const result = [...array]; + for (let i = result.length - 1; i > 0; i--) { + const randomIndex = Math.floor(seed % (i + 1)); + [result[i], result[randomIndex]] = [result[randomIndex], result[i]]; + seed = (seed * 9301 + 49297) % 233280; // 간단한 난수 생성 + } + return result; +};