feature/change storyblok types to generated ones (#30)

* change storyblok types to generated ones * commit * add pricing generated types
focusreactive · Oct 29, 2024 · 15c9289 · 15c9289
1 parent 2c7334d
commit 15c9289
Show file tree

Hide file tree

Showing 31 changed files with 1,005 additions and 781 deletions.
diff --git a/apps/storyblok/src/components/Footer/index.tsx b/apps/storyblok/src/components/Footer/index.tsx
@@ -13,7 +13,7 @@ export default function Footer({ blok }: IFooterProps) {
   const { text, copywriteText, links, image } = blok;
 
   if (
-    text.length === 0 &&
+    text?.length === 0 &&
     links.length === 0 &&
     image.length === 0 &&
     !copywriteText
@@ -26,7 +26,7 @@ export default function Footer({ blok }: IFooterProps) {
         image={prepareImageProps(image?.[0])}
         copywriteText={copywriteText}
         links={links?.map(prepareLinkProps) || []}
-        text={prepareRichTextProps(text[0])}
+        text={prepareRichTextProps(text?.[0])}
       />
     </SectionContainer>
   );

diff --git a/apps/storyblok/src/components/Footer/types.ts b/apps/storyblok/src/components/Footer/types.ts
@@ -1,15 +1,5 @@
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { IRichText } from "@/lib/adapters/prepareRichTextProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface IFooter extends ISectionContainer {
-  links: ILinkBlok[];
-  text: IRichText[];
-  image: IImage[];
-  copywriteText?: string;
-}
+import type { FooterStoryblok } from "@/generated/extracted-types";
 
 export interface IFooterProps {
-  blok: IFooter;
+  blok: FooterStoryblok;
 }
diff --git a/apps/storyblok/src/components/Header/index.tsx b/apps/storyblok/src/components/Header/index.tsx
@@ -1,4 +1,5 @@
 import EmptyBlock from "@shared/ui/components/EmptyBlock";
+import type { AlignVariant } from "@shared/ui/components/sections/header/types";
 
 import { Header as HeaderUI } from "@shared/ui";
 
@@ -22,7 +23,7 @@ export default function Header({ blok }: IHeaderProps) {
       <HeaderUI
         links={links.map(prepareLinkProps)}
         image={prepareImageProps(image[0])}
-        alignVariant={alignVariant}
+        alignVariant={alignVariant as AlignVariant}
       />
     </SectionContainer>
   );

diff --git a/apps/storyblok/src/components/Header/types.ts b/apps/storyblok/src/components/Header/types.ts
@@ -1,15 +1,5 @@
-import type { AlignVariant } from "@shared/ui/components/sections/header/types";
-
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface IHeader extends ISectionContainer {
-  links: ILinkBlok[];
-  alignVariant: AlignVariant;
-  image: IImage[];
-}
+import type { HeaderStoryblok } from "@/generated/extracted-types";
 
 export interface IHeaderProps {
-  blok: IHeader;
+  blok: HeaderStoryblok;
 }
diff --git a/apps/storyblok/src/components/Page/types.ts b/apps/storyblok/src/components/Page/types.ts
@@ -1,11 +1,5 @@
-import type { SbBlokData } from "@storyblok/react/rsc";
-
-interface IPageContainer extends SbBlokData {
-  sections: SbBlokData[];
-  header: string;
-  showCookieBanner: boolean;
-}
+import type { PageStoryblok } from "@/generated/extracted-types";
 
 export interface IPageContainerProps {
-  blok: IPageContainer;
+  blok: PageStoryblok;
 }
diff --git a/apps/storyblok/src/components/SectionContainer/index.tsx b/apps/storyblok/src/components/SectionContainer/index.tsx
@@ -11,13 +11,13 @@ export default function SectionContainer({
   blok,
   className,
 }: ISectionContainerProps) {
-  const { theme, _uid, paddingX, paddingY, marginTop, marginBottom } = blok;
+  const { _uid, paddingX, paddingY, marginTop, marginBottom } = blok;
 
   if (isDraftMode) {
     return (
       <section
         {...storyblokEditable(blok)}
-        className={cn("bg-bgColor overflow-x-hidden", theme, className, {
+        className={cn("bg-bgColor overflow-x-hidden", className, {
           "mt-0": marginTop === "none",
           "mb-0": marginBottom === "none",
           "mt-sectionBase": marginTop === "base",
@@ -41,7 +41,7 @@ export default function SectionContainer({
 
   return (
     <section
-      className={cn("bg-bgColor", theme, className, {
+      className={cn("bg-bgColor", className, {
         "mt-0": marginTop === "none",
         "mb-0": marginBottom === "none",
         "mt-sectionBase": marginTop === "base",

diff --git a/apps/storyblok/src/components/SectionContainer/types.ts b/apps/storyblok/src/components/SectionContainer/types.ts
@@ -1,7 +1,6 @@
 import type { SbBlokData } from "@storyblok/react/rsc";
 
 export interface ISectionContainer extends SbBlokData {
-  theme: "light" | "dark";
   marginTop?: "none" | "base" | "lg";
   marginBottom?: "none" | "base" | "lg";
   paddingX?: "none";

diff --git a/apps/storyblok/src/contentSections/Blog/index.tsx b/apps/storyblok/src/contentSections/Blog/index.tsx
@@ -1,4 +1,5 @@
 import EmptyBlock from "@shared/ui/components/EmptyBlock";
+import type { BlogStyle } from "@shared/ui/components/sections/blog/types";
 
 import { BlogSection as BlogSectionUI } from "@shared/ui";
 
@@ -16,7 +17,7 @@ export default function Blog({ blok }: IBlogProps) {
     return <EmptyBlock name={blok.component as string} />;
 
   const formattedPosts = posts.map((post) => ({
-    style,
+    style: style as BlogStyle,
     text: prepareRichTextProps(post.text[0]),
     image: prepareImageProps(post.image[0]),
     link: prepareLinkProps(post.link[0]),
@@ -27,7 +28,7 @@ export default function Blog({ blok }: IBlogProps) {
       <BlogSectionUI
         text={prepareRichTextProps(text[0])}
         posts={formattedPosts}
-        style={style}
+        style={style as BlogStyle}
       />
     </SectionContainer>
   );

diff --git a/apps/storyblok/src/contentSections/Blog/types.ts b/apps/storyblok/src/contentSections/Blog/types.ts
@@ -1,24 +1,5 @@
-import type { BlogStyle } from "@shared/ui/components/sections/blog/types";
-import type { SbBlokData } from "@storyblok/react/rsc";
-
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { IRichText } from "@/lib/adapters/prepareRichTextProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface IBlogPost extends SbBlokData {
-  date: string;
-  image: IImage[];
-  link: ILinkBlok[];
-  text: IRichText[];
-}
-
-interface IBlog extends ISectionContainer {
-  text: IRichText[];
-  posts: IBlogPost[];
-  style: BlogStyle;
-}
+import type { BlogStoryblok } from "@/generated/extracted-types";
 
 export interface IBlogProps {
-  blok: IBlog;
+  blok: BlogStoryblok;
 }
diff --git a/apps/storyblok/src/contentSections/CardsGrid/index.tsx b/apps/storyblok/src/contentSections/CardsGrid/index.tsx
@@ -1,4 +1,5 @@
 import EmptyBlock from "@shared/ui/components/EmptyBlock";
+import type { DefaultCardStyle } from "@shared/ui/components/sections/cardsGrid/types";
 
 import { CardsGrid as CardsGridUI } from "@shared/ui";
 
@@ -15,9 +16,10 @@ export default function CardsGrid({ blok }: ICardsGridProps) {
 
   const formattedItems = items.map((item) => ({
     ...item,
+    style: item.style as DefaultCardStyle,
     type: item._type,
-    image: item.image[0] && prepareImageProps(item.image[0]),
-    link: item.link[0] && prepareLinkProps(item.link[0]),
+    image: prepareImageProps(item?.image?.[0]),
+    link: prepareLinkProps(item?.link?.[0]),
   }));
 
   return (

diff --git a/apps/storyblok/src/contentSections/CardsGrid/types.ts b/apps/storyblok/src/contentSections/CardsGrid/types.ts
@@ -1,23 +1,5 @@
-import type { DefaultCardStyle } from "@shared/ui/components/sections/cardsGrid/types";
-import type { SbBlokData } from "@storyblok/react/rsc";
-
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface IDefaultCard extends SbBlokData {
-  title: string;
-  description: string;
-  image: IImage[];
-  link: ILinkBlok[];
-  style: DefaultCardStyle;
-}
-
-interface ICardsGrid extends ISectionContainer {
-  items: IDefaultCard[];
-  columns: string;
-}
+import type { CardsGridStoryblok } from "@/generated/extracted-types";
 
 export interface ICardsGridProps {
-  blok: ICardsGrid;
+  blok: CardsGridStoryblok;
 }
diff --git a/apps/storyblok/src/contentSections/Copy/index.tsx b/apps/storyblok/src/contentSections/Copy/index.tsx
@@ -17,7 +17,7 @@ export default function Copy({ blok }: ICopyProps) {
     <SectionContainer blok={blok}>
       <CopyUI
         columns={columns.map(prepareRichTextProps)}
-        isReversedOnMobile={isReversedOnMobile}
+        isReversedOnMobile={!!isReversedOnMobile}
       />
     </SectionContainer>
   );

diff --git a/apps/storyblok/src/contentSections/Copy/types.ts b/apps/storyblok/src/contentSections/Copy/types.ts
@@ -1,11 +1,5 @@
-import type { IRichText } from "@/lib/adapters/prepareRichTextProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface ICopy extends ISectionContainer {
-  columns: IRichText[];
-  isReversedOnMobile: boolean;
-}
+import type { CopyStoryblok } from "@/generated/extracted-types";
 
 export interface ICopyProps {
-  blok: ICopy;
+  blok: CopyStoryblok;
 }
diff --git a/apps/storyblok/src/contentSections/Hero/index.tsx b/apps/storyblok/src/contentSections/Hero/index.tsx
@@ -12,14 +12,14 @@ import type { IHeroProps } from "./types";
 export default function Hero({ blok }: IHeroProps) {
   const { title, text, image, links } = blok;
 
-  if (image.length === 0 && links.length === 0 && text.length === 0 && !title)
+  if (image.length === 0 && links.length === 0 && text?.length === 0 && !title)
     return <EmptyBlock name={blok.component as string} />;
 
   return (
     <SectionContainer blok={blok}>
       <HeroUI
-        title={title}
-        text={prepareRichTextProps(text[0])}
+        title={title || ""}
+        text={prepareRichTextProps(text?.[0])}
         image={prepareImageProps(image[0])}
         links={links.map(prepareLinkProps)}
       />

diff --git a/apps/storyblok/src/contentSections/Hero/types.ts b/apps/storyblok/src/contentSections/Hero/types.ts
@@ -1,15 +1,5 @@
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { IRichText } from "@/lib/adapters/prepareRichTextProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-export interface IHero extends ISectionContainer {
-  title: string;
-  text: IRichText[];
-  image: IImage[];
-  links: ILinkBlok[];
-}
+import type { HeroStoryblok } from "@/generated/extracted-types";
 
 export interface IHeroProps {
-  blok: IHero;
+  blok: HeroStoryblok;
 }
diff --git a/apps/storyblok/src/contentSections/LinksList/index.tsx b/apps/storyblok/src/contentSections/LinksList/index.tsx
@@ -1,4 +1,5 @@
 import EmptyBlock from "@shared/ui/components/EmptyBlock";
+import type { AlignVariant } from "@shared/ui/components/sections/linksList/types";
 
 import { LinksList as LinksListUI } from "@shared/ui";
 
@@ -15,7 +16,7 @@ export default function LinksList({ blok }: ILinksLinkProps) {
   return (
     <SectionContainer blok={blok}>
       <LinksListUI
-        alignVariant={alignVariant}
+        alignVariant={alignVariant as AlignVariant}
         links={links.map(prepareLinkProps)}
       />
     </SectionContainer>

diff --git a/apps/storyblok/src/contentSections/LinksList/types.ts b/apps/storyblok/src/contentSections/LinksList/types.ts
@@ -1,13 +1,5 @@
-import type { AlignVariant } from "@shared/ui/components/sections/linksList/types";
-
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface ILinksLink extends ISectionContainer {
-  alignVariant: AlignVariant;
-  links: ILinkBlok[];
-}
+import type { LinksListStoryblok } from "@/generated/extracted-types";
 
 export interface ILinksLinkProps {
-  blok: ILinksLink;
+  blok: LinksListStoryblok;
 }
diff --git a/apps/storyblok/src/contentSections/Logos/index.tsx b/apps/storyblok/src/contentSections/Logos/index.tsx
@@ -1,4 +1,5 @@
 import EmptyBlock from "@shared/ui/components/EmptyBlock";
+import type { AlignVariant } from "@shared/ui/components/sections/logos/types";
 
 import { Logos as LogosUI } from "@shared/ui";
 
@@ -24,7 +25,10 @@ export default function Logos({ blok }: ILogosProps) {
 
   return (
     <SectionContainer blok={blok}>
-      <LogosUI items={formattedItems} alignVariant={alignVariant} />
+      <LogosUI
+        items={formattedItems}
+        alignVariant={alignVariant as AlignVariant}
+      />
     </SectionContainer>
   );
 }
diff --git a/apps/storyblok/src/contentSections/Logos/types.ts b/apps/storyblok/src/contentSections/Logos/types.ts
@@ -1,20 +1,5 @@
-import type { AlignVariant } from "@shared/ui/components/sections/logos/types";
-
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-interface ILogoItem {
-  image: IImage[];
-  link: ILinkBlok[];
-  type: "logo" | "clickableLogo";
-}
-
-export interface ILogos extends ISectionContainer {
-  items: ILogoItem[];
-  alignVariant: AlignVariant;
-}
+import type { LogosStoryblok } from "@/generated/extracted-types";
 
 export interface ILogosProps {
-  blok: ILogos;
+  blok: LogosStoryblok;
 }
diff --git a/apps/storyblok/src/contentSections/Pricing/index.tsx b/apps/storyblok/src/contentSections/Pricing/index.tsx
@@ -9,8 +9,7 @@ import SectionContainer from "@/components/SectionContainer";
 import type { IPricingProps } from "./types";
 
 export default function PricingSection({ blok }: IPricingProps) {
-  console.log(blok);
-  if (!blok || blok.tiers.length === 0)
+  if (!blok || blok?.tiers?.length === 0)
     return <EmptyBlock name="Pricing Section" />;
 
   const { tiers, yearlyDiscountPercentage } = blok;
@@ -34,9 +33,11 @@ export default function PricingSection({ blok }: IPricingProps) {
     <SectionContainer blok={blok}>
       <Pricing
         {...blok}
-        tiers={formattedTiers}
+        tiers={formattedTiers || []}
         extraService={extraService}
-        yearlyDiscountPercentage={parseFloat(yearlyDiscountPercentage)}
+        yearlyDiscountPercentage={
+          yearlyDiscountPercentage ? parseFloat(yearlyDiscountPercentage) : 0
+        }
       />
     </SectionContainer>
   );

diff --git a/apps/storyblok/src/contentSections/Pricing/types.ts b/apps/storyblok/src/contentSections/Pricing/types.ts
@@ -1,27 +1,5 @@
-import type { IImage } from "@/lib/adapters/prepareImageProps";
-import type { ILinkBlok } from "@/lib/adapters/prepareLinkProps";
-import type { ISectionContainer } from "@/components/SectionContainer/types";
-
-export interface IPricingTier {
-  name: string;
-  icon: IImage[];
-  price?: string;
-  description: string;
-  features: { text: string }[];
-  link: ILinkBlok[];
-  popular?: boolean;
-}
-
-export interface IPricing extends ISectionContainer {
-  tiers: IPricingTier[];
-  extraServiceEnabled?: boolean;
-  yearlyDiscountPercentage: string;
-  extraService?: {
-    text: string;
-    cost: string;
-  }[];
-}
+import type { PricingStoryblok } from "@/generated/extracted-types";
 
 export interface IPricingProps {
-  blok: IPricing;
+  blok: PricingStoryblok;
 }