How can you simplify the rendering of a component?

Question

React

Hello. I make tabs through material ui and I don’t really like this thing:

{value === 0 && <TabContainer>Item One</TabContainer>}
{value === 1 && <TabContainer>Item Two</TabContainer>}
{value === 2 && <TabContainer>Item Three</TabContainer>}
{value === 3 && <TabContainer>Item Four</TabContainer>}
{value === 4 && <TabContainer>Item Five</TabContainer>}
{value === 5 && <TabContainer>Item Six</TabContainer>}
{value === 6 && <TabContainer>Item Seven</TabContainer>}

How can this be avoided (simplified)?
EXAMPLE

Answer 1

Put an array in state:
And in render it will become like this:
UPD. And if you add icons to the array, then the rendering of Tabs will also be simplified .