Refactor and built a breadcrums skeleton

components/Blocks/DynamicContent/index.tsx

@@ -27,57 +27,59 @@ export default function DynamicContent({
 }: DynamicContentProps) {
   return (
     <Suspense fallback={<LoadingSpinner />}>
-      {(() => {
-        switch (dynamic_content.component) {
-          case DynamicContentEnum.Blocks.components.current_benefits:
-            return <CurrentRewardsBlock {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.earn_and_burn:
-            return <EarnAndBurn {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.expiring_points:
-            return env.HIDE_FOR_NEXT_RELEASE ? null : (
-              <ExpiringPoints {...dynamic_content} />
-            )
-          case DynamicContentEnum.Blocks.components.how_it_works:
-            return (
-              <HowItWorks
-                dynamic_content={dynamic_content}
-                firstItem={firstItem}
-              />
-            )
-          case DynamicContentEnum.Blocks.components.loyalty_levels:
-            return (
-              <LoyaltyLevels
-                dynamic_content={dynamic_content}
-                firstItem={firstItem}
-              />
-            )
-          case DynamicContentEnum.Blocks.components.membership_overview:
-            return <Overview {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.next_benefits:
-            return <NextLevelRewardsBlock {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.overview_table:
-            return (
-              <OverviewTable
-                dynamic_content={dynamic_content}
-                firstItem={firstItem}
-              />
-            )
-          case DynamicContentEnum.Blocks.components.points_overview:
-            return <PointsOverview {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.previous_stays:
-            return <PreviousStays {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.sign_up_form:
-            return <SignupFormWrapper dynamic_content={dynamic_content} />
-          case DynamicContentEnum.Blocks.components.sign_up_verification:
-            return <SignUpVerification dynamic_content={dynamic_content} />
-          case DynamicContentEnum.Blocks.components.soonest_stays:
-            return <SoonestStays {...dynamic_content} />
-          case DynamicContentEnum.Blocks.components.upcoming_stays:
-            return <UpcomingStays {...dynamic_content} />
-          default:
-            return null
-        }
-      })()}
+      {renderDynamicComponent(dynamic_content, firstItem)}
     </Suspense>
   )
 }
+
+function renderDynamicComponent(
+  dynamic_content: DynamicContentProps["dynamic_content"],
+  firstItem: DynamicContentProps["firstItem"]
+) {
+  switch (dynamic_content.component) {
+    case DynamicContentEnum.Blocks.components.current_benefits:
+      return <CurrentRewardsBlock {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.earn_and_burn:
+      return <EarnAndBurn {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.expiring_points:
+      return env.HIDE_FOR_NEXT_RELEASE ? null : (
+        <ExpiringPoints {...dynamic_content} />
+      )
+    case DynamicContentEnum.Blocks.components.how_it_works:
+      return (
+        <HowItWorks dynamic_content={dynamic_content} firstItem={firstItem} />
+      )
+    case DynamicContentEnum.Blocks.components.loyalty_levels:
+      return (
+        <LoyaltyLevels
+          dynamic_content={dynamic_content}
+          firstItem={firstItem}
+        />
+      )
+    case DynamicContentEnum.Blocks.components.membership_overview:
+      return <Overview {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.next_benefits:
+      return <NextLevelRewardsBlock {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.overview_table:
+      return (
+        <OverviewTable
+          dynamic_content={dynamic_content}
+          firstItem={firstItem}
+        />
+      )
+    case DynamicContentEnum.Blocks.components.points_overview:
+      return <PointsOverview {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.previous_stays:
+      return <PreviousStays {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.sign_up_form:
+      return <SignupFormWrapper dynamic_content={dynamic_content} />
+    case DynamicContentEnum.Blocks.components.sign_up_verification:
+      return <SignUpVerification dynamic_content={dynamic_content} />
+    case DynamicContentEnum.Blocks.components.soonest_stays:
+      return <SoonestStays {...dynamic_content} />
+    case DynamicContentEnum.Blocks.components.upcoming_stays:
+      return <UpcomingStays {...dynamic_content} />
+    default:
+      return null
+  }
+}