feat(api-server): Improved api-server volume and like/dislike state (#3592)

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: rewhex <gitea@cluser.local>
Co-authored-by: JellyBrick <shlee1503@naver.com>

src/plugins/api-server/backend/main.ts

@@ -13,7 +13,11 @@ import { registerAuth, registerControl } from './routes';
 import { type APIServerConfig, AuthStrategy } from '../config';
 
 import type { BackendType } from './types';
-import type { RepeatMode } from '@/types/datahost-get-state';
+import type {
+  LikeType,
+  RepeatMode,
+  VolumeState,
+} from '@/types/datahost-get-state';
 
 export const backend = createBackend<BackendType, APIServerConfig>({
   async start(ctx) {
@@ -27,6 +31,7 @@ export const backend = createBackend<BackendType, APIServerConfig>({
     ctx.ipc.on('ytmd:player-api-loaded', () => {
       ctx.ipc.send('ytmd:setup-time-changed-listener');
       ctx.ipc.send('ytmd:setup-repeat-changed-listener');
+      ctx.ipc.send('ytmd:setup-like-changed-listener');
       ctx.ipc.send('ytmd:setup-volume-changed-listener');
     });
 
@@ -37,7 +42,7 @@ export const backend = createBackend<BackendType, APIServerConfig>({
 
     ctx.ipc.on(
       'ytmd:volume-changed',
-      (newVolume: number) => (this.volume = newVolume),
+      (newVolumeState: VolumeState) => (this.volumeState = newVolumeState),
     );
 
     this.run(config.hostname, config.port);
@@ -103,7 +108,11 @@ export const backend = createBackend<BackendType, APIServerConfig>({
       backendCtx,
       () => this.songInfo,
       () => this.currentRepeatMode,
-      () => this.volume,
+      () =>
+        backendCtx.window.webContents.executeJavaScript(
+          'document.querySelector("#like-button-renderer")?.likeStatus',
+        ) as Promise<LikeType>,
+      () => this.volumeState,
     );
     registerAuth(this.app, backendCtx);
 

src/plugins/api-server/backend/routes/control.ts

@@ -4,6 +4,12 @@ import { ipcMain } from 'electron';
 
 import getSongControls from '@/providers/song-controls';
 
+import {
+  LikeType,
+  type RepeatMode,
+  type VolumeState,
+} from '@/types/datahost-get-state';
+
 import {
   AddSongToQueueSchema,
   GoBackSchema,
@@ -20,7 +26,6 @@ import {
   type ResponseSongInfo,
 } from '../scheme';
 
-import type { RepeatMode } from '@/types/datahost-get-state';
 import type { SongInfo } from '@/providers/song-info';
 import type { BackendContext } from '@/types/contexts';
 import type { APIServerConfig } from '../../config';
@@ -87,6 +92,24 @@ const routes = {
       },
     },
   }),
+  getLikeState: createRoute({
+    method: 'get',
+    path: `/api/${API_VERSION}/like-state`,
+    summary: 'get like state',
+    description: 'Get the current like state',
+    responses: {
+      200: {
+        description: 'Success',
+        content: {
+          'application/json': {
+            schema: z.object({
+              state: z.enum(LikeType).nullable(),
+            }),
+          },
+        },
+      },
+    },
+  }),
   like: createRoute({
     method: 'post',
     path: `/api/${API_VERSION}/like`,
@@ -274,6 +297,7 @@ const routes = {
           'application/json': {
             schema: z.object({
               state: z.number(),
+              isMuted: z.boolean(),
             }),
           },
         },
@@ -526,12 +550,15 @@ const routes = {
   }),
 };
 
+type PromiseOrValue<T> = T | Promise<T>;
+
 export const register = (
   app: HonoApp,
   { window }: BackendContext<APIServerConfig>,
-  songInfoGetter: () => SongInfo | undefined,
-  repeatModeGetter: () => RepeatMode | undefined,
-  volumeGetter: () => number | undefined,
+  songInfoGetter: () => PromiseOrValue<SongInfo | undefined>,
+  repeatModeGetter: () => PromiseOrValue<RepeatMode | undefined>,
+  likeTypeGetter: () => PromiseOrValue<LikeType | undefined>,
+  volumeStateGetter: () => PromiseOrValue<VolumeState | undefined>,
 ) => {
   const controller = getSongControls(window);
 
@@ -565,6 +592,10 @@ export const register = (
     ctx.status(204);
     return ctx.body(null);
   });
+  app.openapi(routes.getLikeState, async (ctx) => {
+    ctx.status(200);
+    return ctx.json({ state: (await likeTypeGetter()) ?? null });
+  });
   app.openapi(routes.like, (ctx) => {
     controller.like();
 
@@ -624,9 +655,9 @@ export const register = (
     return ctx.body(null);
   });
 
-  app.openapi(routes.repeatMode, (ctx) => {
+  app.openapi(routes.repeatMode, async (ctx) => {
     ctx.status(200);
-    return ctx.json({ mode: repeatModeGetter() ?? null });
+    return ctx.json({ mode: (await repeatModeGetter()) ?? null });
   });
   app.openapi(routes.switchRepeat, (ctx) => {
     const { iteration } = ctx.req.valid('json');
@@ -642,9 +673,11 @@ export const register = (
     ctx.status(204);
     return ctx.body(null);
   });
-  app.openapi(routes.getVolumeState, (ctx) => {
+  app.openapi(routes.getVolumeState, async (ctx) => {
     ctx.status(200);
-    return ctx.json({ state: volumeGetter() ?? 0 });
+    return ctx.json(
+      (await volumeStateGetter()) ?? { state: 0, isMuted: false },
+    );
   });
   app.openapi(routes.setFullscreen, (ctx) => {
     const { state } = ctx.req.valid('json');
@@ -678,8 +711,8 @@ export const register = (
     return ctx.json({ state: fullscreen });
   });
 
-  const songInfo = (ctx: Context) => {
-    const info = songInfoGetter();
+  const songInfo = async (ctx: Context) => {
+    const info = await songInfoGetter();
 
     if (!info) {
       ctx.status(204);

src/plugins/api-server/backend/types.ts

@@ -1,9 +1,9 @@
 import { type OpenAPIHono as Hono } from '@hono/zod-openapi';
 import { type serve } from '@hono/node-server';
 
+import type { RepeatMode, VolumeState } from '@/types/datahost-get-state';
 import type { BackendContext } from '@/types/contexts';
 import type { SongInfo } from '@/providers/song-info';
-import type { RepeatMode } from '@/types/datahost-get-state';
 import type { APIServerConfig } from '../config';
 
 export type HonoApp = Hono;
@@ -13,7 +13,7 @@ export type BackendType = {
   oldConfig?: APIServerConfig;
   songInfo?: SongInfo;
   currentRepeatMode?: RepeatMode;
-  volume?: number;
+  volumeState?: VolumeState;
 
   init: (ctx: BackendContext<APIServerConfig>) => void;
   run: (hostname: string, port: number) => void;

src/plugins/shortcuts/mpris.ts

@@ -22,7 +22,7 @@ import getSongControls from '@/providers/song-controls';
 import config from '@/config';
 import { LoggerPrefix } from '@/utils';
 
-import type { RepeatMode } from '@/types/datahost-get-state';
+import type { RepeatMode, VolumeState } from '@/types/datahost-get-state';
 import type { QueueResponse } from '@/types/youtube-music-desktop-internal';
 
 class YTPlayer extends MprisPlayer {
@@ -305,8 +305,10 @@ function registerMPRIS(win: BrowserWindow) {
       console.trace(error);
     });
 
-    ipcMain.on('ytmd:volume-changed', (_, newVol) => {
-      player.volume = Number.parseFloat((newVol / 100).toFixed(2));
+    ipcMain.on('ytmd:volume-changed', (_, newVolumeState: VolumeState) => {
+      player.volume = newVolumeState.isMuted
+        ? 0
+        : Number.parseFloat((newVolumeState.state / 100).toFixed(2));
     });
 
     player.on('volume', async (newVolume: number) => {