Skip to content

Commit

Permalink
feat: connect resort api in discovery detail page
Browse files Browse the repository at this point in the history
  • Loading branch information
Najeong-Kim committed Nov 2, 2024
1 parent 04533ee commit 70eefdd
Show file tree
Hide file tree
Showing 7 changed files with 37 additions and 26 deletions.
2 changes: 1 addition & 1 deletion src/entities/discovery/model/index.ts
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
export { DiscoveryData } from './constants';
export type { Weather, DuplicatedWeeklyWeather, Discovery, Vote, WeeklyWeather, WeatherResponse, Resort } from './model';
export type { Weather, Discovery, Vote, WeeklyWeather, WeatherResponse, Resort, Url } from './model';
10 changes: 6 additions & 4 deletions src/entities/discovery/model/model.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,17 @@ export type DuplicatedWeeklyWeather = {
};
};

export type Url = {
bus: string;
homepage: string;
};

export type Discovery = {
id: number;
name: string;
map: string;
slope: number | null;
url: {
bus: string;
homepage: string;
};
url: Url;
weather: {
weather: Weather;
temperature: number;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// eslint-disable-next-line boundaries/element-types
import type { Weather } from "@/entities/discovery";

const weatherDescription = {
Expand Down
8 changes: 5 additions & 3 deletions src/views/discovery-detail/ui/discovery-detail-page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ const DiscoveryDetailPage = ({ params }: { params: { resortId: string } }) => {
const discovery = DiscoveryData.find(
(discovery) => discovery.id === +params?.resortId
) as Discovery;
const { data: resortsData } = useQuery(discoveryApi.resortQueries.list());
const resort = resortsData?.find((resort) => resort.resortId === +params?.resortId);
const { data: voteData } = useQuery(discoveryApi.discoveryQueries.vote(+params?.resortId));
const data = RESORT_DOMAIN[discovery?.map as keyof typeof RESORT_DOMAIN];
const [selectedTab, setSelectedTab] = useState('webcam');
Expand Down Expand Up @@ -72,12 +74,12 @@ const DiscoveryDetailPage = ({ params }: { params: { resortId: string } }) => {
}
}, [isPositive, mutateAsync, params?.resortId]);

if (!discovery) return;
if (!discovery || !resort) return;

return (
<div className={cn('size-full')}>
<Header resortName={discovery.name} hasBackButton hasShareButton />
<DiscoverySummary {...discovery} />
<Header resortName={resort.name} hasBackButton hasShareButton />
<DiscoverySummary {...resort} {...discovery.url} />
<ul className={cn('relative z-10 flex size-full h-[53px] bg-white')}>
{DiscoveryContentTabList.map((tab) => (
<li
Expand Down
38 changes: 22 additions & 16 deletions src/widgets/discovery-detail/ui/discovery-summary.tsx
Original file line number Diff line number Diff line change
@@ -1,33 +1,43 @@
import Link from 'next/link';
import WeatherIcon from '@/features/discovery/ui/weather-icon';
import VoteDialog from '@/features/discovery-detail/ui/vote-dialog';
import type { Discovery } from '@/entities/discovery';
import type { Resort, Url } from '@/entities/discovery';
import { BusIcon, LiftIcon, VoteIcon } from '@/shared/icons';
import { cn } from '@/shared/lib';
import { getWeatherFromDescription } from '@/shared/lib/getWeatherFromDescription';
import Card from '@/shared/ui/card';
import { DiscoverySummaryActionList } from '../model/constants';
import DiscoverySummaryAction from './discovery-summary-action';

const DiscoverySummary = ({ id, name, slope, url, weather }: Discovery) => {
const DiscoverySummary = ({
resortId,
name,
openSlopes,
currentWeather,
bus,
homepage,
}: Resort & Url) => {
return (
<div className={cn('flex w-full gap-[26px] px-5 pb-[34px] pt-[10px] md:px-[30px]')}>
<Card
className={cn(
'flex flex-col justify-center gap-[5px] h-[134px] flex-1 items-center pl-[30px] pr-6 md:h-[123px]'
'flex h-[134px] flex-1 flex-col items-center justify-center gap-[5px] pl-[30px] pr-6 md:h-[123px]'
)}
>
<div className={cn('flex w-full justify-between items-center')}>
<div className={cn('flex w-full items-center justify-between')}>
<p className={cn('title1 text-gray-90')}>{name}</p>
<div className={cn('flex gap-2 items-center')}>
<WeatherIcon weather={weather.weather} />
<p className={cn('font-semibold text-[30px] leading-tight')}>{weather.temperature}°</p>
<div className={cn('flex items-center gap-2')}>
<WeatherIcon weather={getWeatherFromDescription(currentWeather.description)} />
<p className={cn('text-[30px] font-semibold leading-tight')}>
{currentWeather.temperature}°
</p>
</div>
</div>
<div className={cn('flex w-full justify-between items-center')}>
<div className={cn('flex w-full items-center justify-between')}>
<p className={cn('body1-medium text-gray-60')}>
{slope ? `운행중인 슬로프 ${slope}개` : '개장일이 곧 공개될 예정이에요'}
{openSlopes ? `운행중인 슬로프 ${openSlopes}개` : '개장일이 곧 공개될 예정이에요'}
</p>
<p className={cn('body1-semibold text-gray-60')}>{weather.description}</p>
<p className={cn('body1-semibold text-gray-60')}>{currentWeather.description}</p>
</div>
</Card>
<Card className={cn('hidden h-[123px] items-center justify-center gap-[30px] px-5 md:flex')}>
Expand All @@ -36,19 +46,15 @@ const DiscoverySummary = ({ id, name, slope, url, weather }: Discovery) => {
return (
<VoteDialog
key={action.name}
id={id}
id={resortId}
trigger={
<DiscoverySummaryAction key={action.name} {...action} icon={<VoteIcon />} />
}
/>
);
} else {
return (
<Link
key={action.name}
href={action.name === 'bus' ? url.bus : url.homepage}
target="_blank"
>
<Link key={action.name} href={action.name === 'bus' ? bus : homepage} target="_blank">
<DiscoverySummaryAction
{...action}
icon={action.name === 'bus' ? <BusIcon /> : <LiftIcon />}
Expand Down
2 changes: 1 addition & 1 deletion src/widgets/discovery/ui/discovery-card.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ import { useRouter } from 'next/navigation';
import WeatherIcon from '@/features/discovery/ui/weather-icon';
import type { Resort } from '@/entities/discovery';
import { cn } from '@/shared/lib';
import { getWeatherFromDescription } from '@/shared/lib/getWeatherFromDescription';
import Card from '@/shared/ui/card';
import { getWeatherFromDescription } from '../lib/getWeatherFromDescription';
import WeeklyWeather from './weekly-weather';

const DiscoveryCard = ({ resortId, name, openSlopes, currentWeather, weeklyWeather }: Resort) => {
Expand Down
2 changes: 1 addition & 1 deletion src/widgets/discovery/ui/weekly-weather.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import WeatherIcon from '@/features/discovery/ui/weather-icon';
import type { SummarizedWeeklyWeather as WeeklyWeatherType } from '@/entities/discovery/model/model';
import { cn } from '@/shared/lib';
import { getWeatherFromDescription } from '../lib/getWeatherFromDescription';
import { getWeatherFromDescription } from '@/shared/lib/getWeatherFromDescription';

interface WeeklyWeatherProps extends WeeklyWeatherType {
isToday: boolean;
Expand Down

0 comments on commit 70eefdd

Please sign in to comment.