address comments

src/main/features/core/lyrics/genius.ts

@@ -2,12 +2,14 @@ import axios, { AxiosResponse } from 'axios';
 import { load } from 'cheerio';
 import type { QueueSong } from '/@/renderer/api/types';
 
-const search_url = 'https://genius.com/api/search/song';
+const SEARCH_URL = 'https://genius.com/api/search/song';
+
+// Adapted from https://github.com/NyaomiDEV/Sunamu/blob/master/src/main/lyricproviders/genius.ts
 
 async function getSongURL(metadata: QueueSong) {
   let result: AxiosResponse<any, any>;
   try {
-    result = await axios.get(search_url, {
+    result = await axios.get(SEARCH_URL, {
       params: {
         per_page: '1',
         q: `${metadata.artistName} ${metadata.name}`,

src/main/features/core/lyrics/netease.ts

@@ -4,6 +4,8 @@ import type { QueueSong } from '/@/renderer/api/types';
 const SEARCH_URL = 'https://music.163.com/api/search/get';
 const LYRICS_URL = 'https://music.163.com/api/song/lyric';
 
+// Adapted from https://github.com/NyaomiDEV/Sunamu/blob/master/src/main/lyricproviders/netease.ts
+
 async function getSongId(metadata: QueueSong) {
   let result: AxiosResponse<any, any>;
   try {

src/main/preload/lyrics.ts

@@ -1,17 +1,17 @@
 import { IpcRendererEvent, ipcRenderer } from 'electron';
 import { QueueSong } from '/@/renderer/api/types';
 
-const fetchLyrics = (song: QueueSong) => {
+const fetchRemoteLyrics = (song: QueueSong) => {
   ipcRenderer.send('lyric-fetch', song);
 };
 
-const getLyrics = (
+const retrieveRemoteLyrics = (
   cb: (event: IpcRendererEvent, songName: string, source: string, lyric: string) => void,
 ) => {
   ipcRenderer.on('lyric-get', cb);
 };
 
 export const lyrics = {
-  fetchLyrics,
+  fetchRemoteLyrics,
-  getLyrics,
+  retrieveRemoteLyrics,
 };

src/renderer/features/lyrics/lyrics.tsx

@@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react';
 import isElectron from 'is-electron';
 import { ErrorBoundary } from 'react-error-boundary';
 import { ErrorFallback } from '/@/renderer/features/action-required';
-import { useCurrentServer, useCurrentSong } from '/@/renderer/store';
+import { getServerById, useCurrentServer, useCurrentSong } from '/@/renderer/store';
 import { SynchronizedLyrics } from './synchronized-lyrics';
 import { UnsynchronizedLyrics } from '/@/renderer/features/lyrics/unsynchronized-lyrics';
 import { LyricLine } from '/@/renderer/features/lyrics/lyric-line';
@@ -20,8 +20,8 @@ const ipc = isElectron() ? window.electron.ipc : null;
 const timeExp = /\[(\d{2,}):(\d{2})(?:\.(\d{2,3}))?]([^\n]+)\n/g;
 
 export const Lyrics = () => {
-  const currentServer = useCurrentServer();
   const currentSong = useCurrentSong();
+  const currentServer = getServerById(currentSong?.serverId);
 
   const [override, setOverride] = useState<string | null>(null);
   const [source, setSource] = useState<string | null>(null);
@@ -35,12 +35,14 @@ export const Lyrics = () => {
   const songRef = useRef<string | null>(null);
 
   useEffect(() => {
-    lyrics?.getLyrics((_event: any, songName: string, lyricSource: string, lyric: string) => {
+    lyrics?.retrieveRemoteLyrics(
+      (_event: any, songName: string, lyricSource: string, lyric: string) => {
         if (songName === songRef.current) {
           setSource(lyricSource);
           setOverride(lyric);
         }
-    });
+      },
+    );
 
     return () => {
       ipc?.removeAllListeners('lyric-get');
@@ -48,15 +50,19 @@ export const Lyrics = () => {
   }, []);
 
   useEffect(() => {
-    if (currentSong && !currentSong.lyrics && !remoteLyrics.isLoading && !remoteLyrics.data) {
+    const hasTaggedLyrics = currentSong && currentSong.lyrics;
-      lyrics?.fetchLyrics(currentSong);
+    const hasLyricsResponse =
+      !remoteLyrics.isLoading && remoteLyrics?.isSuccess && remoteLyrics?.data !== null;
+
+    if (!hasTaggedLyrics && !hasLyricsResponse) {
+      lyrics?.fetchRemoteLyrics(currentSong);
     }
 
     songRef.current = currentSong?.name ?? null;
 
     setOverride(null);
     setSource(null);
-  }, [currentSong, remoteLyrics.isLoading, remoteLyrics.data]);
+  }, [currentSong, remoteLyrics.isLoading, remoteLyrics?.data, remoteLyrics?.isSuccess]);
 
   useEffect(() => {
     let lyrics: string | null = null;
@@ -64,11 +70,10 @@ export const Lyrics = () => {
     if (currentSong?.lyrics) {
       lyrics = currentSong.lyrics;
 
-      setSource(currentServer?.name ?? 'music server');
+      setSource(currentSong?.name ?? 'music server');
     } else if (override) {
       lyrics = override;
     } else if (remoteLyrics.data) {
-      console.log(remoteLyrics.data);
       setSource(currentServer?.name ?? 'music server');
       setSongLyrics(remoteLyrics.data);
       return;

src/renderer/features/settings/components/playback/lyric-settings.tsx

@@ -1,10 +1,9 @@
-import { NumberInput, Switch } from '@mantine/core';
 import {
   SettingOption,
   SettingsSection,
 } from '/@/renderer/features/settings/components/settings-section';
 import { useLyricsSettings, useSettingsStoreActions } from '/@/renderer/store';
-import { MultiSelect, MultiSelectProps } from '/@/renderer/components';
+import { MultiSelect, MultiSelectProps, NumberInput, Switch } from '/@/renderer/components';
 import isElectron from 'is-electron';
 import styled from 'styled-components';
 import { LyricSource } from '/@/renderer/types';