Button with Routes MAP use in List in MUI REACT JS

 Button with Routes MAP use in List in MUI REACT JS

// initilize list

const navItems = ['Home', 'About', 'Contact'];

const navRoutes = ['/' , '/login','/login'];

            <Box sx={{ display: { xs: 'none', sm: 'block' } }}>

                    // Decode with map Function

                 {navItems.map((item , index) => (

                    <Button key={item} href={navRoutes[index]} sx={{ color: '#fff' }}>

                        {item}

                    </Button>

                 ))}

             </Box>