43 lines
1.3 KiB
TypeScript
43 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { Box, Button, CircularProgress, Typography } from '@mui/material';
|
|
import VolumeUpIcon from '@mui/icons-material/VolumeUp';
|
|
|
|
interface AudioControlsPanelProps {
|
|
enabled: boolean;
|
|
regenerating: boolean;
|
|
onRegenerate: () => void;
|
|
}
|
|
|
|
const AudioControlsPanel: React.FC<AudioControlsPanelProps> = ({
|
|
enabled,
|
|
regenerating,
|
|
onRegenerate,
|
|
}) => {
|
|
return (
|
|
<Box sx={{ mt: 1.5, p: 2, border: '1px dashed rgba(120,90,60,0.35)', borderRadius: 1.5, backgroundColor: 'rgba(255,255,255,0.6)' }}>
|
|
<Typography variant="caption" sx={{ color: '#7a5335', display: 'block', mb: 1 }}>
|
|
Audio controls (uses Setup settings)
|
|
</Typography>
|
|
<Box sx={{ display: 'flex', gap: 1, flexWrap: 'wrap' }}>
|
|
<Button
|
|
size="small"
|
|
variant="outlined"
|
|
startIcon={regenerating ? <CircularProgress size={16} /> : <VolumeUpIcon />}
|
|
onClick={onRegenerate}
|
|
disabled={regenerating || !enabled}
|
|
>
|
|
{regenerating ? 'Regenerating...' : 'Regenerate Audio (Scene)'}
|
|
</Button>
|
|
</Box>
|
|
{!enabled && (
|
|
<Typography variant="caption" sx={{ display: 'block', mt: 1, color: '#a37b55' }}>
|
|
Enable Narration in Story Setup to generate audio.
|
|
</Typography>
|
|
)}
|
|
</Box>
|
|
);
|
|
};
|
|
|
|
export default AudioControlsPanel;
|
|
|