[Tauri] Working CI (#762)

* Fix 'build' CI, passing TypeScript
* Attempt to actually build the binaries by GitHub actions

.eslintrc.cjs

@@ -36,6 +36,7 @@ module.exports = {
       },
     ],
     // We let TypeScript and Vite handle that
+    '@typescript-eslint/no-unused-vars': 'off',
     'import/no-unresolved': 'off',
     'spaced-comment': ['error', 'always'],
     'no-console': 2,

.github/workflows/build.yml

@@ -18,6 +18,7 @@ concurrency:
 jobs:
   qa:
     # For QA (lint, test, etc), Linux is enough
+    # https://github.com/tauri-apps/tauri-action/issues/745#issuecomment-2024998604
     runs-on: ubuntu-22.04
 
     steps:
@@ -30,10 +31,10 @@ jobs:
 
       - uses: actions-rust-lang/setup-rust-toolchain@v1
 
-      - name: install dependencies (ubuntu only)
+      - name: Install dependencies (ubuntu only)
         run: |
           sudo apt-get update
-          sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.0-dev libappindicator3-dev librsvg2-dev patchelf
+          sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf
 
       - name: Install dependencies
         run: yarn install --frozen-lockfile
@@ -53,21 +54,21 @@ jobs:
       - name: 'Test: unit'
         run: 'yarn run test:unit'
 
-      - name: 'Test: typings'
+      - name: 'Test: Rust + Code Generation'
+        run: 'cargo test --manifest-path src-tauri/Cargo.toml'
+
+      - name: 'Test: Types'
         run: 'yarn run test:typings'
 
       - name: Build application
         run: yarn run build
 
-      # - uses: actions/upload-artifact@v4
-      #   with:
-      #     name: application-build
-      #     path: dist/
-
   # Documentation on environments:
   # https://docs.github.com/en/free-pro-team@latest/actions/reference/specifications-for-github-hosted-runners
 
   binaries:
+    needs: qa
+
     permissions:
       contents: write
     strategy:
@@ -84,21 +85,20 @@ jobs:
         with:
           node-version: 20
 
-      - name: install Rust stable
+      - name: Install Rust stable
         uses: dtolnay/rust-toolchain@stable
 
-      - name: install dependencies (ubuntu only)
+      - name: Install native dependencies (ubuntu only)
         if: matrix.platform == 'ubuntu-22.04'
         run: |
           sudo apt-get update
           sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf
 
-      - name: install frontend dependencies
+      - name: Install frontend dependencies
         run: yarn install --frozen-lockfile
 
       - uses: tauri-apps/tauri-action@v0
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         with:
-          includeRelease: false
           includeUpdaterJson: false

src-tauri/src/libs/events.rs

@@ -4,8 +4,9 @@ use ts_rs::TS;
 #[derive(Serialize, Deserialize, Debug, Clone, TS, strum::Display, strum::AsRefStr)]
 #[ts(export, export_to = "../src/generated/typings/IPCEvent.ts")]
 pub enum IPCEvent<'a> {
+    Unknown(&'a str),
     // Playback-related events
-    PlaybackPlay(&'a str),
+    PlaybackPlay,
     PlaybackPause,
     PlaybackStop,
     PlaybackPlayPause,

src/components/DropzoneImport/DropzoneImport.tsx

@@ -8,7 +8,7 @@ import { /** useEffect,*/ useState } from 'react';
 import styles from './DropzoneImport.module.css';
 
 export default function DropzoneImport() {
-  const [isShown, setIsShown] = useState(false);
+  const [isShown, _setIsShown] = useState(false);
 
   // const unlisten = await getCurrent().onFileDropEvent((event) => {
   //   if (event.payload.type === 'hover') {

src/components/Events/IPCPlayerEvents.tsx

@@ -1,53 +1,53 @@
 import { useEffect } from 'react';
+import { getCurrent } from '@tauri-apps/api/webviewWindow';
 
-import channels from '../../lib/ipc-channels';
 import { usePlayerAPI } from '../../stores/usePlayerStore';
 import player from '../../lib/player';
+import { IPCEvent } from '../../generated/typings';
 
 /**
- * Handle app-level IPC Events init and cleanup
+ * Handle back-end events attempting to control the player
+ * IMPROVE ME: this should probably be refactored in some ways, the player should
+ * send Tauri events, and there should only be listeners here.
  */
 function IPCPlayerEvents() {
   const playerAPI = usePlayerAPI();
 
   useEffect(() => {
-    function play() {
-      playerAPI.play();
-    }
+    const { listen, emit } = getCurrent();
 
-    function onPlay() {
+    function emitPlayToBackEnd() {
       const track = player.getTrack();
 
       if (!track) throw new Error('Track is undefined');
 
-      ipcRenderer.send(channels.PLAYBACK_PLAY, track ?? null);
-      ipcRenderer.send(channels.PLAYBACK_TRACK_CHANGE, track);
+      emit('PlaybackPlay' satisfies IPCEvent, track ?? null);
+      emit('PlaybackTrackChange' satisfies IPCEvent, track);
     }
 
-    function onPause() {
-      ipcRenderer.send(channels.PLAYBACK_PAUSE);
+    function emitPauseToBackend() {
+      emit('PlaybackPause' satisfies IPCEvent);
     }
 
-    ipcRenderer.on(channels.PLAYBACK_PLAY, play);
-    ipcRenderer.on(channels.PLAYBACK_PAUSE, playerAPI.pause);
-    ipcRenderer.on(channels.PLAYBACK_PLAYPAUSE, playerAPI.playPause);
-    ipcRenderer.on(channels.PLAYBACK_PREVIOUS, playerAPI.previous);
-    ipcRenderer.on(channels.PLAYBACK_NEXT, playerAPI.next);
-    ipcRenderer.on(channels.PLAYBACK_STOP, playerAPI.stop);
+    const unlisteners = [
+      listen('PlaybackPlay' satisfies IPCEvent, playerAPI.play),
+      listen('PlaybackPause' satisfies IPCEvent, playerAPI.pause),
+      listen('PlaybackPlayPause' satisfies IPCEvent, playerAPI.playPause),
+      listen('PlaybackPrevious' satisfies IPCEvent, playerAPI.previous),
+      listen('PlaybackNext' satisfies IPCEvent, playerAPI.next),
+      listen('PlaybackStop' satisfies IPCEvent, playerAPI.stop),
+    ];
 
-    player.getAudio().addEventListener('play', onPlay);
-    player.getAudio().addEventListener('pause', onPause);
+    player.getAudio().addEventListener('play', emitPlayToBackEnd);
+    player.getAudio().addEventListener('pause', emitPauseToBackend);
 
     return function cleanup() {
-      ipcRenderer.off(channels.PLAYBACK_PLAY, play);
-      ipcRenderer.off(channels.PLAYBACK_PAUSE, playerAPI.pause);
-      ipcRenderer.off(channels.PLAYBACK_PLAYPAUSE, playerAPI.playPause);
-      ipcRenderer.off(channels.PLAYBACK_PREVIOUS, playerAPI.previous);
-      ipcRenderer.off(channels.PLAYBACK_NEXT, playerAPI.next);
-      ipcRenderer.off(channels.PLAYBACK_STOP, playerAPI.stop);
-
-      player.getAudio().removeEventListener('play', onPlay);
-      player.getAudio().removeEventListener('pause', onPause);
+      Promise.all(unlisteners).then((values) => {
+        values.forEach((u) => u());
+      });
+
+      player.getAudio().removeEventListener('play', emitPlayToBackEnd);
+      player.getAudio().removeEventListener('pause', emitPauseToBackend);
     };
   }, [playerAPI]);
 

src/components/PlaylistsNav/PlaylistsNav.tsx

@@ -8,6 +8,7 @@ import PlaylistsAPI from '../../stores/PlaylistsAPI';
 import PlaylistsNavLink from '../PlaylistsNavLink/PlaylistsNavLink';
 import { Playlist } from '../../generated/typings';
 import { logAndNotifyError } from '../../lib/utils';
+import library from '../../lib/library';
 
 import styles from './PlaylistsNav.module.css';
 
@@ -46,7 +47,7 @@ export default function PlaylistsNav(props: Props) {
         MenuItem.new({
           text: 'Export',
           action: async () => {
-            await PlaylistsAPI.exportToM3u(playlistID);
+            await library.exportPlaylist(playlistID);
           },
         }),
       ]);

src/lib/library.ts

@@ -3,7 +3,7 @@ import { convertFileSrc, invoke } from '@tauri-apps/api/core';
 import type { Playlist, Track } from '../generated/typings';
 
 /**
- * Library Bridge for the UI to communicate with the backend
+ * Bridge for the UI to communicate with the backend and manipulate the Database
  */
 const library = {
   // ---------------------------------------------------------------------------
@@ -20,8 +20,8 @@ const library = {
     });
   },
 
-  async updateTrack(track: Track) {
-    // TODO:
+  // TODO:
+  async updateTrack(_track: Track) {
     throw new Error('Not implemented');
   },
 
@@ -75,6 +75,11 @@ const library = {
     });
   },
 
+  // TODO: m3u export
+  async exportPlaylist(_playlistID: string): Promise<void> {
+    throw new Error('not implemented');
+  },
+
   async deletePlaylist(id: string): Promise<void> {
     return invoke('plugin:database|delete_playlist', {
       id,
@@ -99,8 +104,6 @@ const library = {
 
     return cover.startsWith('data:') ? cover : convertFileSrc(cover);
   },
-
-  // removeTracks
 };
 
 export default library;

src/stores/PlaylistsAPI.ts

@@ -1,5 +1,4 @@
-import { Playlist, Track } from '../generated/typings';
-import channels from '../lib/ipc-channels';
+import { Playlist } from '../generated/typings';
 import router from '../views/router';
 import library from '../lib/library';
 import { logAndNotifyError } from '../lib/utils';
@@ -165,21 +164,6 @@ const reorderTracks = async (
   }
 };
 
-/**
- * a playlist to a .m3u file
- * TODO: investigate why the playlist path are relative, and not absolute
- */
-const exportToM3u = async (playlistID: string): Promise<void> => {
-  const playlist: Playlist = await library.getPlaylist(playlistID);
-  const tracks: Track[] = await library.getTracks(playlist.tracks);
-
-  ipcRenderer.send(
-    channels.PLAYLIST_EXPORT,
-    playlist.name,
-    tracks.map((track) => track.path),
-  );
-};
-
 // Should we use something else to harmonize between zustand and non-store APIs?
 const PlaylistsAPI = {
   play,
@@ -190,7 +174,6 @@ const PlaylistsAPI = {
   reorderTracks,
   removeTracks,
   duplicate,
-  exportToM3u,
 };
 
 export default PlaylistsAPI;

src/views/Root.tsx

@@ -10,10 +10,8 @@ import DropzoneImport from '../components/DropzoneImport/DropzoneImport';
 import MediaSessionEvents from '../components/Events/MediaSessionEvents';
 import AppEvents from '../components/Events/AppEvents';
 import PlayerEvents from '../components/Events/PlayerEvents';
-// import IPCPlayerEvents from "../components/Events/IPCPlayerEvents";
-// import IPCNavigationEvents from "../components/Events/IPCNavigationEvents";
+import IPCPlayerEvents from '../components/Events/IPCPlayerEvents';
 import GlobalKeyBindings from '../components/Events/GlobalKeyBindings';
-// import { useLibraryAPI } from "../stores/useLibraryStore";
 import SettingsAPI from '../stores/SettingsAPI';
 import IPCNavigationEvents from '../components/Events/IPCNavigationEvents';
 import LibraryEvents from '../components/Events/LibraryEvents';
@@ -34,9 +32,8 @@ export default function ViewRoot() {
   return (
     <div className={`${styles.root} os__${window.__MUSEEKS_PLATFORM}`}>
       {/** Bunch of global event handlers */}
-      {/** TODO: */}
       <IPCNavigationEvents />
-      {/* <IPCPlayerEvents />*/}
+      <IPCPlayerEvents />
       <AppEvents />
       <LibraryEvents />
       <PlayerEvents />