✨feat(button): add a new inoperable state for the like button and sho…

…w operation result information #330

i18n/en.json

@@ -5,6 +5,7 @@
       "network": "Network error"
     },
     "fail": {
+      "addToPlaylist": "Failed to add to playlist",
       "signIn": "Sign in failed"
     },
     "hint": {

i18n/zh-cn.json

@@ -5,6 +5,7 @@
       "network": "网络错误"
     },
     "fail": {
+      "addToPlaylist": "添加到歌单失败",
       "signIn": "登录失败"
     },
     "hint": {

i18n/zh-tw.json

@@ -5,6 +5,7 @@
       "network": "網絡錯誤"
     },
     "fail": {
+      "addToPlaylist": "添加到歌單失敗",
       "signIn": "登入失敗"
     },
     "hint": {

src/activate/command.ts

@@ -1,9 +1,16 @@
-import { AccountManager, ButtonManager } from "../manager";
-import { MultiStepInput, PersonalFm, Player, State, load } from "../util";
+import {
+  LikeState,
+  MultiStepInput,
+  PersonalFm,
+  Player,
+  State,
+  likeMusic,
+  load,
+} from "../util";
 import { QueueItemTreeItem, QueueProvider } from "../treeview";
+import { ButtonManager } from "../manager";
 import type { ExtensionContext } from "vscode";
 import { VOLUME_KEY } from "../constant";
-import { apiLike } from "../api";
 import { commands } from "vscode";
 import i18n from "../i18n";
 
@@ -44,17 +51,12 @@ export function initCommand(context: ExtensionContext): void {
   );
 
   context.subscriptions.push(
-    commands.registerCommand("cloudmusic.like", async () => {
-      const islike = !State.like;
-      if (Player.treeitem instanceof QueueItemTreeItem) {
-        const { id } = Player.treeitem.item;
-        if (id && (await apiLike(id, islike))) {
-          State.like = islike;
-          islike
-            ? AccountManager.likelist.add(id)
-            : AccountManager.likelist.delete(id);
-        }
-      }
+    commands.registerCommand("cloudmusic.like", () => {
+      if (
+        Player.treeitem instanceof QueueItemTreeItem &&
+        State.like !== LikeState.none
+      )
+        void likeMusic(Player.treeitem.valueOf, !State.like);
     })
   );
 

src/api/helper.ts

@@ -193,7 +193,7 @@ export const resolveSongItem = (item: SongsItem): SongsItem => {
 
 export const resolveSongItemSt = (item: SongsItemSt): SongsItem => {
   const { name, id, dt, alia, ar, al, privilege } = item;
-  if (privilege.st < 0) unplayable.add(id);
+  if (privilege && privilege?.st < 0) unplayable.add(id);
   return {
     name,
     id,
@@ -206,7 +206,7 @@ export const resolveSongItemSt = (item: SongsItemSt): SongsItem => {
 
 export const resolveAnotherSongItem = (item: AnotherSongItem): SongsItem => {
   const { name, id, duration, alias, artists, album, privilege } = item;
-  if (privilege.st < 0) unplayable.add(id);
+  if (privilege && privilege?.st < 0) unplayable.add(id);
   return {
     name,
     id,

src/api/playlist.ts

@@ -180,12 +180,7 @@ export async function apiPlaylistTracks(
   try {
     await weapiRequest(
       "https://music.163.com/api/playlist/manipulate/tracks",
-      {
-        op,
-        pid,
-        trackIds: JSON.stringify(tracks),
-        imme: "true",
-      },
+      { op, pid, trackIds: JSON.stringify(tracks), imme: "true" },
       { os: "pc" }
     );
     return true;

src/i18n.ts

@@ -24,6 +24,7 @@ export default __non_webpack_require__(
       network: string;
     };
     fail: {
+      addToPlaylist: string;
       signIn: string;
     };
     hint: {

src/manager/button.ts

@@ -1,6 +1,6 @@
 import { BUTTON_KEY, LYRIC_KEY } from "../constant";
 import type { ExtensionContext, StatusBarItem } from "vscode";
-import { MultiStepInput, State } from "../util";
+import { LikeState, MultiStepInput, State } from "../util";
 import { StatusBarAlignment, window } from "vscode";
 import i18n from "../i18n";
 
@@ -46,7 +46,7 @@ export class ButtonManager {
       "$(play)",
       "$(chevron-right)",
       "$(sync-ignored)",
-      "$(star)",
+      "$(stop)",
       "$(unmute)",
       "$(flame)",
       this.showLyric ? "$(text-size)" : i18n.word.disabled,
@@ -58,7 +58,7 @@ export class ButtonManager {
       i18n.word.play,
       i18n.word.nextTrack,
       i18n.word.repeat,
-      i18n.word.like,
+      "",
       i18n.word.volume,
       i18n.word.song,
       i18n.word.lyric,
@@ -149,11 +149,24 @@ export class ButtonManager {
       : "$(sync-ignored)";
   }
 
-  static buttonLike(islike: boolean): void {
-    this.buttons[ButtonLabel.like].text = islike ? "$(star-full)" : "$(star)";
-    this.buttons[ButtonLabel.like].tooltip = islike
-      ? i18n.word.dislike
-      : i18n.word.like;
+  static buttonLike(islike: LikeState): void {
+    let text!: string;
+    let tooltip!: string;
+    switch (islike) {
+      case LikeState.none:
+        text = "$(stop)";
+        tooltip = "";
+        break;
+      case LikeState.like:
+        text = "$(star-full)";
+        tooltip = i18n.word.dislike;
+        break;
+      case LikeState.dislike:
+        text = "$(star)";
+        tooltip = i18n.word.like;
+    }
+    this.buttons[ButtonLabel.like].text = text;
+    this.buttons[ButtonLabel.like].tooltip = tooltip;
   }
 
   static buttonVolume(level: number): void {

src/util/state.ts

@@ -9,21 +9,28 @@ import {
 import { apiPersonalFm, apiRecommendSongs, apiUserLevel } from "../api";
 import { commands } from "vscode";
 import i18n from "../i18n";
+import { unplayable } from "../constant";
+
+export const enum LikeState {
+  none = -1,
+  like = 1,
+  dislike = 0,
+}
 
 export class State {
-  private static like_ = false;
+  private static like_ = LikeState.none;
 
   private static loading_ = false;
 
   private static login_ = false;
 
   private static playing_ = false;
 
-  static get like(): boolean {
+  static get like(): LikeState {
     return this.like_;
   }
 
-  static set like(newValue: boolean) {
+  static set like(newValue: LikeState) {
     if (newValue !== this.like_) {
       this.like_ = newValue;
       ButtonManager.buttonLike(newValue);
@@ -44,7 +51,12 @@ export class State {
       else if (Player.treeitem) {
         const { name, ar, id } = Player.treeitem.item;
         ButtonManager.buttonSong(name, ar.map(({ name }) => name).join("/"));
-        this.like = AccountManager.likelist.has(id);
+        this.like =
+          Player.treeitem instanceof QueueItemTreeItem && !unplayable.has(id)
+            ? AccountManager.likelist.has(id)
+              ? LikeState.like
+              : LikeState.dislike
+            : LikeState.none;
       }
     }
   }

src/util/util.ts

@@ -10,6 +10,7 @@ import type {
 } from "../constant";
 import {
   ButtonAction,
+  LikeState,
   MusicCache,
   PersonalFm,
   Player,
@@ -86,6 +87,16 @@ export async function downloadMusic(
   return;
 }
 
+export async function likeMusic(id: number, like: boolean): Promise<void> {
+  const word = like ? i18n.word.like : i18n.word.dislike;
+  if (await apiLike(id, like)) {
+    if (id === Player.treeitem?.valueOf)
+      State.like = like ? LikeState.like : LikeState.dislike;
+    like ? AccountManager.likelist.add(id) : AccountManager.likelist.delete(id);
+    void window.showInformationMessage(word);
+  } else void window.showErrorMessage(word);
+}
+
 export function stop(): void {
   Player.stop();
   Player.treeitem = undefined;
@@ -335,10 +346,7 @@ export async function pickSong(
       await Webview.comment(CommentType.song, id, name);
       break;
     case PickType.like:
-      if (await apiLike(id, true)) {
-        AccountManager.likelist.add(id);
-        if (id === Player.treeitem?.valueOf) State.like = true;
-      }
+      await likeMusic(id, true);
       break;
     case PickType.add:
       void commands.executeCommand(
@@ -1043,9 +1051,9 @@ export async function pickAddToPlaylist(
       id,
     })),
   });
-  if (await apiPlaylistTracks("add", pick.id, [id])) {
+  if (await apiPlaylistTracks("add", pick.id, [id]))
     PlaylistProvider.refresh(PlaylistProvider.playlists.get(pick.id));
-  }
+  else void window.showErrorMessage(i18n.sentence.fail.addToPlaylist);
   return input.stay();
 }
 
@@ -1115,8 +1123,7 @@ const limit = 50;
 export async function pickUsers(
   input: MultiStepInput,
   step: number,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  func: (...args: any[]) => Promise<UserDetail[]>,
+  func: (_: number, __: number, ___: number) => Promise<UserDetail[]>,
   offset: number,
   id: number
 ): Promise<InputStep> {