AaronPo/the-biergarten-app
1
0
Fork 0
mirror of https://github.com/aaronpo97/the-biergarten-app.git synced 2026-02-16 10:42:08 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Refactor: Implement lazy loading for BreweryPost and BeerPost pages

Browse Source
This commit is contained in:
Aaron William Po
2023-05-20 20:56:29 -04:00
parent 56af72a471
commit 5005c1c1d4
2 changed files with 16 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/pages/beers/[id]/index.tsx
View File

@@ -2,10 +2,6 @@ import { NextPage, GetServerSideProps } from 'next';
import Head from 'next/head'; import Head from 'next/head';
import Image from 'next/image'; import Image from 'next/image';
import BeerInfoHeader from '@/components/BeerById/BeerInfoHeader';
import BeerPostCommentsSection from '@/components/BeerById/BeerPostCommentsSection';
import BeerRecommendations from '@/components/BeerById/BeerRecommendations';
import getBeerPostById from '@/services/BeerPost/getBeerPostById'; import getBeerPostById from '@/services/BeerPost/getBeerPostById';
import beerPostQueryResult from '@/services/BeerPost/schema/BeerPostQueryResult'; import beerPostQueryResult from '@/services/BeerPost/schema/BeerPostQueryResult';
@@ -16,6 +12,13 @@ import 'react-responsive-carousel/lib/styles/carousel.min.css';
import { Carousel } from 'react-responsive-carousel'; import { Carousel } from 'react-responsive-carousel';
import useMediaQuery from '@/hooks/utilities/useMediaQuery'; import useMediaQuery from '@/hooks/utilities/useMediaQuery';
import { Tab } from '@headlessui/react'; import { Tab } from '@headlessui/react';
import dynamic from 'next/dynamic';
const [BeerInfoHeader, BeerPostCommentsSection, BeerRecommendations] = [
dynamic(() => import('@/components/BeerById/BeerInfoHeader')),
dynamic(() => import('@/components/BeerById/BeerPostCommentsSection')),
dynamic(() => import('@/components/BeerById/BeerRecommendations')),
];
interface BeerPageProps { interface BeerPageProps {
beerPost: z.infer<typeof beerPostQueryResult>; beerPost: z.infer<typeof beerPostQueryResult>;

13
src/pages/breweries/[id]/index.tsx
View File

@@ -9,10 +9,15 @@ import 'react-responsive-carousel/lib/styles/carousel.min.css'; // requires a lo
import { Carousel } from 'react-responsive-carousel'; import { Carousel } from 'react-responsive-carousel';
import useMediaQuery from '@/hooks/utilities/useMediaQuery'; import useMediaQuery from '@/hooks/utilities/useMediaQuery';
import { Tab } from '@headlessui/react'; import { Tab } from '@headlessui/react';
import BreweryInfoHeader from '@/components/BreweryById/BreweryInfoHeader';
import BreweryPostMap from '@/components/BreweryById/BreweryPostMap'; import dynamic from 'next/dynamic';
import BreweryBeersSection from '@/components/BreweryById/BreweryBeerSection';
import BreweryCommentsSection from '@/components/BreweryById/BreweryCommentsSection'; const [BreweryInfoHeader, BreweryBeersSection, BreweryCommentsSection, BreweryPostMap] = [
dynamic(() => import('@/components/BreweryById/BreweryInfoHeader')),
dynamic(() => import('@/components/BreweryById/BreweryBeerSection')),
dynamic(() => import('@/components/BreweryById/BreweryCommentsSection')),
dynamic(() => import('@/components/BreweryById/BreweryPostMap')),
];
interface BreweryPageProps { interface BreweryPageProps {
breweryPost: z.infer<typeof BreweryPostQueryResult>; breweryPost: z.infer<typeof BreweryPostQueryResult>;