fix(synced-lyrics): fix type error

This commit is contained in:
JellyBrick
2024-07-31 20:32:34 +09:00
parent ee820bb01c
commit 9357a15116
3 changed files with 24 additions and 22 deletions

View File

@ -1,21 +1,28 @@
/* eslint-disable prefer-const, @typescript-eslint/no-unused-vars */
import { createRenderer } from '@/utils';
import { SongInfo } from '@/providers/song-info';
import { YoutubePlayer } from '@/types/youtube-player';
import { makeLyricsRequest } from './lyrics';
import { selectors, tabStates } from './utils';
import { setConfig } from './renderer';
import { setCurrentTime } from './components/LyricsContainer';
import type { RendererContext } from '@/types/contexts';
import type { YoutubePlayer } from '@/types/youtube-player';
import type { SongInfo } from '@/providers/song-info';
import type { SyncedLyricsPluginConfig } from '../types';
export let _ytAPI: YoutubePlayer | null = null;
export const renderer = createRenderer({
export const renderer = createRenderer<{
observerCallback: MutationCallback;
onPlayerApiReady: (api: YoutubePlayer) => void;
hasAddedEvents: boolean;
observer?: MutationObserver;
videoDataChange: () => void;
progressCallback: (evt: Event) => void;
}, SyncedLyricsPluginConfig>({
onConfigChange(newConfig) {
setConfig(newConfig as SyncedLyricsPluginConfig);
setConfig(newConfig);
},
observerCallback(mutations: MutationRecord[]) {
@ -35,23 +42,20 @@ export const renderer = createRenderer({
}
},
onPlayerApiReady(api) {
onPlayerApiReady(api: YoutubePlayer) {
_ytAPI = api;
// @ts-expect-error type is 'unknown', so TS complains
api.addEventListener('videodatachange', this.videoDataChange);
// @ts-expect-error type is 'unknown', so TS complains
this.videoDataChange();
},
hasAddedEvents: false,
observer: null as MutationObserver | null,
videoDataChange() {
if (!this.hasAddedEvents) {
const video = document.querySelector('video');
// @ts-expect-error type is 'unknown', so TS complains
video?.addEventListener('timeupdate', this.progressCallback);
if (video) this.hasAddedEvents = true;
@ -61,7 +65,7 @@ export const renderer = createRenderer({
if (!header) return;
this.observer ??= new MutationObserver(
this.observerCallback as MutationCallback,
this.observerCallback,
);
// Force the lyrics tab to be enabled at all times.
@ -80,10 +84,10 @@ export const renderer = createRenderer({
}
},
async start({ getConfig, ipc: { on } }) {
setConfig((await getConfig()) as SyncedLyricsPluginConfig);
async start(ctx: RendererContext<SyncedLyricsPluginConfig>) {
setConfig(await ctx.getConfig());
on('ytmd:update-song-info', async (info: SongInfo) => {
ctx.ipc.on('ytmd:update-song-info', async (info: SongInfo) => {
await makeLyricsRequest(info);
});
},

View File

@ -1,6 +1,5 @@
/* eslint-disable import/order */
import { createEffect } from 'solid-js';
import { config } from '../renderer';
export { makeLyricsRequest } from './fetch';

View File

@ -1,15 +1,14 @@
/* eslint-disable import/order */
import { createSignal, Show } from 'solid-js';
import { VideoDetails } from '@/types/video-details';
import { SyncedLyricsPluginConfig } from '../types';
import { LyricsContainer } from './components/LyricsContainer';
import { SyncedLyricsPluginConfig } from '../types';
export const [isVisible, setIsVisible] = createSignal<boolean>(false);
// prettier-ignore
export const [config, setConfig] = createSignal<SyncedLyricsPluginConfig | null>(null);
// prettier-ignore
export const [playerState, setPlayerState] = createSignal<VideoDetails | null>(null);
export const LyricsRenderer = () => {