[Tauri] Working CI (#762)

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

.eslintrc.cjs

@@ -1,43 +1,44 @@
-/* eslint-env node */
-module.exports = {
-  env: {
-    node: true,
-  },
-  root: true,
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    // maybe one day, enable the following:
-    // "plugin:@typescript-eslint/recommended-requiring-type-checking:"
-    // "plugin:@typescript-eslint/stylistic-type-checked",
-    'plugin:jsx-a11y/recommended',
-    'plugin:import/recommended',
-    'plugin:import/typescript',
-    'plugin:jsx-a11y/recommended',
-    'plugin:react/recommended',
-    'plugin:react/jsx-runtime',
-    'plugin:react-hooks/recommended',
-    'prettier',
-  ],
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    project: true,
-    project: ['./tsconfig.json'],
-    tsconfigRootDir: __dirname,
-  },
-  settings: { react: { version: 'detect' } },
-  plugins: ['@typescript-eslint', 'jsx-a11y', 'import'],
-  rules: {
-    'import/order': [
-      'error',
-      {
-        'newlines-between': 'always',
-        distinctGroup: true,
-      },
-    ],
-    // We let TypeScript and Vite handle that
-    'import/no-unresolved': 'off',
-    'spaced-comment': ['error', 'always'],
-    'no-console': 2,
-  },
-};
+/* eslint-env node */
+module.exports = {
+  env: {
+    node: true,
+  },
+  root: true,
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    // maybe one day, enable the following:
+    // "plugin:@typescript-eslint/recommended-requiring-type-checking:"
+    // "plugin:@typescript-eslint/stylistic-type-checked",
+    'plugin:jsx-a11y/recommended',
+    'plugin:import/recommended',
+    'plugin:import/typescript',
+    'plugin:jsx-a11y/recommended',
+    'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
+    'plugin:react-hooks/recommended',
+    'prettier',
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    project: true,
+    project: ['./tsconfig.json'],
+    tsconfigRootDir: __dirname,
+  },
+  settings: { react: { version: 'detect' } },
+  plugins: ['@typescript-eslint', 'jsx-a11y', 'import'],
+  rules: {
+    'import/order': [
+      'error',
+      {
+        'newlines-between': 'always',
+        distinctGroup: true,
+      },
+    ],
+    // 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

@@ -1,104 +1,104 @@
-name: build
-
-on:
-  # Trigger the workflow on push or pull request,
-  # but only for the main branch
-  push:
-    branches:
-      - master
-  pull_request:
-    branches:
-      - '*'
-  workflow_dispatch:
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  qa:
-    # For QA (lint, test, etc), Linux is enough
-    runs-on: ubuntu-22.04
-
-    steps:
-      - uses: actions/checkout@v4
-
-      - name: Use Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - uses: actions-rust-lang/setup-rust-toolchain@v1
-
-      - 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
-
-      - name: Install dependencies
-        run: yarn install --frozen-lockfile
-
-      - name: Generate types
-        run: cargo test --manifest-path src-tauri/Cargo.toml
-
-      - name: 'Test: formatting'
-        run: 'yarn run test:formatting'
-
-      - name: 'Test: TS/JS linting'
-        run: 'yarn run test:lint'
-
-      - name: 'Test: CSS linting'
-        run: 'yarn run test:css'
-
-      - name: 'Test: unit'
-        run: 'yarn run test:unit'
-
-      - name: 'Test: typings'
-        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:
-    permissions:
-      contents: write
-    strategy:
-      fail-fast: false
-      matrix:
-        platform: [macos-latest, ubuntu-22.04, windows-latest]
-
-    runs-on: ${{ matrix.platform }}
-    steps:
-      - uses: actions/checkout@v4
-
-      - name: setup node
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: install Rust stable
-        uses: dtolnay/rust-toolchain@stable
-
-      - name: install 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
-        run: yarn install --frozen-lockfile
-
-      - uses: tauri-apps/tauri-action@v0
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        with:
-          includeRelease: false
-          includeUpdaterJson: false
+name: build
+
+on:
+  # Trigger the workflow on push or pull request,
+  # but only for the main branch
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - '*'
+  workflow_dispatch:
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: true
+
+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:
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - uses: actions-rust-lang/setup-rust-toolchain@v1
+
+      - name: Install dependencies (ubuntu only)
+        run: |
+          sudo apt-get update
+          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
+
+      - name: Generate types
+        run: cargo test --manifest-path src-tauri/Cargo.toml
+
+      - name: 'Test: formatting'
+        run: 'yarn run test:formatting'
+
+      - name: 'Test: TS/JS linting'
+        run: 'yarn run test:lint'
+
+      - name: 'Test: CSS linting'
+        run: 'yarn run test:css'
+
+      - name: 'Test: unit'
+        run: 'yarn run test:unit'
+
+      - 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
+
+  # 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:
+      fail-fast: false
+      matrix:
+        platform: [macos-latest, ubuntu-22.04, windows-latest]
+
+    runs-on: ${{ matrix.platform }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - name: Install Rust stable
+        uses: dtolnay/rust-toolchain@stable
+
+      - 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
+        run: yarn install --frozen-lockfile
+
+      - uses: tauri-apps/tauri-action@v0
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          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]);