AI Story Writer Backend Migration Complete, Frontend UI Components Added

frontend/src/components/StoryWriter/Phases/StoryOutlineParts/AudioControlsPanel.tsx

@@ -0,0 +1,42 @@
+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;
+