added next/dynamic to more blocks

components/blocks-renderer.tsx

@@ -5,32 +5,65 @@ import { Agenda } from "./blocks/agenda";
 import { BuiltOnAzure } from "./blocks/builtOnAzure";
 import { Carousel } from "./blocks/carousel";
 import { ClientLogos } from "./blocks/clientLogos";
-import { ColorBlock } from "./blocks/colorBlock";
 import { Content } from "./blocks/content";
 import { ContentCard } from "./blocks/contentCard";
 import { CustomImage } from "./blocks/customImage";
-import { DownloadBlock } from "./blocks/downloadBlock";
-import { GridLayout } from "./blocks/gridLayout";
 import { JotFormEmbed } from "./blocks/jotFormEmbed";
-import { PaymentBlock } from "./blocks/payment-block";
 import { ServiceCards } from "./blocks/serviceCards";
 import { TableLayout } from "./blocks/tableLayout";
 import { UpcomingEvents } from "./blocks/upcomingEvents";
 import { VerticalImageLayout } from "./blocks/verticalImageLayout";
 import { VerticalListItem } from "./blocks/verticalListItem";
 import { VideoEmbed } from "./blocks/videoEmbed";
-import { ClientList } from "./company/clientList";
-import { EventBooking } from "./training/eventBooking";
-import { LocationBlock } from "./training/locationBlock";
-import { PresenterBlock } from "./training/presenterBlock";
-import { TrainingInformation } from "./training/trainingInformation";
-import { TrainingLearningOutcome } from "./training/trainingLearningOutcome";
-import { LatestTech } from "./usergroup/latestTech";
-
-const BookingButton = dynamic(
-  () =>
-    import("./bookingButton/bookingButton").then((mod) => mod.BookingButton),
-  { ssr: false }
+
+const BookingButton = dynamic(() =>
+  import("./bookingButton/bookingButton").then((mod) => mod.BookingButton)
+);
+
+const ClientList = dynamic(() =>
+  import("./company/clientList").then((mod) => mod.ClientList)
+);
+
+const ColorBlock = dynamic(() =>
+  import("./blocks/colorBlock").then((mod) => mod.ColorBlock)
+);
+
+const DownloadBlock = dynamic(() =>
+  import("./blocks/downloadBlock").then((mod) => mod.DownloadBlock)
+);
+
+const GridLayout = dynamic(() =>
+  import("./blocks/gridLayout").then((mod) => mod.GridLayout)
+);
+
+const LatestTech = dynamic(() =>
+  import("./usergroup/latestTech").then((mod) => mod.LatestTech)
+);
+
+const PaymentBlock = dynamic(() =>
+  import("./blocks/payment-block").then((mod) => mod.PaymentBlock)
+);
+
+const EventBooking = dynamic(() =>
+  import("./training/eventBooking").then((mod) => mod.EventBooking)
+);
+
+const LocationBlock = dynamic(() =>
+  import("./training/locationBlock").then((mod) => mod.LocationBlock)
+);
+
+const PresenterBlock = dynamic(() =>
+  import("./training/presenterBlock").then((mod) => mod.PresenterBlock)
+);
+const TrainingInformation = dynamic(() =>
+  import("./training/trainingInformation").then(
+    (mod) => mod.TrainingInformation
+  )
+);
+const TrainingLearningOutcome = dynamic(() =>
+  import("./training/trainingLearningOutcome").then(
+    (mod) => mod.TrainingLearningOutcome
+  )
 );
 
 const componentMap = {

components/blocks/aboutUs.tsx

@@ -1,6 +1,6 @@
 import classNames from "classnames";
 import dayjs from "dayjs";
-import { useState } from "react";
+import { memo, useState } from "react";
 import type { Template } from "tinacms";
 
 import { BiChevronRightCircle } from "react-icons/bi";
@@ -141,14 +141,14 @@ export const AboutUs = ({ data }) => {
   );
 };
 
-const TV = ({ className }) => {
+const TV = memo(function TV({ className }: { className?: string }) {
   return (
     <div className={className}>
       <h2 className="mt-0">tv.ssw.com</h2>
       <VideoModal url={layoutData.aboutUs.video.url} />
     </div>
   );
-};
+});
 
 const ContactUs = ({
   className,