mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2025-12-13 15:07:02 +03:00
Merge pull request #2336 from mini-bomba/fix/segment-hiding
Fix segment hiding/unhiding
This commit is contained in:
@@ -28,8 +28,8 @@ enum SegmentListTab {
|
||||
Chapter
|
||||
}
|
||||
|
||||
interface segmentWithNesting extends SponsorTime {
|
||||
innerChapters?: (segmentWithNesting|SponsorTime)[];
|
||||
interface SegmentWithNesting extends SponsorTime {
|
||||
innerChapters?: (SegmentWithNesting|SponsorTime)[];
|
||||
}
|
||||
|
||||
export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
||||
@@ -58,9 +58,10 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
||||
}
|
||||
};
|
||||
|
||||
const segmentsWithNesting: segmentWithNesting[] = [];
|
||||
const segmentsWithNesting = React.useMemo(() => {
|
||||
const result: SegmentWithNesting[] = [];
|
||||
let nbTrailingNonChapters = 0;
|
||||
function nestChapters(segments: segmentWithNesting[], seg: SponsorTime, topLevel?: boolean) {
|
||||
function nestChapters(segments: SegmentWithNesting[], seg: SponsorTime, topLevel?: boolean) {
|
||||
if (seg.actionType === ActionType.Chapter && segments.length) {
|
||||
// trailing non-chapters can only exist at top level
|
||||
const lastElement = segments[segments.length - (topLevel ? nbTrailingNonChapters + 1 : 1)]
|
||||
@@ -88,7 +89,10 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
||||
segments.push(seg);
|
||||
}
|
||||
}
|
||||
props.segments.forEach((seg) => nestChapters(segmentsWithNesting, {...seg}, true));
|
||||
props.segments.forEach((seg) => nestChapters(result, {...seg}, true));
|
||||
return result;
|
||||
}, [props.segments])
|
||||
|
||||
|
||||
return (
|
||||
<div id="issueReporterContainer">
|
||||
@@ -136,7 +140,7 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
||||
};
|
||||
|
||||
function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter, tabFilter, sendMessage }: {
|
||||
segment: segmentWithNesting;
|
||||
segment: SegmentWithNesting;
|
||||
videoID: VideoID;
|
||||
currentTime: number;
|
||||
isVip: boolean;
|
||||
@@ -146,18 +150,32 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
|
||||
sendMessage: (request: Message) => Promise<MessageResponse>;
|
||||
}) {
|
||||
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);
|
||||
|
||||
let extraInfo = "";
|
||||
if (segment.hidden === SponsorHideType.Downvoted) {
|
||||
// This one is downvoted
|
||||
// Update internal state if the hidden property of the segment changes
|
||||
React.useEffect(() => {
|
||||
setHidden(segment.hidden ?? SponsorHideType.Visible);
|
||||
}, [segment.hidden])
|
||||
|
||||
let extraInfo: string;
|
||||
switch (hidden) {
|
||||
case SponsorHideType.Visible:
|
||||
extraInfo = "";
|
||||
break;
|
||||
case SponsorHideType.Downvoted:
|
||||
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDownvote") + ")";
|
||||
} else if (segment.hidden === SponsorHideType.MinimumDuration) {
|
||||
// This one is too short
|
||||
break;
|
||||
case SponsorHideType.MinimumDuration:
|
||||
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDuration") + ")";
|
||||
} else if (segment.hidden === SponsorHideType.Hidden) {
|
||||
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 (
|
||||
@@ -279,7 +297,7 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
|
||||
{
|
||||
(segment.actionType === ActionType.Skip || segment.actionType === ActionType.Mute
|
||||
|| segment.actionType === ActionType.Poi
|
||||
&& [SponsorHideType.Visible, SponsorHideType.Hidden].includes(segment.hidden)) &&
|
||||
&& [SponsorHideType.Visible, SponsorHideType.Hidden].includes(hidden)) &&
|
||||
<img
|
||||
className="voteButton"
|
||||
title={chrome.i18n.getMessage("hideSegment")}
|
||||
@@ -288,17 +306,11 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
|
||||
const stopAnimation = AnimationUtils.applyLoadingAnimation(e.currentTarget, 0.4);
|
||||
stopAnimation();
|
||||
|
||||
if (segment.hidden === SponsorHideType.Hidden) {
|
||||
segment.hidden = SponsorHideType.Visible;
|
||||
setHidden(SponsorHideType.Visible);
|
||||
} else {
|
||||
segment.hidden = SponsorHideType.Hidden;
|
||||
setHidden(SponsorHideType.Hidden);
|
||||
}
|
||||
|
||||
const newState = hidden === SponsorHideType.Hidden ? SponsorHideType.Visible : SponsorHideType.Hidden;
|
||||
setHidden(newState);
|
||||
sendMessage({
|
||||
message: "hideSegment",
|
||||
type: segment.hidden,
|
||||
type: newState,
|
||||
UUID: segment.UUID
|
||||
});
|
||||
}}/>
|
||||
@@ -343,7 +355,7 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
|
||||
}
|
||||
|
||||
function InnerChapterList({ chapters, videoID, currentTime, isVip, loopedChapter, tabFilter, sendMessage }: {
|
||||
chapters: (segmentWithNesting)[];
|
||||
chapters: (SegmentWithNesting)[];
|
||||
videoID: VideoID;
|
||||
currentTime: number;
|
||||
isVip: boolean;
|
||||
|
||||
Reference in New Issue
Block a user