How to destruct nested props with TypeScript

[lone moon]

Here is a link to codesandbox: https://codesandbox.io/s/sparkling-night-3hpnps?file=/src/TestimonialCard.tsx:509-631

1. Can someone help me how to go from this

 <p className="text-xl font-medium tracking-tight text-[#dddddd]">
   {props.testimonial.name}
  </p>

to

 <p className="text-xl font-medium tracking-tight text-[#dddddd]">
   {name}
 </p>

2. and I want to destruct the name, image, text, position within the props something like:

const TestimonialCard = (props:{testimonial:{name, image, text, position}) => {...}

How to destruct nested props with TypeScript

[rocky urchin]

const TestimonialCard = ({ testimonial }: Props) => {

Or const TestimonialCard = ({ testimonial: { name, position, text } }: Props) => { for further destructuring

[lone moon]

Thanks for the super fast replay 🚀 🔥 @rocky urchin
I will have a look at it 👍

It was just to copy/paste your snippet and it worked like a charm