Update chapter handling for empty state and default segment

Simplifies logic in TimelineControls to use clipSegments.length for button and modal text, instead of filtering for titled chapters. In useVideoChapters, ensures a default segment spanning the entire video is created when no chapters exist, improving initial state handling and Safari compatibility.
This commit is contained in:
Yiannis Christodoulou 2025-10-19 20:08:53 +03:00
parent ce0ae1a8da
commit 7343817393
2 changed files with 25 additions and 16 deletions

View File

@ -3947,11 +3947,11 @@ const TimelineControls = ({
<button
onClick={() => setShowSaveChaptersModal(true)}
className="save-chapters-button"
data-tooltip={clipSegments.filter((s) => s.chapterTitle && s.chapterTitle.trim()).length === 0
data-tooltip={clipSegments.length === 0
? "Clear all chapters"
: "Save chapters"}
>
{clipSegments.filter((s) => s.chapterTitle && s.chapterTitle.trim()).length === 0
{clipSegments.length === 0
? 'Clear Chapters'
: 'Save Chapters'}
</button>
@ -3974,7 +3974,7 @@ const TimelineControls = ({
className="modal-button modal-button-primary"
onClick={handleSaveChaptersConfirm}
>
{clipSegments.filter((s) => s.chapterTitle && s.chapterTitle.trim()).length === 0
{clipSegments.length === 0
? 'Clear Chapters'
: 'Save Chapters'}
</button>
@ -3982,14 +3982,9 @@ const TimelineControls = ({
}
>
<p className="modal-message">
{(() => {
const chaptersWithTitles = clipSegments.filter((s) => s.chapterTitle && s.chapterTitle.trim()).length;
if (chaptersWithTitles === 0) {
return "Are you sure you want to clear all chapters? This will remove all existing chapters from the database.";
} else {
return `Are you sure you want to save the chapters? This will save ${chaptersWithTitles} chapters to the database.`;
}
})()}
{clipSegments.length === 0
? "Are you sure you want to clear all chapters? This will remove all existing chapters from the database."
: `Are you sure you want to save the chapters? This will save ${clipSegments.filter((s) => s.chapterTitle && s.chapterTitle.trim()).length} chapters to the database.`}
</p>
</Modal>

View File

@ -147,8 +147,15 @@ const useVideoChapters = () => {
initialSegments.push(segment);
}
} else {
// Start with empty state - no default segment
initialSegments = [];
// Create a default segment that spans the entire video on first load
const initialSegment: Segment = {
id: 1,
chapterTitle: '',
startTime: 0,
endTime: video.duration,
};
initialSegments = [initialSegment];
}
// Initialize history state with the segments
@ -267,17 +274,24 @@ const useVideoChapters = () => {
// Check if we now have duration and initialize if needed
if (video.duration > 0 && clipSegments.length === 0) {
logger.debug('Safari: Successfully initialized metadata with empty state');
logger.debug('Safari: Successfully initialized metadata, creating default segment');
const defaultSegment: Segment = {
id: 1,
chapterTitle: '',
startTime: 0,
endTime: video.duration,
};
setDuration(video.duration);
setTrimEnd(video.duration);
setClipSegments([]);
setClipSegments([defaultSegment]);
const initialState: EditorState = {
trimStart: 0,
trimEnd: video.duration,
splitPoints: [],
clipSegments: [],
clipSegments: [defaultSegment],
};
setHistory([initialState]);