feat: redesign dashboard around place search
This commit is contained in:
@@ -5,26 +5,32 @@ import { useWeatherStore } from "@/lib/store";
|
||||
import { useWeatherStations } from "@/hooks/use-weather-stations";
|
||||
import { WeatherHero } from "@/components/weather/weather-hero";
|
||||
import { FavoritesSection } from "@/components/weather/favorites-section";
|
||||
import { StationsExplorer } from "@/components/weather/stations-explorer";
|
||||
import { LocationSearch } from "@/components/weather/location-search";
|
||||
import { FeaturedStationsSection } from "@/components/weather/featured-stations-section";
|
||||
import { PageLoadingSkeleton } from "@/components/states/loading-skeleton";
|
||||
import { ErrorState } from "@/components/states/error-state";
|
||||
import { useI18n } from "@/lib/i18n";
|
||||
import { useMeteoStationPositions } from "@/hooks/use-meteo-stations";
|
||||
|
||||
export function DashboardPage() {
|
||||
const { t } = useI18n();
|
||||
const { data: stations, isPending, isError, refetch } = useWeatherStations();
|
||||
const { data: positions = [] } = useMeteoStationPositions();
|
||||
const selectedStationId = useWeatherStore((state) => state.selectedStationId);
|
||||
const selectedLocation = useWeatherStore((state) => state.selectedLocation);
|
||||
if (isPending) return <PageLoadingSkeleton />;
|
||||
if (isError || !stations?.length) return <ErrorState onRetry={() => refetch()} description={t("dashboard.error")} />;
|
||||
const selectedStation = stations.find((station) => station.id === selectedStationId)
|
||||
?? stations.find((station) => station.name === DEFAULT_STATION_NAME)
|
||||
?? stations[0];
|
||||
const activeLocation = selectedLocation?.stationId === selectedStation.id ? selectedLocation : null;
|
||||
|
||||
return (
|
||||
<div className="space-y-10">
|
||||
<WeatherHero station={selectedStation} />
|
||||
<LocationSearch stations={stations} positions={positions} />
|
||||
<WeatherHero station={selectedStation} locationName={activeLocation?.name} distanceKm={activeLocation?.distanceKm} />
|
||||
<FavoritesSection stations={stations} />
|
||||
<StationsExplorer stations={stations} />
|
||||
<FeaturedStationsSection stations={stations} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user