fix: Radius now displays properly on home page

src/pages/index.tsx

@@ -1,14 +1,33 @@
-import { GetStaticPropsContext } from 'next';
+import { GetServerSidePropsContext } from 'next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
 import { HomeView } from '../features/home/views/home-view';
 import {
  serverSideAppConfig,
  serverSideFlags,
 } from '@/shared/lib/server-utils';
+import { parseCookies } from 'nookies';
+import {
+ USER_PREF_COORDS,
+ USER_PREF_DISTANCE,
+ USER_PREF_LOCATION,
+} from '@/shared/lib/constants';
+import { shake } from 'radash';
+
+export async function getServerSideProps(ctx: GetServerSidePropsContext) {
+ const cookies = parseCookies(ctx);
+ const coords = cookies[USER_PREF_COORDS];
+ const location = cookies[USER_PREF_LOCATION];
+ const distance = cookies[USER_PREF_DISTANCE];
+
+ const pageProps = shake({
+ coords,
+ location,
+ distance,
+ });
 
-export async function getStaticProps(ctx: GetStaticPropsContext) {
  return {
  props: {
+ ...pageProps,
  ...(await serverSideAppConfig()),
  ...(await serverSideFlags()),
  ...(await serverSideTranslations(ctx.locale as string, [

src/shared/components/jotai-hydration.tsx

@@ -19,6 +19,21 @@ import {
  favoriteListWithFavoritesAtom,
 } from '../store/favorites';
 
+function getCoordinates(pageProps, cookies) {
+ if (pageProps.coords) {
+ return decodeURIComponent(pageProps.coords)
+ .split(',')
+ .map((number) => parseFloat(number))
+ .filter((number) => !isNaN(number));
+ } else if (cookies[USER_PREF_COORDS]) {
+ return cookies[USER_PREF_COORDS].split(',')
+ .map((number) => parseFloat(number))
+ .filter((number) => !isNaN(number));
+ }
+
+ return [];
+}
+
 // This component handles the hydration of Jotai state as well as keeping it in sync with re-renders/fetches of new data
 // This MUST be a child of the Jotai Provider component or hydration will not work
 export function JotaiHydration({ pageProps }) {
@@ -54,15 +69,7 @@ export function JotaiHydration({ pageProps }) {
  pageProps?.location ?? cookies?.[USER_PREF_LOCATION] ?? '',
  searchLocationValidationError: '',
  userLocation: pageProps?.location,
- userCoordinates:
- decodeURIComponent(pageProps?.coords)
- ?.split(',')
- ?.map((number) => parseFloat(number))
- ?.filter((number) => !isNaN(number)) ??
- cookies?.[USER_PREF_COORDS]?.split(',')
- ?.map((number) => parseFloat(number))
- ?.filter((number) => !isNaN(number)) ??
- [],
+ userCoordinates: getCoordinates(pageProps, cookies),
  },
  ],
  ] as const);