diff options
| author | mini-bomba <[email protected]> | 2023-03-25 13:19:47 +0100 |
|---|---|---|
| committer | mini-bomba <[email protected]> | 2023-03-25 13:19:47 +0100 |
| commit | 78f6c66547e7a99e2b896c05ed59087c1bea2c2b (patch) | |
| tree | 16b00488cea7b9ed83850a6acaae7ea6948a882b | |
| parent | c2252af575ed425e9256b8fc10ba413a81390d50 (diff) | |
| download | SponsorBlock-78f6c66547e7a99e2b896c05ed59087c1bea2c2b.tar.gz SponsorBlock-78f6c66547e7a99e2b896c05ed59087c1bea2c2b.zip | |
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.
| -rw-r--r-- | src/components/CategoryPillComponent.tsx | 10 |
1 files changed, 5 insertions, 5 deletions
diff --git a/src/components/CategoryPillComponent.tsx b/src/components/CategoryPillComponent.tsx index 123f3e93..e2bbb0dd 100644 --- a/src/components/CategoryPillComponent.tsx +++ b/src/components/CategoryPillComponent.tsx @@ -43,7 +43,7 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP return ( <span style={style} - className={"sponsorBlockCategoryPill"} + className={"sponsorBlockCategoryPill"} aria-label={this.getTitleText()} onClick={(e) => this.toggleOpen(e)} onMouseEnter={() => this.openTooltip()} @@ -104,8 +104,8 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP await stopAnimation(); if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) { - this.setState({ - open: false, + this.setState({ + open: false, show: type === 1 }); } else if (response.statusCode !== 403) { @@ -117,13 +117,13 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP private getColor(): string { // Handled by setCategoryColorCSSVariables() of content.ts 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 { // Handled by setCategoryColorCSSVariables() of content.ts 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 { |