Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-13 15:07:02 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2336 from mini-bomba/fix/segment-hiding

Browse Source 
Fix segment hiding/unhiding
This commit is contained in:
Ajay Ramachandran
2025-09-19 15:56:19 -04:00
committed by GitHub
parent 1da5f33d72 915fd70274
commit 7cbb0ec7cf
1 changed files with 61 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
src/popup/SegmentListComponent.tsx
View File

@@ -28,8 +28,8 @@ enum SegmentListTab {
Chapter Chapter
} }
interface segmentWithNesting extends SponsorTime { interface SegmentWithNesting extends SponsorTime {
innerChapters?: (segmentWithNesting|SponsorTime)[]; innerChapters?: (SegmentWithNesting|SponsorTime)[];
} }
export const SegmentListComponent = (props: SegmentListComponentProps) => { export const SegmentListComponent = (props: SegmentListComponentProps) => {
@@ -58,37 +58,41 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
} }
}; };
const segmentsWithNesting: segmentWithNesting[] = []; const segmentsWithNesting = React.useMemo(() => {
let nbTrailingNonChapters = 0; const result: SegmentWithNesting[] = [];
function nestChapters(segments: segmentWithNesting[], seg: SponsorTime, topLevel?: boolean) { let nbTrailingNonChapters = 0;
if (seg.actionType === ActionType.Chapter && segments.length) { function nestChapters(segments: SegmentWithNesting[], seg: SponsorTime, topLevel?: boolean) {
// trailing non-chapters can only exist at top level if (seg.actionType === ActionType.Chapter && segments.length) {
const lastElement = segments[segments.length - (topLevel ? nbTrailingNonChapters + 1 : 1)] // trailing non-chapters can only exist at top level
const lastElement = segments[segments.length - (topLevel ? nbTrailingNonChapters + 1 : 1)]
if (lastElement.actionType === ActionType.Chapter if (lastElement.actionType === ActionType.Chapter
&& lastElement.segment[0] <= seg.segment[0] && lastElement.segment[0] <= seg.segment[0]
&& lastElement.segment[1] >= seg.segment[1]) { && lastElement.segment[1] >= seg.segment[1]) {
if (lastElement.innerChapters){ if (lastElement.innerChapters){
nestChapters(lastElement.innerChapters, seg); nestChapters(lastElement.innerChapters, seg);
} else {
lastElement.innerChapters = [seg];
}
} else { } else {
lastElement.innerChapters = [seg]; if (topLevel) {
} nbTrailingNonChapters = 0;
} else { }
if (topLevel) {
nbTrailingNonChapters = 0;
}
segments.push(seg); segments.push(seg);
}
} else {
if (seg.actionType !== ActionType.Chapter) {
nbTrailingNonChapters++;
} }
} else {
if (seg.actionType !== ActionType.Chapter) {
nbTrailingNonChapters++;
}
segments.push(seg); segments.push(seg);
}
} }
} props.segments.forEach((seg) => nestChapters(result, {...seg}, true));
props.segments.forEach((seg) => nestChapters(segmentsWithNesting, {...seg}, true)); return result;
}, [props.segments])
return ( return (
<div id="issueReporterContainer"> <div id="issueReporterContainer">
@@ -136,7 +140,7 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
}; };
function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter, tabFilter, sendMessage }: { function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter, tabFilter, sendMessage }: {
segment: segmentWithNesting; segment: SegmentWithNesting;
videoID: VideoID; videoID: VideoID;
currentTime: number; currentTime: number;
isVip: boolean; isVip: boolean;
@@ -146,18 +150,32 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
sendMessage: (request: Message) => Promise<MessageResponse>; sendMessage: (request: Message) => Promise<MessageResponse>;
}) { }) {
const [voteMessage, setVoteMessage] = React.useState<string | null>(null); const [voteMessage, setVoteMessage] = React.useState<string | null>(null);
const [hidden, setHidden] = React.useState(segment.hidden || SponsorHideType.Visible); const [hidden, setHidden] = React.useState(segment.hidden ?? SponsorHideType.Visible); // undefined ?? undefined lol
const [isLooped, setIsLooped] = React.useState(loopedChapter === segment.UUID); const [isLooped, setIsLooped] = React.useState(loopedChapter === segment.UUID);
let extraInfo = ""; // Update internal state if the hidden property of the segment changes
if (segment.hidden === SponsorHideType.Downvoted) { React.useEffect(() => {
// This one is downvoted setHidden(segment.hidden ?? SponsorHideType.Visible);
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDownvote") + ")"; }, [segment.hidden])
} else if (segment.hidden === SponsorHideType.MinimumDuration) {
// This one is too short let extraInfo: string;
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDuration") + ")"; switch (hidden) {
} else if (segment.hidden === SponsorHideType.Hidden) { case SponsorHideType.Visible:
extraInfo = " (" + chrome.i18n.getMessage("manuallyHidden") + ")"; extraInfo = "";
break;
case SponsorHideType.Downvoted:
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDownvote") + ")";
break;
case SponsorHideType.MinimumDuration:
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDuration") + ")";
break;
case SponsorHideType.Hidden:
extraInfo = " (" + chrome.i18n.getMessage("manuallyHidden") + ")";
break;
default:
// hidden satisfies never; // need to upgrade TS
console.warn(`[SB] Unhandled variant of SponsorHideType in SegmentListItem: ${hidden}`);
extraInfo = "";
} }
return ( return (
@@ -279,7 +297,7 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
{ {
(segment.actionType === ActionType.Skip || segment.actionType === ActionType.Mute (segment.actionType === ActionType.Skip || segment.actionType === ActionType.Mute
|| segment.actionType === ActionType.Poi || segment.actionType === ActionType.Poi
&& [SponsorHideType.Visible, SponsorHideType.Hidden].includes(segment.hidden)) && && [SponsorHideType.Visible, SponsorHideType.Hidden].includes(hidden)) &&
<img <img
className="voteButton" className="voteButton"
title={chrome.i18n.getMessage("hideSegment")} title={chrome.i18n.getMessage("hideSegment")}
@@ -288,17 +306,11 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
const stopAnimation = AnimationUtils.applyLoadingAnimation(e.currentTarget, 0.4); const stopAnimation = AnimationUtils.applyLoadingAnimation(e.currentTarget, 0.4);
stopAnimation(); stopAnimation();
if (segment.hidden === SponsorHideType.Hidden) { const newState = hidden === SponsorHideType.Hidden ? SponsorHideType.Visible : SponsorHideType.Hidden;
segment.hidden = SponsorHideType.Visible; setHidden(newState);
setHidden(SponsorHideType.Visible);
} else {
segment.hidden = SponsorHideType.Hidden;
setHidden(SponsorHideType.Hidden);
}
sendMessage({ sendMessage({
message: "hideSegment", message: "hideSegment",
type: segment.hidden, type: newState,
UUID: segment.UUID UUID: segment.UUID
}); });
}}/> }}/>
@@ -343,7 +355,7 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
} }
function InnerChapterList({ chapters, videoID, currentTime, isVip, loopedChapter, tabFilter, sendMessage }: { function InnerChapterList({ chapters, videoID, currentTime, isVip, loopedChapter, tabFilter, sendMessage }: {
chapters: (segmentWithNesting)[]; chapters: (SegmentWithNesting)[];
videoID: VideoID; videoID: VideoID;
currentTime: number; currentTime: number;
isVip: boolean; isVip: boolean;