Interface props declaration

Question

I'm new on Typescript and I'm stuck with some interface props. there is an error that says "Property 'services' does not exist on type 'IntrinsicAttributes & AkkordionProps[]", I don't understand because I see services on my interface declaration so, my head is lost now.

Here is the main component calling the BusinessPage component:

<BusinessPage services={services} />

and here is the BusinessPage.tsx component:

  export interface AkkordionListProps {
  services: {
    name: string
    services: {
      name: string
      content: string
      link: string
    }[]
  }
}

export interface AkkordionProps {
  services: AkkordionListProps[]
}

export const BusinessPage = (services: AkkordionProps[]): JSX.Element => {}

Thanks :)

Answer 1

BUsinessPage is react component. React always expects an object as a prop instead of array:

import React from 'react'

export interface AkkordionListProps {
    services: {
        name: string
        services: {
            name: string
            content: string
            link: string
        }[]
    }
}

export interface AkkordionProps {
    services: AkkordionListProps[]
}

export const BusinessPage = (props: AkkordionProps): JSX.Element => {
    return <div></div>
}

Playground