115 lines
5.1 KiB
TypeScript
115 lines
5.1 KiB
TypeScript
import React, { Fragment } from 'react'
|
|
|
|
import type { Page } from '@/payload-types'
|
|
|
|
import { FormBlock } from '@/blocks/Form/Component'
|
|
import { FDHeroBlockComponent } from '@/blocks/FDHeroBlock/Component'
|
|
import { FDCtaSideImageBlockComponent } from '@/blocks/FDCtaSideImageBlock/Component'
|
|
import { FDFeatureAnnouncementBlockComponent } from '@/blocks/FDFeatureAnnouncementBlock/Component'
|
|
import { FDServicesGridBlockComponent } from '@/blocks/FDServicesGridBlock/Component'
|
|
import { FDContactBlockComponent } from '@/blocks/FDContactBlock/Component'
|
|
import { FDFaqBlockComponent } from '@/blocks/FDFaqBlock/Component'
|
|
import { FDCardGridBlockComponent } from '@/blocks/FDCardGridBlock/Component'
|
|
import { FDPricingCardBlockComponent } from '@/blocks/FDPricingCardBlock/Component'
|
|
import { FDSpacerBlockComponent } from '@/blocks/FDSpacerBlock/Component'
|
|
import { FDIconBarBlockComponent } from '@/blocks/FDIconBarBlock/Component'
|
|
import { FDUspChecklistBlockComponent } from '@/blocks/FDUspChecklistBlock/Component'
|
|
import { FDWideCardBlockComponent } from '@/blocks/FDWideCardBlock/Component'
|
|
import { FDTechPropertiesBlockComponent } from '@/blocks/FDTechPropertiesBlock/Component'
|
|
import { FDUspTableBlockComponent } from '@/blocks/FDUspTableBlock/Component'
|
|
import { FDHeaderTextImageBlockComponent } from '@/blocks/FDHeaderTextImageBlock/Component'
|
|
import { FDTextBlockComponent } from '@/blocks/FDTextBlock/Component'
|
|
import { FDContactFormBlockComponent } from '@/blocks/FDContactFormBlock/Component'
|
|
import { FDTagsBlockComponent } from '@/blocks/FDTagsBlock/Component'
|
|
import { FDLocationsGridBlockComponent } from '@/blocks/FDLocationsGridBlock/Component'
|
|
import { FDAlternateHeroBlockComponent } from '@/blocks/FDAlternateHeroBlock/Component'
|
|
import { FDStatisticsBlockComponent } from '@/blocks/FDStatisticsBlock/Component'
|
|
import { FDPartnersLogosBlockComponent } from '@/blocks/FDPartnersLogosBlock/Component'
|
|
import { FDNewsletterBlockComponent } from '@/blocks/FDNewsletterBlock/Component'
|
|
import { FDServiceChooserBlockComponent } from '@/blocks/FDServiceChooserBlock/Component'
|
|
import { FDDataTableBlockComponent } from '@/blocks/FDDataTableBlock/Component'
|
|
import { FDVpsCalculatorBlockComponent } from '@/blocks/FDVpsCalculatorBlock/Component'
|
|
import { FDCodeEmbedBlockComponent } from '@/blocks/FDCodeEmbedBlock/Component'
|
|
import { FDVideoBlockComponent } from '@/blocks/FDVideoBlock/Component'
|
|
import { FDCtaBannerBlockComponent } from './FDCtaBannerBlock/Component'
|
|
import { FDTestimonialBlockComponent } from './FDTestimonialBlock/Component'
|
|
import { FDTeamBlockComponent } from './FDTeamBlock/Component'
|
|
import { FDServiceCalculatorBlockComponent } from '@/blocks/FDServiceCalculatorBlock/Component'
|
|
|
|
const blockComponents: Record<string, React.FC<any>> = {
|
|
formBlock: FormBlock,
|
|
fdHero: FDHeroBlockComponent,
|
|
fdCtaSideImage: FDCtaSideImageBlockComponent,
|
|
fdFeatureAnnouncement: FDFeatureAnnouncementBlockComponent,
|
|
fdServicesGrid: FDServicesGridBlockComponent,
|
|
fdContact: FDContactBlockComponent,
|
|
fdFaq: FDFaqBlockComponent,
|
|
fdCardGrid: FDCardGridBlockComponent,
|
|
fdPricingCard: FDPricingCardBlockComponent,
|
|
fdSpacer: FDSpacerBlockComponent,
|
|
fdIconBar: FDIconBarBlockComponent,
|
|
fdUspChecklist: FDUspChecklistBlockComponent,
|
|
fdWideCard: FDWideCardBlockComponent,
|
|
fdTechProperties: FDTechPropertiesBlockComponent,
|
|
fdUspTable: FDUspTableBlockComponent,
|
|
fdHeaderTextImage: FDHeaderTextImageBlockComponent,
|
|
fdText: FDTextBlockComponent,
|
|
fdContactForm: FDContactFormBlockComponent,
|
|
fdTags: FDTagsBlockComponent,
|
|
fdLocationsGrid: FDLocationsGridBlockComponent,
|
|
fdAlternateHero: FDAlternateHeroBlockComponent,
|
|
fdStatistics: FDStatisticsBlockComponent,
|
|
fdPartnersLogos: FDPartnersLogosBlockComponent,
|
|
fdNewsletter: FDNewsletterBlockComponent,
|
|
fdServiceChooser: FDServiceChooserBlockComponent,
|
|
fdDataTable: FDDataTableBlockComponent,
|
|
fdVpsCalculator: FDVpsCalculatorBlockComponent,
|
|
fdCodeEmbed: FDCodeEmbedBlockComponent,
|
|
fdVideo: FDVideoBlockComponent,
|
|
fdCtaBanner: FDCtaBannerBlockComponent,
|
|
fdTestimonial: FDTestimonialBlockComponent,
|
|
fdTeam: FDTeamBlockComponent,
|
|
fdServiceCalculator: FDServiceCalculatorBlockComponent,
|
|
}
|
|
|
|
/**
|
|
* Quick win: All FD blocks handle their own full-width sections,
|
|
* so instead of maintaining a manual Set we use a prefix check.
|
|
* This means new fdXxx blocks are automatically full-width.
|
|
*/
|
|
const isFullWidthBlock = (blockType: string): boolean =>
|
|
blockType.startsWith('fd')
|
|
|
|
export const RenderBlocks: React.FC<{
|
|
blocks: Page['layout'][0][]
|
|
}> = (props) => {
|
|
const { blocks } = props
|
|
|
|
const hasBlocks = blocks && Array.isArray(blocks) && blocks.length > 0
|
|
|
|
if (hasBlocks) {
|
|
return (
|
|
<Fragment>
|
|
{blocks.map((block, index) => {
|
|
const { blockType } = block
|
|
|
|
if (blockType && blockType in blockComponents) {
|
|
const Block = blockComponents[blockType]
|
|
|
|
if (Block) {
|
|
return (
|
|
<div className={isFullWidthBlock(blockType) ? '' : 'my-16'} key={index}>
|
|
<Block {...block} disableInnerContainer />
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
return null
|
|
})}
|
|
</Fragment>
|
|
)
|
|
}
|
|
|
|
return null
|
|
}
|