Accordion - Open first tab from a mapped array - React TS

Question

{accordion.map(accordionItem => (
                <AccordionItem
                    key={accordionItem.title}
                    text={accordionItem.text}
                    title={accordionItem.title}
                ></AccordionItem>
            ))}

I have an Accordion component that maps over an array of data. I am trying to open just the first tab. There are properties you can add to default expand all or none, but wondering how to do this on the first tab? Material UI also has customised Accordions but they are focused when all data is in one file and not mapped through an array.

<Accordion className={classes.accordion} defaultExpanded={false}>
        <AccordionSummary
            expandIcon={<ExpandMoreIcon />}
            aria-controls='panel1a-content'
            id='panel1a-header'
            style={{
                borderBottom: '2px solid #EBEDF7'
            }}
        >
            <Typography className={classes.heading}>{title}</Typography>
        </AccordionSummary>
        <AccordionDetails>
            <Text label={text} className={classes.body} html>
                {text}
            </Text>
        </AccordionDetails>
    </Accordion>

Answer 1

This seem to work for me with MUI v5 to open first item (summary) of the accordion

...

          summaries.map((summary, index) => (
            <MuiAccordion
              defaultExpanded={index === 0 ? true : false}                  
              key={summary.id}
            >

...