Reset fvlabel color definitions when segment == null

Without this, we would try to use the color for an 'undefined' category on the first render pass of the element.
It was then immediately re-rendered with a segment set, but DR missed the update, which caused it to stick to that 'undefined' category and the label became transparent.
This commit is contained in:
mini-bomba
2023-03-25 13:19:47 +01:00
parent c2252af575
commit 78f6c66547

View File

@@ -43,7 +43,7 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
return ( return (
<span style={style} <span style={style}
className={"sponsorBlockCategoryPill"} className={"sponsorBlockCategoryPill"}
aria-label={this.getTitleText()} aria-label={this.getTitleText()}
onClick={(e) => this.toggleOpen(e)} onClick={(e) => this.toggleOpen(e)}
onMouseEnter={() => this.openTooltip()} onMouseEnter={() => this.openTooltip()}
@@ -104,8 +104,8 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
await stopAnimation(); await stopAnimation();
if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) { if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) {
this.setState({ this.setState({
open: false, open: false,
show: type === 1 show: type === 1
}); });
} else if (response.statusCode !== 403) { } else if (response.statusCode !== 403) {
@@ -117,13 +117,13 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
private getColor(): string { private getColor(): string {
// Handled by setCategoryColorCSSVariables() of content.ts // Handled by setCategoryColorCSSVariables() of content.ts
const category = this.state.segment?.category; const category = this.state.segment?.category;
return `var(--sb-category-preview-${category}, var(--sb-category-${category}))`; return category == null ? null : `var(--sb-category-preview-${category}, var(--sb-category-${category}))`;
} }
private getTextColor(): string { private getTextColor(): string {
// Handled by setCategoryColorCSSVariables() of content.ts // Handled by setCategoryColorCSSVariables() of content.ts
const category = this.state.segment?.category; const category = this.state.segment?.category;
return `var(--sb-category-text-preview-${category}, var(--sb-category-text-${category}))`; return category == null ? null : `var(--sb-category-text-preview-${category}, var(--sb-category-text-${category}))`;
} }
private openTooltip(): void { private openTooltip(): void {