import React from 'react';

import FormModule from './modules/form-module';
import HeadingModule from './modules/heading-module';
import HeroModule from './modules/hero-module';
import HeroMultiModule from './modules/hero-multi-module';
import FloomxFooter from './modules/floomx-footer-module';
import MapModule from './modules/map-module';
import ProductListModule from './modules/product-list-module';
import TextModule from './modules/text-module';
import InstagramModule from './modules/instagram-module';
import MultiImageModule from './modules/multi-image-module';
import ImageAndTextModule from './modules/image-and-text-module';
import BlackSpaceModule from './modules/blank-space-module';
import NewsletterModule from './modules/newsletter-module';
import ProductCategoryListModule from './modules/product-category-list-module';
import CallToAction from './modules/call-to-action';
import QuoteModule from './modules/quote';
import VideoModule from './modules/video-module';
import SingleImageModule from './modules/single-image-module';

type ModuleOption =
  | 'DatoCmsContactform'
  | 'DatoCmsHeading'
  | 'DatoCmsHero'
  | 'DatoCmsHeroMulti'
  | 'DatoCmsFloomxFooter'
  | 'DatoCmsImageAndText'
  | 'DatoCmsRichText'
  | 'DatoCmsInstagram'
  | 'DatoCmsMultiImage'
  | 'DatoCmsProductList'
  | 'DatoCmsProductCategoryList'
  | 'DatoCmsMap'
  | 'DatoCmsCallToAction'
  | 'DatoCmsBlankSpace'
  | 'DatoCmsClickableImage'
  | 'DatoCmsQuote'
  | 'DatoCmsNewsletter'
  | 'DatoCmsSingleImage'
  | 'DatoCmsVideo';

interface Module {
  type: ModuleOption;
  component: React.ReactNode;
}

const moduleConfig: Module[] = [
  {
    type: 'DatoCmsContactform',
    component: FormModule
  },
  {
    type: 'DatoCmsHeading',
    component: HeadingModule
  },
  {
    type: 'DatoCmsHero',
    component: HeroModule
  },
  {
    type: 'DatoCmsHeroMulti',
    component: HeroMultiModule
  },
  {
    type: 'DatoCmsFloomxFooter',
    component: FloomxFooter
  },
  {
    type: 'DatoCmsRichText',
    component: TextModule
  },
  {
    type: 'DatoCmsInstagram',
    component: InstagramModule
  },
  {
    type: 'DatoCmsMap',
    component: MapModule
  },
  {
    type: 'DatoCmsProductList',
    component: ProductListModule
  },
  {
    type: 'DatoCmsProductCategoryList',
    component: ProductCategoryListModule
  },
  {
    type: 'DatoCmsMultiImage',
    component: MultiImageModule
  },
  {
    type: 'DatoCmsImageAndText',
    component: ImageAndTextModule
  },
  {
    type: 'DatoCmsCallToAction',
    component: CallToAction
  },
  {
    type: 'DatoCmsBlankSpace',
    component: BlackSpaceModule
  },
  {
    type: 'DatoCmsClickableImage',
    component: SingleImageModule
  },
  {
    type: 'DatoCmsNewsletter',
    component: NewsletterModule
  },
  {
    type: 'DatoCmsQuote',
    component: QuoteModule
  },
  {
    type: 'DatoCmsVideo',
    component: VideoModule
  }
];

export default moduleConfig;