fix: Replace Box with BottomNavigationAction to fix React prop warning
Some checks failed
CI/CD Pipeline / Lint and Test (push) Has been cancelled
CI/CD Pipeline / E2E Tests (push) Has been cancelled
CI/CD Pipeline / Build Application (push) Has been cancelled

This commit is contained in:
2025-10-03 20:56:08 +00:00
parent fb9f9d25c7
commit eb78e75582

View File

@@ -64,38 +64,38 @@ export const TabBar = () => {
> >
{tabs.map((tab) => { {tabs.map((tab) => {
if (tab.value === 'voice') { if (tab.value === 'voice') {
// Center voice button // Center voice button - using BottomNavigationAction as wrapper to avoid prop warnings
return ( return (
<Box <BottomNavigationAction
key="voice-placeholder" key="voice-placeholder"
sx={{ label=""
flex: 1, value="voice"
display: 'flex', showLabel={false}
alignItems: 'center', icon={
justifyContent: 'center', <IconButton
}} aria-label="voice command"
> onClick={(e) => {
<IconButton e.stopPropagation();
aria-label="voice command" const voiceButton = document.querySelector('[aria-label="voice input"]') as HTMLButtonElement;
onClick={() => { if (voiceButton) {
const voiceButton = document.querySelector('[aria-label="voice input"]') as HTMLButtonElement; voiceButton.click();
if (voiceButton) { }
voiceButton.click(); }}
} sx={{
}} bgcolor: '#FF69B4',
sx={{ color: 'white',
bgcolor: '#FF69B4', width: 48,
color: 'white', height: 48,
width: 48, '&:hover': {
height: 48, bgcolor: '#FF1493',
'&:hover': { },
bgcolor: '#FF1493', }}
}, >
}} <Mic />
> </IconButton>
<Mic /> }
</IconButton> sx={{ minWidth: 80 }}
</Box> />
); );
} }
return ( return (