feat: 天気予報情報を画面に適用

mdkk11 · Sep 24, 2024 · d552448 · d552448
1 parent d3b0798
commit d552448
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 0 deletions.
diff --git a/src/features/weather/components/weather_overview/container.tsx b/src/features/weather/components/weather_overview/container.tsx
@@ -1,4 +1,5 @@
 import * as LocationTitle from "@/features/weather/components/location_title"
+import * as WeatherForecast from "@/features/weather/components/weather_forecast"
 import * as WeatherInfo from "@/features/weather/components/weather_info"
 import * as WeatherInfoDetail from "@/features/weather/components/weather_info_detail"
 import { Day } from "@/features/weather/const"
@@ -26,9 +27,14 @@ export const Container = () => {
     children: <WeatherInfoDetail.Container {...weatherInfoCurrentProps} />,
   } satisfies WeatherInfo.ContainerProps
 
+  const weatherForecastProps = {
+    forecast: data.forecast,
+  } satisfies WeatherForecast.ContainerProps
+
   const presenterProps = {
     locationTitleNode: <LocationTitle.Container {...locationTitleProps} />,
     weatherInfoNode: <WeatherInfo.Container {...weatherInfoProps} />,
+    weatherForecastNode: <WeatherForecast.Container {...weatherForecastProps} />,
   } satisfies PresenterProps
   return <Presenter {...presenterProps} />
 }
diff --git a/src/features/weather/components/weather_overview/loading.tsx b/src/features/weather/components/weather_overview/loading.tsx
@@ -1,4 +1,5 @@
 import * as LocationTitle from "@/features/weather/components/location_title"
+import * as WeatherForecast from "@/features/weather/components/weather_forecast"
 import * as WeatherInfo from "@/features/weather/components/weather_info"
 
 import * as styles from "./loading.css"
@@ -8,6 +9,7 @@ export const Loading = () => {
     <div className={styles.module}>
       <LocationTitle.Loading />
       <WeatherInfo.Loading />
+      <WeatherForecast.Loading />
     </div>
   )
 }
diff --git a/src/features/weather/components/weather_overview/presenter.stories.tsx b/src/features/weather/components/weather_overview/presenter.stories.tsx
@@ -1,6 +1,8 @@
 import { Meta, StoryObj } from "@storybook/react"
+import { BrowserRouter } from "react-router-dom"
 
 import * as LocationTitle from "@/features/weather/components/location_title"
+import * as WeatherForecast from "@/features/weather/components/weather_forecast"
 import * as WeatherInfo from "@/features/weather/components/weather_info"
 import * as WeatherInfoDetail from "@/features/weather/components/weather_info_detail"
 import { mock } from "@/features/weather/services/forecast/mock"
@@ -21,7 +23,15 @@ const meta = {
         }
       />
     ),
+    weatherForecastNode: <WeatherForecast.Container forecast={mock.forecast} />,
   },
+  decorators: [
+    (Story) => (
+      <BrowserRouter>
+        <Story />
+      </BrowserRouter>
+    ),
+  ],
 } satisfies Meta<typeof Presenter>
 export default meta
 

diff --git a/src/features/weather/components/weather_overview/presenter.tsx b/src/features/weather/components/weather_overview/presenter.tsx
@@ -5,13 +5,15 @@ import * as styles from "./presenter.css"
 export type PresenterProps = {
   locationTitleNode: ReactNode
   weatherInfoNode: ReactNode
+  weatherForecastNode: ReactNode
 }
 
 export const Presenter = ({ ...props }: PresenterProps) => {
   return (
     <div className={styles.module}>
       {props.locationTitleNode}
       {props.weatherInfoNode}
+      {props.weatherForecastNode}
     </div>
   )
 }