feat: Update VoiceAssignmentSection to trigger script generation
- Changed 'Generate Audiobook' button to 'Next: Review Script' - Added 'Skip Review & Generate' button as alternative - Updated button handlers to call handleGenerateScript and handleSkipReview - Updated button styling: primary button now blue for review, green for skip - Maintains backward compatibility with optional onSkipReview prop Requirements: 15.1, 15.8
This commit is contained in:
@@ -195,6 +195,7 @@ function App() {
|
|||||||
speed={speed}
|
speed={speed}
|
||||||
onSpeedChange={handleSpeedChange}
|
onSpeedChange={handleSpeedChange}
|
||||||
onGenerate={handleGenerateScript}
|
onGenerate={handleGenerateScript}
|
||||||
|
onSkipReview={handleSkipReview}
|
||||||
isGenerating={isGeneratingScript}
|
isGenerating={isGeneratingScript}
|
||||||
allRolesAssigned={allRolesAssigned}
|
allRolesAssigned={allRolesAssigned}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ interface VoiceAssignmentSectionProps {
|
|||||||
speed: number;
|
speed: number;
|
||||||
onSpeedChange: (speed: number) => void;
|
onSpeedChange: (speed: number) => void;
|
||||||
onGenerate: () => void;
|
onGenerate: () => void;
|
||||||
|
onSkipReview?: () => void;
|
||||||
isGenerating: boolean;
|
isGenerating: boolean;
|
||||||
allRolesAssigned: boolean;
|
allRolesAssigned: boolean;
|
||||||
}
|
}
|
||||||
@@ -138,6 +139,7 @@ export default function VoiceAssignmentSection({
|
|||||||
speed,
|
speed,
|
||||||
onSpeedChange,
|
onSpeedChange,
|
||||||
onGenerate,
|
onGenerate,
|
||||||
|
onSkipReview,
|
||||||
isGenerating,
|
isGenerating,
|
||||||
allRolesAssigned,
|
allRolesAssigned,
|
||||||
}: VoiceAssignmentSectionProps) {
|
}: VoiceAssignmentSectionProps) {
|
||||||
@@ -223,19 +225,33 @@ export default function VoiceAssignmentSection({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Generate Button */}
|
{/* Action Buttons */}
|
||||||
<div className="flex justify-center">
|
<div className="flex flex-col sm:flex-row justify-center gap-3 sm:gap-4">
|
||||||
<button
|
<button
|
||||||
onClick={onGenerate}
|
onClick={onGenerate}
|
||||||
disabled={isGenerateDisabled}
|
disabled={isGenerateDisabled}
|
||||||
className={`w-full sm:w-auto px-8 py-3 min-h-[44px] rounded-lg font-semibold text-white transition-colors touch-manipulation ${
|
className={`w-full sm:w-auto px-8 py-3 min-h-[44px] rounded-lg font-semibold text-white transition-colors touch-manipulation ${
|
||||||
isGenerateDisabled
|
isGenerateDisabled
|
||||||
? 'bg-gray-400 cursor-not-allowed'
|
? 'bg-gray-400 cursor-not-allowed'
|
||||||
: 'bg-green-600 hover:bg-green-700 active:bg-green-800 cursor-pointer'
|
: 'bg-blue-600 hover:bg-blue-700 active:bg-blue-800 cursor-pointer'
|
||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
{isGenerating ? 'Generating...' : 'Generate Audiobook'}
|
{isGenerating ? 'Generating Script...' : 'Next: Review Script'}
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
{onSkipReview && (
|
||||||
|
<button
|
||||||
|
onClick={onSkipReview}
|
||||||
|
disabled={isGenerateDisabled}
|
||||||
|
className={`w-full sm:w-auto px-8 py-3 min-h-[44px] rounded-lg font-semibold text-white transition-colors touch-manipulation ${
|
||||||
|
isGenerateDisabled
|
||||||
|
? 'bg-gray-400 cursor-not-allowed'
|
||||||
|
: 'bg-green-600 hover:bg-green-700 active:bg-green-800 cursor-pointer'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
Skip Review & Generate
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Validation Message */}
|
{/* Validation Message */}
|
||||||
|
|||||||
Reference in New Issue
Block a user