typescript code fixes

Author: karantalapalli

components/about-section-bucket.tsx

@@ -1,6 +1,35 @@
 import React from 'react';
 import parse from 'html-react-parser';
-import { BucketProps, Bucket } from "../typescript/about-section-bucket";
+import { Action,Image } from '../typescript/action';
+
+type AdditionalParam = {
+  title_h2?: string;
+  title_h3?: string;
+  description?: string;
+}
+
+type Bucket = {
+  title_h3: string;
+  description: string;
+  icon: Image;
+  $: AdditionalParam;
+  url: string;
+}
+
+type BucketsList = {
+  title_h3: string;
+  description: string;
+  url: string;
+  call_to_action: Action;
+  icon: Image;
+  $: AdditionalParam;
+}
+
+type BucketProps = {
+  title_h2: string;
+  buckets:[BucketsList];
+  $: AdditionalParam;
+}
 
 export default function AboutSectionBucket({ sectionWithBuckets }: {sectionWithBuckets:BucketProps}) {
   function bucketContent(bucket: Bucket, index: number) {

components/archive-relative.tsx

@@ -1,7 +1,22 @@
 import React from 'react';
 import Link from 'next/link';
 import parse from 'html-react-parser';
-import {BlogListProps} from '../typescript/archive-relative';
+
+type AdditionalParam = {
+  title: string;
+  body: string;
+}
+
+type Blog = {
+  url: string;
+  body: string;
+  title: string;
+  $: AdditionalParam;
+}
+
+type BlogListProps = {
+  blogs: [Blog];
+}
 
 export default function ArchiveRelative({ blogs }: BlogListProps) {
   return (

components/blog-banner.tsx

@@ -1,5 +1,20 @@
 import React from 'react';
-import {BannerProps} from '../typescript/blog';
+
+type AdditionalParam = {
+  banner_title:string;
+  banner_description: string;
+  title: {};
+  title_h2: string;
+  body: string;
+  date: string;
+}
+
+type BannerProps = {
+  banner_title:string;
+  banner_description: string;
+  bg_color: string;
+  $: AdditionalParam;
+}
 
 export default function BlogBanner({ blogBanner }: {blogBanner : BannerProps}) {
   return (

components/blog-list.tsx

@@ -2,12 +2,37 @@ import React from 'react';
 import moment from 'moment';
 import parse from 'html-react-parser';
 import Link from 'next/link';
-import { BloglistProps } from "../typescript/blog";
+import { Image } from "../typescript/action";
+
+type AdditionalParam = {
+  banner_title:string;
+  banner_description: string;
+  title: {};
+  title_h2: string;
+  body: string;
+  date: string;
+}
+
+type Author = {
+  title: string;
+  $: AdditionalParam;
+}
+
+
+type BloglistProps = {
+  body: string;
+  url: string;
+  featured_image: Image; 
+  title: string;
+  date: string;
+  author: [Author];
+  $: AdditionalParam;
+}
 
 function BlogList({ bloglist }: { bloglist: BloglistProps }) {
-  let body = typeof bloglist.body === 'string' && bloglist.body.substr(0, 300);
-  const stringLength = (body as string).lastIndexOf(' ');
-  body = `${(body as string).substr(0, Math.min((body as string).length, stringLength))}...`;
+  let body: string = bloglist.body && bloglist.body.substr(0, 300);
+  const stringLength = body.lastIndexOf(' ');
+  body = `${body.substr(0, Math.min(body.length, stringLength))}...`;
   return (
     <div className='blog-list'>
       {bloglist.featured_image && (

components/blog-section.tsx

@@ -1,7 +1,41 @@
 import React from 'react';
 import Link from 'next/link';
 import parse from 'html-react-parser';
-import { FeaturedBlogProps } from "../typescript/blog";
+import { Image } from "../typescript/action";
+
+type AdditionalParam = {
+  banner_title:string;
+  banner_description: string;
+  title: {};
+  title_h2: string;
+  body: string;
+  date: string;
+}
+
+type Article = {
+  href: string;
+  title: string;
+  $: AdditionalParam;
+}
+
+type FeaturedBlog = {
+  title: string;
+  featured_image: Image;
+  body: string;
+  url: string;
+  $: AdditionalParam;
+}
+
+type FeaturedBlogData = {
+  title_h2: string;
+  view_articles: Article;
+  featured_blogs: [FeaturedBlog]
+  $: AdditionalParam;
+}
+
+type FeaturedBlogProps = {
+  fromBlog: FeaturedBlogData;
+  }
 
 export default function BlogSection(props: FeaturedBlogProps) {
 

components/card-section.tsx

@@ -1,6 +1,22 @@
 import React from 'react';
 import Link from 'next/link';
-import { CardProps } from "../typescript/card";
+import { Action } from "../typescript/action";
+
+type AdditionalParam = {
+    title_h3: string;
+    description: string;
+  }
+  
+type Card = {
+    title_h3: string;
+    description: string;
+    call_to_action: Action;
+    $: AdditionalParam;
+  }
+  
+type CardProps = {
+    cards: [Card]
+  }
 
 export default function CardSection({ cards }: CardProps) {
   return (

components/footer.tsx

@@ -10,7 +10,7 @@ export default function Footer({ footer, entries }: {footer: FooterProps, entrie
 
   const [getFooter, setFooter] = useState(footer);
 
-  function buildNavigation(ent: Entry, ft: any) {
+  function buildNavigation(ent: Entry, ft: FooterProps) {
     let newFooter = { ...ft };
     if (ent.length !== newFooter.navigation.link.length) {
       ent.forEach((entry) => {

components/header.tsx

@@ -6,19 +6,19 @@ import Tooltip from './tool-tip';
 import { onEntryChange } from '../contentstack-sdk';
 import { getHeaderRes } from '../helper';
 import Skeleton from 'react-loading-skeleton';
-import { HeaderProps, Entry, Links } from "../typescript/layout";
+import { HeaderProps, Entry, NavLinks } from "../typescript/layout";
 
 export default function Header({ header, entries }: {header: HeaderProps, entries: Entry}) {
 
   const router = useRouter();
   const [getHeader, setHeader] = useState(header);
 
-  function buildNavigation(ent: Entry, hd: any) {
+  function buildNavigation(ent: Entry, hd: HeaderProps) {
     let newHeader={...hd};
     if (ent.length!== newHeader.navigation_menu.length) {
           ent.forEach((entry) => {
             const hFound = newHeader?.navigation_menu.find(
-              (navLink: Links) => navLink.label === entry.title
+              (navLink: NavLinks) => navLink.label === entry.title
             );
             if (!hFound) {
               newHeader.navigation_menu?.push({

components/hero-banner.tsx

@@ -1,6 +1,25 @@
 import React from 'react';
 import Link from 'next/link';
-import { BannerProps } from "../typescript/banner";
+import { Image, Action } from "../typescript/action";
+
+type AdditionalParam = {
+  banner_title: string;
+  banner_description: string;
+}
+
+type Banner = {
+  bg_color: string;
+  text_color: string;
+  banner_title: string;
+  banner_description: string;
+  call_to_action: Action;
+  banner_image: Image;
+  $: AdditionalParam;
+}
+
+type BannerProps = {
+  banner: Banner;
+}
 
 export default function HeroBanner(props: BannerProps) {
 

components/layout.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import Header from './header';
 import Footer from './footer';
 import DevTools from './devtools';
-import { HeaderProps, FooterProps, PageProps, Posts, ChilderenProps, Entry, Links } from "../typescript/layout";
+import { HeaderProps, FooterProps, PageProps, Posts, ChilderenProps, Entry, NavLinks, Links } from "../typescript/layout";
 
 export default function Layout({
   header,
@@ -20,13 +20,13 @@ export default function Layout({
   blogPost && (jsonObj.blog_post = blogPost);
   blogList && (jsonObj.blog_post = blogList);
 
-  function buildNavigation(ent: Entry, hd: any, ft: any) {
+  function buildNavigation(ent: Entry, hd: HeaderProps, ft: FooterProps) {
     let newHeader = { ...hd };
     let newFooter = { ...ft };
     if (ent.length !== newHeader.navigation_menu.length) {
       ent.forEach((entry) => {
         const hFound = newHeader?.navigation_menu.find(
-          (navLink: Links) => navLink.label === entry.title
+          (navLink: NavLinks) => navLink.label === entry.title
         );
         if (!hFound) {
           newHeader.navigation_menu?.push({