mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2025-12-08 04:27:15 +03:00
Merge pull request #2340 from FelixFourcolor/master
Auto-select the chapters tab if video only has chapters
This commit is contained in:
@@ -32,6 +32,14 @@ interface SegmentWithNesting extends SponsorTime {
|
|||||||
innerChapters?: (SegmentWithNesting|SponsorTime)[];
|
innerChapters?: (SegmentWithNesting|SponsorTime)[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function isSegment(segment) {
|
||||||
|
return segment.actionType !== ActionType.Chapter;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChapter(segment) {
|
||||||
|
return segment.actionType === ActionType.Chapter;
|
||||||
|
}
|
||||||
|
|
||||||
export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
||||||
const [tab, setTab] = React.useState(SegmentListTab.Segments);
|
const [tab, setTab] = React.useState(SegmentListTab.Segments);
|
||||||
const [isVip, setIsVip] = React.useState(Config.config?.isVip ?? false);
|
const [isVip, setIsVip] = React.useState(Config.config?.isVip ?? false);
|
||||||
@@ -46,17 +54,19 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
|||||||
}
|
}
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
React.useEffect(() => {
|
const [hasSegments, hasChapters] = React.useMemo(() => {
|
||||||
setTab(SegmentListTab.Segments);
|
const hasSegments = Boolean(props.segments.find(isSegment))
|
||||||
}, [props.videoID]);
|
const hasChapters = Boolean(props.segments.find(isChapter))
|
||||||
|
return [hasSegments, hasChapters];
|
||||||
|
}, [props.segments]);
|
||||||
|
|
||||||
const tabFilter = (segment: SponsorTime) => {
|
React.useEffect(() => {
|
||||||
if (tab === SegmentListTab.Chapter) {
|
if (hasSegments){
|
||||||
return segment.actionType === ActionType.Chapter;
|
setTab(SegmentListTab.Segments);
|
||||||
} else {
|
} else {
|
||||||
return segment.actionType !== ActionType.Chapter;
|
setTab(SegmentListTab.Chapter);
|
||||||
}
|
}
|
||||||
};
|
}, [props.videoID, hasSegments]);
|
||||||
|
|
||||||
const segmentsWithNesting = React.useMemo(() => {
|
const segmentsWithNesting = React.useMemo(() => {
|
||||||
const result: SegmentWithNesting[] = [];
|
const result: SegmentWithNesting[] = [];
|
||||||
@@ -98,7 +108,7 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div id="issueReporterContainer">
|
<div id="issueReporterContainer">
|
||||||
<div id="issueReporterTabs" className={props.segments && props.segments.find(s => s.actionType === ActionType.Chapter) ? "" : "hidden"}>
|
<div id="issueReporterTabs" className={hasSegments && hasChapters ? "" : "hidden"}>
|
||||||
<span id="issueReporterTabSegments" className={tab === SegmentListTab.Segments ? "sbSelected" : ""} onClick={() => {
|
<span id="issueReporterTabSegments" className={tab === SegmentListTab.Segments ? "sbSelected" : ""} onClick={() => {
|
||||||
setTab(SegmentListTab.Segments);
|
setTab(SegmentListTab.Segments);
|
||||||
}}>
|
}}>
|
||||||
@@ -125,7 +135,7 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
|||||||
isVip={isVip}
|
isVip={isVip}
|
||||||
loopedChapter={props.loopedChapter} // UUID instead of boolean so it can be passed down to nested chapters
|
loopedChapter={props.loopedChapter} // UUID instead of boolean so it can be passed down to nested chapters
|
||||||
|
|
||||||
tabFilter={tabFilter}
|
tabFilter={tab === SegmentListTab.Chapter ? isChapter : isSegment}
|
||||||
sendMessage={props.sendMessage}
|
sendMessage={props.sendMessage}
|
||||||
/>
|
/>
|
||||||
))
|
))
|
||||||
|
|||||||
Reference in New Issue
Block a user