Merge pull request #1518 from mchangrh/interface-delimiter

Interface delimiter

19 files changed, 283 insertions, 282 deletions

diff --git a/.eslintrc.json b/.eslintrc.json
index 9744cc74..4310d618 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -23,7 +23,8 @@
         "@typescript-eslint/no-unused-vars": "error",
         "no-self-assign": "off",
         "@typescript-eslint/no-empty-interface": "off",
-        "react/prop-types": [2, { "ignore": ["children"] }]
+        "react/prop-types": [2, { "ignore": ["children"] }],
+        "@typescript-eslint/member-delimiter-style": "warn"
     },
     "settings": {
         "react": {
diff --git a/src/components/NoticeComponent.tsx b/src/components/NoticeComponent.tsx
index affe10a9..3202c6ac 100644
--- a/src/components/NoticeComponent.tsx
+++ b/src/components/NoticeComponent.tsx
@@ -8,42 +8,42 @@ enum CountdownMode {
 }
 
 export interface NoticeProps {
-    noticeTitle: string,
-
-    maxCountdownTime?: () => number,
-    dontPauseCountdown?: boolean,
-    amountOfPreviousNotices?: number,
-    showInSecondSlot?: boolean,
-    timed?: boolean,
-    idSuffix?: string,
-
-    fadeIn?: boolean,
-    startFaded?: boolean,
-    firstColumn?: React.ReactElement[] | React.ReactElement,
-    firstRow?: React.ReactElement,
-    bottomRow?: React.ReactElement[],
-
-    smaller?: boolean,
-    limitWidth?: boolean,
-    extraClass?: string,
-    hideLogo?: boolean,
-    hideRightInfo?: boolean,
+    noticeTitle: string;
+
+    maxCountdownTime?: () => number;
+    dontPauseCountdown?: boolean;
+    amountOfPreviousNotices?: number;
+    showInSecondSlot?: boolean;
+    timed?: boolean;
+    idSuffix?: string;
+
+    fadeIn?: boolean;
+    startFaded?: boolean;
+    firstColumn?: React.ReactElement[] | React.ReactElement;
+    firstRow?: React.ReactElement;
+    bottomRow?: React.ReactElement[];
+
+    smaller?: boolean;
+    limitWidth?: boolean;
+    extraClass?: string;
+    hideLogo?: boolean;
+    hideRightInfo?: boolean;
 
     // Callback for when this is closed
-    closeListener: () => void,
-    onMouseEnter?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void,
+    closeListener: () => void;
+    onMouseEnter?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
 
-    zIndex?: number,
-    style?: React.CSSProperties
+    zIndex?: number;
+    style?: React.CSSProperties;
     biggerCloseButton?: boolean;
-    children?: React.ReactNode
+    children?: React.ReactNode;
 }
 
 export interface NoticeState {
-    maxCountdownTime: () => number,
+    maxCountdownTime: () => number;
 
-    countdownTime: number,
-    countdownMode: CountdownMode,
+    countdownTime: number;
+    countdownMode: CountdownMode;
 
     mouseHovering: boolean;
 
diff --git a/src/components/NoticeTextSectionComponent.tsx b/src/components/NoticeTextSectionComponent.tsx
index 713def35..04262289 100644
--- a/src/components/NoticeTextSectionComponent.tsx
+++ b/src/components/NoticeTextSectionComponent.tsx
@@ -1,11 +1,11 @@
 import * as React from "react";
 
 export interface NoticeTextSelectionProps {
-    icon?: string,
-    text: string,
-    idSuffix: string,
-    onClick?: (event: React.MouseEvent) => unknown,
-    children?: React.ReactNode
+    icon?: string;
+    text: string;
+    idSuffix: string;
+    onClick?: (event: React.MouseEvent) => unknown;
+    children?: React.ReactNode;
 }
 
 export interface NoticeTextSelectionState {
diff --git a/src/components/SponsorTimeEditComponent.tsx b/src/components/SponsorTimeEditComponent.tsx
index 4741cacc..7446c9ca 100644
--- a/src/components/SponsorTimeEditComponent.tsx
+++ b/src/components/SponsorTimeEditComponent.tsx
@@ -14,11 +14,11 @@ import { DEFAULT_CATEGORY } from "../utils/categoryUtils";
 const utils = new Utils();
 
 export interface SponsorTimeEditProps {
-    index: number,
+    index: number;
 
-    idSuffix: string,
+    idSuffix: string;
     // Contains functions and variables from the content script needed by the skip notice
-    contentContainer: ContentContainer,
+    contentContainer: ContentContainer;
 
     submissionNotice: SubmissionNoticeComponent;
     categoryList?: Category[];
diff --git a/src/components/SubmissionNoticeComponent.tsx b/src/components/SubmissionNoticeComponent.tsx
index 471ab8e3..e81c2bdf 100644
--- a/src/components/SubmissionNoticeComponent.tsx
+++ b/src/components/SubmissionNoticeComponent.tsx
@@ -20,8 +20,8 @@ export interface SubmissionNoticeProps {
 }
 
 export interface SubmissionNoticeState {
-    noticeTitle: string,
-    messages: string[],
+    noticeTitle: string;
+    messages: string[];
     idSuffix: string;
 }
 
diff --git a/src/components/options/UnsubmittedVideosComponent.tsx b/src/components/options/UnsubmittedVideosComponent.tsx
index 892c49be..3806b881 100644
--- a/src/components/options/UnsubmittedVideosComponent.tsx
+++ b/src/components/options/UnsubmittedVideosComponent.tsx
@@ -7,7 +7,7 @@ export interface UnsubmittedVideosProps {
 }
 
 export interface UnsubmittedVideosState {
-    tableVisible: boolean,
+    tableVisible: boolean;
 }
 
 class UnsubmittedVideosComponent extends React.Component<UnsubmittedVideosProps, UnsubmittedVideosState> {
diff --git a/src/config.ts b/src/config.ts
index 3913c656..f23c60b5 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -8,122 +8,122 @@ export interface Permission {
 }
 
 interface SBConfig {
-    userID: string,
-    isVip: boolean,
-    permissions: Record<Category, Permission>,
+    userID: string;
+    isVip: boolean;
+    permissions: Record<Category, Permission>;
     /* Contains unsubmitted segments that the user has created. */
-    unsubmittedSegments: Record<string, SponsorTime[]>,
-    defaultCategory: Category,
-    renderSegmentsAsChapters: boolean,
-    whitelistedChannels: string[],
-    forceChannelCheck: boolean,
-    minutesSaved: number,
-    skipCount: number,
-    sponsorTimesContributed: number,
-    submissionCountSinceCategories: number, // New count used to show the "Read The Guidelines!!" message
-    showTimeWithSkips: boolean,
-    disableSkipping: boolean,
-    muteSegments: boolean,
-    fullVideoSegments: boolean,
-    manualSkipOnFullVideo: boolean,
-    trackViewCount: boolean,
-    trackViewCountInPrivate: boolean,
-    trackDownvotes: boolean,
-    dontShowNotice: boolean,
-    noticeVisibilityMode: NoticeVisbilityMode,
-    hideVideoPlayerControls: boolean,
-    hideInfoButtonPlayerControls: boolean,
-    hideDeleteButtonPlayerControls: boolean,
-    hideUploadButtonPlayerControls: boolean,
-    hideSkipButtonPlayerControls: boolean,
-    hideDiscordLaunches: number,
-    hideDiscordLink: boolean,
-    invidiousInstances: string[],
-    supportInvidious: boolean,
-    serverAddress: string,
-    minDuration: number,
-    skipNoticeDuration: number,
-    audioNotificationOnSkip: boolean,
-    checkForUnlistedVideos: boolean,
-    testingServer: boolean,
-    refetchWhenNotFound: boolean,
-    ytInfoPermissionGranted: boolean,
-    allowExpirements: boolean,
-    showDonationLink: boolean,
-    showPopupDonationCount: number,
-    showUpsells: boolean,
-    donateClicked: number,
-    autoHideInfoButton: boolean,
-    autoSkipOnMusicVideos: boolean,
+    unsubmittedSegments: Record<string, SponsorTime[]>;
+    defaultCategory: Category;
+    renderSegmentsAsChapters: boolean;
+    whitelistedChannels: string[];
+    forceChannelCheck: boolean;
+    minutesSaved: number;
+    skipCount: number;
+    sponsorTimesContributed: number;
+    submissionCountSinceCategories: number; // New count used to show the "Read The Guidelines!!" message
+    showTimeWithSkips: boolean;
+    disableSkipping: boolean;
+    muteSegments: boolean;
+    fullVideoSegments: boolean;
+    manualSkipOnFullVideo: boolean;
+    trackViewCount: boolean;
+    trackViewCountInPrivate: boolean;
+    trackDownvotes: boolean;
+    dontShowNotice: boolean;
+    noticeVisibilityMode: NoticeVisbilityMode;
+    hideVideoPlayerControls: boolean;
+    hideInfoButtonPlayerControls: boolean;
+    hideDeleteButtonPlayerControls: boolean;
+    hideUploadButtonPlayerControls: boolean;
+    hideSkipButtonPlayerControls: boolean;
+    hideDiscordLaunches: number;
+    hideDiscordLink: boolean;
+    invidiousInstances: string[];
+    supportInvidious: boolean;
+    serverAddress: string;
+    minDuration: number;
+    skipNoticeDuration: number;
+    audioNotificationOnSkip: boolean;
+    checkForUnlistedVideos: boolean;
+    testingServer: boolean;
+    refetchWhenNotFound: boolean;
+    ytInfoPermissionGranted: boolean;
+    allowExpirements: boolean;
+    showDonationLink: boolean;
+    showPopupDonationCount: number;
+    showUpsells: boolean;
+    donateClicked: number;
+    autoHideInfoButton: boolean;
+    autoSkipOnMusicVideos: boolean;
     colorPalette: {
-        red: string,
-        white: string,
-        locked: string
-    },
-    scrollToEditTimeUpdate: boolean,
-    categoryPillUpdate: boolean,
-    showChapterInfoMessage: boolean,
-    darkMode: boolean,
-    showCategoryGuidelines: boolean,
-    showCategoryWithoutPermission: boolean,
-    showSegmentNameInChapterBar: boolean,
+        red: string;
+        white: string;
+        locked: string;
+    };
+    scrollToEditTimeUpdate: boolean;
+    categoryPillUpdate: boolean;
+    showChapterInfoMessage: boolean;
+    darkMode: boolean;
+    showCategoryGuidelines: boolean;
+    showCategoryWithoutPermission: boolean;
+    showSegmentNameInChapterBar: boolean;
 
     // Used to cache calculated text color info
     categoryPillColors: {
         [key in Category]: {
-            lastColor: string,
-            textColor: string
+            lastColor: string;
+            textColor: string;
         }
-    }
+    };
 
-    skipKeybind: Keybind,
-    startSponsorKeybind: Keybind,
-    submitKeybind: Keybind,
-    nextChapterKeybind: Keybind,
-    previousChapterKeybind: Keybind,
+    skipKeybind: Keybind;
+    startSponsorKeybind: Keybind;
+    submitKeybind: Keybind;
+    nextChapterKeybind: Keybind;
+    previousChapterKeybind: Keybind;
 
     // What categories should be skipped
-    categorySelections: CategorySelection[],
+    categorySelections: CategorySelection[];
 
     payments: {
-        licenseKey: string,
-        lastCheck: number,
-        lastFreeCheck: number,
-        freeAccess: boolean,
-        chaptersAllowed: boolean
-    }
+        licenseKey: string;
+        lastCheck: number;
+        lastFreeCheck: number;
+        freeAccess: boolean;
+        chaptersAllowed: boolean;
+    };
 
     // Preview bar
     barTypes: {
-        "preview-chooseACategory": PreviewBarOption,
-        "sponsor": PreviewBarOption,
-        "preview-sponsor": PreviewBarOption,
-        "selfpromo": PreviewBarOption,
-        "preview-selfpromo": PreviewBarOption,
-        "exclusive_access": PreviewBarOption,
-        "interaction": PreviewBarOption,
-        "preview-interaction": PreviewBarOption,
-        "intro": PreviewBarOption,
-        "preview-intro": PreviewBarOption,
-        "outro": PreviewBarOption,
-        "preview-outro": PreviewBarOption,
-        "preview": PreviewBarOption,
-        "preview-preview": PreviewBarOption,
-        "music_offtopic": PreviewBarOption,
-        "preview-music_offtopic": PreviewBarOption,
-        "poi_highlight": PreviewBarOption,
-        "preview-poi_highlight": PreviewBarOption,
-        "filler": PreviewBarOption,
-        "preview-filler": PreviewBarOption,
-    }
+        "preview-chooseACategory": PreviewBarOption;
+        "sponsor": PreviewBarOption;
+        "preview-sponsor": PreviewBarOption;
+        "selfpromo": PreviewBarOption;
+        "preview-selfpromo": PreviewBarOption;
+        "exclusive_access": PreviewBarOption;
+        "interaction": PreviewBarOption;
+        "preview-interaction": PreviewBarOption;
+        "intro": PreviewBarOption;
+        "preview-intro": PreviewBarOption;
+        "outro": PreviewBarOption;
+        "preview-outro": PreviewBarOption;
+        "preview": PreviewBarOption;
+        "preview-preview": PreviewBarOption;
+        "music_offtopic": PreviewBarOption;
+        "preview-music_offtopic": PreviewBarOption;
+        "poi_highlight": PreviewBarOption;
+        "preview-poi_highlight": PreviewBarOption;
+        "filler": PreviewBarOption;
+        "preview-filler": PreviewBarOption;
+    };
 }
 
-export type VideoDownvotes = { segments: { uuid: HashedValue, hidden: SponsorHideType }[] , lastAccess: number };
+export type VideoDownvotes = { segments: { uuid: HashedValue; hidden: SponsorHideType }[] ; lastAccess: number };
 
 interface SBStorage {
     /* VideoID prefixes to UUID prefixes */
-    downvotedSegments: Record<VideoID & HashedValue, VideoDownvotes>,
-    navigationApiAvailable: boolean,
+    downvotedSegments: Record<VideoID & HashedValue, VideoDownvotes>;
+    navigationApiAvailable: boolean;
 }
 
 export interface SBObject {
@@ -340,7 +340,7 @@ const Config: SBObject = {
 
 // Function setup
 
-function configProxy(): { sync: SBConfig, local: SBStorage } {
+function configProxy(): { sync: SBConfig; local: SBStorage } {
     chrome.storage.onChanged.addListener((changes: {[key: string]: chrome.storage.StorageChange}, areaName) => {
         if (areaName === "sync") {
             for (const key in changes) {
diff --git a/src/content.ts b/src/content.ts
index 7952b4c0..4cc55e6e 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -68,7 +68,7 @@ let channelIDInfo: ChannelIDInfo;
 // Locked Categories in this tab, like: ["sponsor","intro","outro"]
 let lockedCategories: Category[] = [];
 // Used to calculate a more precise "virtual" video time
-let lastKnownVideoTime: { videoTime: number, preciseTime: number } = {
+let lastKnownVideoTime: { videoTime: number; preciseTime: number } = {
     videoTime: null,
     preciseTime: null
 };
@@ -125,7 +125,7 @@ let categoryPill: CategoryPill = null;
 let controls: HTMLElement | null = null;
 
 /** Contains buttons created by `createButton()`. */
-const playerButtons: Record<string, {button: HTMLButtonElement, image: HTMLImageElement, setupListener: boolean}> = {};
+const playerButtons: Record<string, {button: HTMLButtonElement; image: HTMLImageElement; setupListener: boolean}> = {};
 
 // Direct Links after the config is loaded
 utils.wait(() => Config.config !== null, 1000, 1).then(() => videoIDChange(getYouTubeVideoID(document)));
@@ -1403,7 +1403,7 @@ async function whitelistCheck() {
  * Returns info about the next upcoming sponsor skip
  */
 function getNextSkipIndex(currentTime: number, includeIntersectingSegments: boolean, includeNonIntersectingSegments: boolean):
-        {array: ScheduledTime[], index: number, endIndex: number, extraIndexes: number[], openNotice: boolean} {
+        {array: ScheduledTime[]; index: number; endIndex: number; extraIndexes: number[]; openNotice: boolean} {
 
     const autoSkipSorter = (segment: ScheduledTime) => {
         const skipOption = utils.getCategorySelection(segment.category)?.option;
@@ -1515,7 +1515,7 @@ function getLatestEndTimeIndex(sponsorTimes: SponsorTime[], index: number, hideH
  *  the current time, but end after
  */
 function getStartTimes(sponsorTimes: SponsorTime[], includeIntersectingSegments: boolean, includeNonIntersectingSegments: boolean,
-    minimum?: number, hideHiddenSponsors = false): {includedTimes: ScheduledTime[], scheduledTimes: number[]} {
+    minimum?: number, hideHiddenSponsors = false): {includedTimes: ScheduledTime[]; scheduledTimes: number[]} {
     if (!sponsorTimes) return {includedTimes: [], scheduledTimes: []};
 
     const includedTimes: ScheduledTime[] = [];
diff --git a/src/document.ts b/src/document.ts
index fc6b123a..595595b7 100644
--- a/src/document.ts
+++ b/src/document.ts
@@ -6,26 +6,26 @@
 import { PageType } from "./types";
 
 interface StartMessage {
-    type: "navigation",
-    pageType: PageType
-    videoID: string | null,
+    type: "navigation";
+    pageType: PageType;
+    videoID: string | null;
 }
 
 interface FinishMessage extends StartMessage {
-    channelID: string,
-    channelTitle: string
+    channelID: string;
+    channelTitle: string;
 }
 
 interface AdMessage {
-    type: "ad",
-    playing: boolean
+    type: "ad";
+    playing: boolean;
 }
 
 interface VideoData {
-    type: "data",
-    videoID: string,
-    isLive: boolean,
-    isPremiere: boolean
+    type: "data";
+    videoID: string;
+    isLive: boolean;
+    isPremiere: boolean;
 }
 
 type WindowMessage = StartMessage | FinishMessage | AdMessage | VideoData;
diff --git a/src/globals.d.ts b/src/globals.d.ts
index ed8547a0..aaaab851 100644
--- a/src/globals.d.ts
+++ b/src/globals.d.ts
@@ -1,6 +1,6 @@
 import { SBObject } from "./config";
 declare global {
-    interface Window { SB: SBObject; }
+    interface Window { SB: SBObject }
     // Remove this once the API becomes stable and types are shipped in @types/chrome
     namespace chrome {
         namespace declarativeContent {
diff --git a/src/js-components/previewBar.ts b/src/js-components/previewBar.ts
index 24251c09..c07b173d 100644
--- a/src/js-components/previewBar.ts
+++ b/src/js-components/previewBar.ts
@@ -651,7 +651,7 @@ class PreviewBar {
     }
 
     private findLeftAndScale(selector: string, currentElement: HTMLElement, progressBar: HTMLElement): 
-            { left: number, scale: number } {
+            { left: number; scale: number } {
         const sections = currentElement.parentElement.parentElement.parentElement.children;
         let currentWidth = 0;
         let lastWidth = 0;
diff --git a/src/popup.ts b/src/popup.ts
index 37f2b799..1fc1acc6 100644
--- a/src/popup.ts
+++ b/src/popup.ts
@@ -61,9 +61,9 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
     localizeHtmlPage();
 
     type InputPageElements = {
-        whitelistToggle?: HTMLInputElement,
-        toggleSwitch?: HTMLInputElement,
-        usernameInput?: HTMLInputElement,
+        whitelistToggle?: HTMLInputElement;
+        toggleSwitch?: HTMLInputElement;
+        usernameInput?: HTMLInputElement;
     };
     type PageElements = { [key: string]: HTMLElement } & InputPageElements
 
diff --git a/src/render/GenericNotice.tsx b/src/render/GenericNotice.tsx
index 4e01bcac..f3cc7a2e 100644
--- a/src/render/GenericNotice.tsx
+++ b/src/render/GenericNotice.tsx
@@ -9,17 +9,17 @@ import { ButtonListener, ContentContainer } from "../types";
 import NoticeTextSelectionComponent from "../components/NoticeTextSectionComponent";
 
 export interface TextBox {
-    icon: string,
-    text: string
+    icon: string;
+    text: string;
 }
 
 export interface NoticeOptions {
-    title: string,
-    referenceNode?: HTMLElement,
-    textBoxes?: TextBox[],
-    buttons?: ButtonListener[],
-    fadeIn?: boolean,
-    timed?: boolean
+    title: string;
+    referenceNode?: HTMLElement;
+    textBoxes?: TextBox[];
+    buttons?: ButtonListener[];
+    fadeIn?: boolean;
+    timed?: boolean;
     style?: React.CSSProperties;
     extraClass?: string;
     maxCountdownTime?: () => number;
diff --git a/src/render/RectangleTooltip.tsx b/src/render/RectangleTooltip.tsx
index 06cbd251..1b357fa8 100644
--- a/src/render/RectangleTooltip.tsx
+++ b/src/render/RectangleTooltip.tsx
@@ -2,18 +2,18 @@ import * as React from "react";
 import { createRoot, Root } from 'react-dom/client';
 
 export interface RectangleTooltipProps {
-    text: string, 
-    link?: string,
-    referenceNode: HTMLElement,
-    prependElement?: HTMLElement, // Element to append before
-    bottomOffset?: string,
-    leftOffset?: string,
-    timeout?: number,
-    htmlId?: string,
-    maxHeight?: string,
-    maxWidth?: string,
-    backgroundColor?: string,
-    fontSize?: string,
+    text: string; 
+    link?: string;
+    referenceNode: HTMLElement;
+    prependElement?: HTMLElement; // Element to append before
+    bottomOffset?: string;
+    leftOffset?: string;
+    timeout?: number;
+    htmlId?: string;
+    maxHeight?: string;
+    maxWidth?: string;
+    backgroundColor?: string;
+    fontSize?: string;
     buttonFunction?: () => void;
 }
 
diff --git a/src/types.ts b/src/types.ts
index 50b20374..9be4f9ce 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -4,32 +4,32 @@ import SkipNotice from "./render/SkipNotice";
 
 export interface ContentContainer {
     (): {
-        vote: (type: number, UUID: SegmentUUID, category?: Category, skipNotice?: SkipNoticeComponent) => void,
-        dontShowNoticeAgain: () => void,
-        unskipSponsorTime: (segment: SponsorTime, unskipTime: number, forceSeek?: boolean) => void,
-        sponsorTimes: SponsorTime[],
-        sponsorTimesSubmitting: SponsorTime[],
-        skipNotices: SkipNotice[],
-        v: HTMLVideoElement,
-        sponsorVideoID,
-        reskipSponsorTime: (segment: SponsorTime, forceSeek?: boolean) => void,
-        updatePreviewBar: () => void,
-        onMobileYouTube: boolean,
-        sponsorSubmissionNotice: SubmissionNotice,
-        resetSponsorSubmissionNotice: (callRef?: boolean) => void,
-        updateEditButtonsOnPlayer: () => void,
-        previewTime: (time: number, unpause?: boolean) => void,
-        videoInfo: VideoInfo,
-        getRealCurrentTime: () => number,
-        lockedCategories: string[],
-        channelIDInfo: ChannelIDInfo
-    }
+        vote: (type: number, UUID: SegmentUUID, category?: Category, skipNotice?: SkipNoticeComponent) => void;
+        dontShowNoticeAgain: () => void;
+        unskipSponsorTime: (segment: SponsorTime, unskipTime: number, forceSeek?: boolean) => void;
+        sponsorTimes: SponsorTime[];
+        sponsorTimesSubmitting: SponsorTime[];
+        skipNotices: SkipNotice[];
+        v: HTMLVideoElement;
+        sponsorVideoID;
+        reskipSponsorTime: (segment: SponsorTime, forceSeek?: boolean) => void;
+        updatePreviewBar: () => void;
+        onMobileYouTube: boolean;
+        sponsorSubmissionNotice: SubmissionNotice;
+        resetSponsorSubmissionNotice: (callRef?: boolean) => void;
+        updateEditButtonsOnPlayer: () => void;
+        previewTime: (time: number, unpause?: boolean) => void;
+        videoInfo: VideoInfo;
+        getRealCurrentTime: () => number;
+        lockedCategories: string[];
+        channelIDInfo: ChannelIDInfo;
+    };
 }
 
 export interface FetchResponse {
-    responseText: string,
-    status: number,
-    ok: boolean
+    responseText: string;
+    status: number;
+    ok: boolean;
 }
 
 export type HashedValue = string & { __hashBrand: unknown };
@@ -46,7 +46,7 @@ export enum CategorySkipOption {
 
 export interface CategorySelection {
     name: Category;
-    option: CategorySkipOption
+    option: CategorySkipOption;
 }
 
 export enum SponsorHideType {
@@ -97,95 +97,95 @@ export interface ScheduledTime extends SponsorTime {
 }
 
 export interface PreviewBarOption {
-    color: string,
-    opacity: string
+    color: string;
+    opacity: string;
 }
 
 
 export interface Registration {
-    message: string,
-    id: string,
-    allFrames: boolean,
-    js: browser.extensionTypes.ExtensionFileOrCode[],
-    css: browser.extensionTypes.ExtensionFileOrCode[],
-    matches: string[]
+    message: string;
+    id: string;
+    allFrames: boolean;
+    js: browser.extensionTypes.ExtensionFileOrCode[];
+    css: browser.extensionTypes.ExtensionFileOrCode[];
+    matches: string[];
 }
 
 export interface BackgroundScriptContainer {
-    registerFirefoxContentScript: (opts: Registration) => void,
-    unregisterFirefoxContentScript: (id: string) => void
+    registerFirefoxContentScript: (opts: Registration) => void;
+    unregisterFirefoxContentScript: (id: string) => void;
 }
 
 export interface VideoInfo {
     responseContext: {
-        serviceTrackingParams: Array<{service: string, params: Array<{key: string, value: string}>}>,
+        serviceTrackingParams: Array<{service: string; params: Array<{key: string; value: string}>}>;
         webResponseContextExtensionData: {
-            hasDecorated: boolean
-        }
-    },
+            hasDecorated: boolean;
+        };
+    };
     playabilityStatus: {
-        status: string,
-        playableInEmbed: boolean,
+        status: string;
+        playableInEmbed: boolean;
         miniplayer: {
             miniplayerRenderer: {
-                playbackMode: string
-            }
-        }
+                playbackMode: string;
+            };
+        };
     };
     streamingData: unknown;
     playbackTracking: unknown;
     videoDetails: {
-        videoId: string,
-        title: string,
-        lengthSeconds: string,
-        keywords: string[],
-        channelId: string,
-        isOwnerViewing: boolean,
-        shortDescription: string,
-        isCrawlable: boolean,
+        videoId: string;
+        title: string;
+        lengthSeconds: string;
+        keywords: string[];
+        channelId: string;
+        isOwnerViewing: boolean;
+        shortDescription: string;
+        isCrawlable: boolean;
         thumbnail: {
-            thumbnails: Array<{url: string, width: number, height: number}>
-        },
-        averageRating: number,
-        allowRatings: boolean,
-        viewCount: string,
-        author: string,
-        isPrivate: boolean,
-        isUnpluggedCorpus: boolean,
-        isLiveContent: boolean,
+            thumbnails: Array<{url: string; width: number; height: number}>;
+        };
+        averageRating: number;
+        allowRatings: boolean;
+        viewCount: string;
+        author: string;
+        isPrivate: boolean;
+        isUnpluggedCorpus: boolean;
+        isLiveContent: boolean;
     };
     playerConfig: unknown;
     storyboards: unknown;
     microformat: {
         playerMicroformatRenderer: {
             thumbnail: {
-                thumbnails: Array<{url: string, width: number, height: number}>
-            },
+                thumbnails: Array<{url: string; width: number; height: number}>;
+            };
             embed: {
-                iframeUrl: string,
-                flashUrl: string,
-                width: number,
-                height: number,
-                flashSecureUrl: string,
-            },
+                iframeUrl: string;
+                flashUrl: string;
+                width: number;
+                height: number;
+                flashSecureUrl: string;
+            };
             title: {
-                simpleText: string,
-            },
+                simpleText: string;
+            };
             description: {
-                simpleText: string,
-            },
-            lengthSeconds: string,
-            ownerProfileUrl: string,
-            externalChannelId: string,
-            availableCountries: string[],
-            isUnlisted: boolean,
-            hasYpcMetadata: boolean,
-            viewCount: string,
-            category: Category,
-            publishDate: string,
-            ownerChannelName: string,
-            uploadDate: string,
-        }
+                simpleText: string;
+            };
+            lengthSeconds: string;
+            ownerProfileUrl: string;
+            externalChannelId: string;
+            availableCountries: string[];
+            isUnlisted: boolean;
+            hasYpcMetadata: boolean;
+            viewCount: string;
+            category: Category;
+            publishDate: string;
+            ownerChannelName: string;
+            uploadDate: string;
+        };
     };
     trackingParams: string;
     attestation: unknown;
@@ -205,17 +205,17 @@ export enum ChannelIDStatus {
 }
 
 export interface ChannelIDInfo {
-    id: string,
-    status: ChannelIDStatus
+    id: string;
+    status: ChannelIDStatus;
 }
 
 export interface SkipToTimeParams {
-    v: HTMLVideoElement, 
-    skipTime: number[], 
-    skippingSegments: SponsorTime[], 
-    openNotice: boolean, 
-    forceAutoSkip?: boolean,
-    unskipTime?: number
+    v: HTMLVideoElement; 
+    skipTime: number[]; 
+    skippingSegments: SponsorTime[]; 
+    openNotice: boolean; 
+    forceAutoSkip?: boolean;
+    unskipTime?: number;
 }
 
 export interface ToggleSkippable {
@@ -232,11 +232,11 @@ export enum NoticeVisbilityMode {
 }
 
 export type Keybind = {
-    key: string,
-    code?: string,
-    ctrl?: boolean,
-    alt?: boolean,
-    shift?: boolean
+    key: string;
+    code?: string;
+    ctrl?: boolean;
+    alt?: boolean;
+    shift?: boolean;
 }
 
 export enum PageType {
@@ -249,6 +249,6 @@ export enum PageType {
 }
 
 export interface ButtonListener {
-    name: string,
-    listener: (e?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void
+    name: string;
+    listener: (e?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }
\ No newline at end of file
diff --git a/src/utils.ts b/src/utils.ts
index fd24cc3b..15cfd001 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -24,7 +24,7 @@ export default class Utils {
     /* Used for waitForElement */
     creatingWaitingMutationObserver = false;
     waitingMutationObserver: MutationObserver = null;
-    waitingElements: { selector: string, visibleCheck: boolean, callback: (element: Element) => void }[] = [];
+    waitingElements: { selector: string; visibleCheck: boolean; callback: (element: Element) => void }[] = [];
 
     constructor(backgroundScriptContainer: BackgroundScriptContainer = null) {
         this.backgroundScriptContainer = backgroundScriptContainer;
diff --git a/src/utils/animationUtils.ts b/src/utils/animationUtils.ts
index 933e6446..d7302c48 100644
--- a/src/utils/animationUtils.ts
+++ b/src/utils/animationUtils.ts
@@ -25,7 +25,7 @@ function applyLoadingAnimation(element: HTMLElement, time: number, callback?: ()
     });
 }
 
-function setupCustomHideAnimation(element: Element, container: Element, enabled = true, rightSlide = true): { hide: () => void, show: () => void } {
+function setupCustomHideAnimation(element: Element, container: Element, enabled = true, rightSlide = true): { hide: () => void; show: () => void } {
     if (enabled) element.classList.add("autoHiding");
     element.classList.add("hidden");
     element.classList.add("animationDone");
diff --git a/src/utils/genericUtils.ts b/src/utils/genericUtils.ts
index 8b07e699..144c0438 100644
--- a/src/utils/genericUtils.ts
+++ b/src/utils/genericUtils.ts
@@ -93,7 +93,7 @@ function getLuminance(color: string): number {
 }
 
 /* From https://stackoverflow.com/a/5624139 */
-function hexToRgb(hex: string): {r: number, g: number, b: number} {
+function hexToRgb(hex: string): {r: number; g: number; b: number} {
     // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
     const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
     hex = hex.replace(shorthandRegex, function(m, r, g, b) {
diff --git a/src/utils/warnings.ts b/src/utils/warnings.ts
index 09423e03..f2f2657e 100644
--- a/src/utils/warnings.ts
+++ b/src/utils/warnings.ts
@@ -6,9 +6,9 @@ import { GenericUtils } from "./genericUtils";
 const utils = new Utils();
 
 export interface ChatConfig {
-    displayName: string,
-    composerInitialValue?: string,
-    customDescription?: string
+    displayName: string;
+    composerInitialValue?: string;
+    customDescription?: string;
 }
 
 export async function openWarningDialog(contentContainer: ContentContainer): Promise<void> {