wip: discord presence

src/lib/global.ts

@@ -9,6 +9,9 @@ export const currentView = writable<Component>(Loading);
 export const launcherVersion = writable<string>('');
 export const newVersion = writable<Release | undefined>(undefined);
 
+export const discordPresence = writable<boolean>(false);
+export const presenceLoading = writable<boolean>(false);
+
 export const currentLoadingInfo = writable<string>('Initializing...');
 
 export const firstStartup = writable<boolean>(false);

src/lib/presence.ts

@@ -0,0 +1,17 @@
+import { invoke } from '@tauri-apps/api/core';
+
+export const connect = async () => await invoke('presence_connect');
+export const disconnect = async () => await invoke('presence_disconnect');
+export const updateStatus = async (status: {
+  state?: string;
+  details?: string;
+  large_image_key?: string;
+}) =>
+  await invoke('presence_update_status', {
+    state: status.state,
+    details: status.details,
+    largeImageKey: status.large_image_key,
+  });
+export const updateUser = async (user: { username: string; id: string }) =>
+  await invoke('presence_update_user', { username: user.username, id: user.id });
+export const isConnected = async () => await invoke<boolean>('presence_is_connected');

src/pages/Launch.svelte

@@ -8,11 +8,13 @@
     beatmapSets,
     currentSkin,
     currentView,
+    discordPresence,
     launcherVersion,
     launching,
     newVersion,
     osuBuild,
     osuStream,
+    presenceLoading,
     serverConnectionFails,
     serverPing,
     skins,
@@ -953,13 +955,13 @@
             ></Checkbox>
 
             <div class="flex flex-col">
-              <Label class="text-sm" for="setting-cursor-smoothening">Reduce Animations</Label>
+              <Label class="text-sm" for="setting-reduce-animations">Reduce Animations</Label>
               <div class="text-muted-foreground text-xs">
                 Disables some animations in the Launcher to improve performance on low-end devices.
               </div>
             </div>
             <Checkbox
-              id="setting-cursor-smoothening"
+              id="setting-reduce-animations"
               checked={$reduceAnimations}
               onCheckedChange={async (e) => {
                 reduceAnimations.set(e);
@@ -967,6 +969,26 @@
               }}
               class="flex items-center justify-center w-5 h-5"
             ></Checkbox>
+
+            <div class="flex flex-col">
+              <Label class="text-sm" for="setting-rich-presence">Discord Rich Presence</Label>
+              <div class="text-muted-foreground text-xs">
+                Let other discord users show what you are doing right now 👀
+              </div>
+            </div>
+            <div class="relative">
+              {#if $presenceLoading}
+                <div class="-left-8 absolute" transition:fade>
+                  <LoaderCircle class="animate-spin" />
+                </div>
+              {/if}
+              <Checkbox
+                id="setting-rich-presence"
+                bind:checked={$discordPresence}
+                disabled={$presenceLoading}
+                class="flex items-center justify-center w-5 h-5"
+              ></Checkbox>
+            </div>
           </div>
           <div
             class="grid grid-cols-[0.7fr_auto] gap-y-5 items-center border-theme-800 pl-6 pr-5 pb-4"

src/routes/+layout.svelte

@@ -4,7 +4,14 @@
 
   import Titlebar from '@/components/ui/titlebar/titlebar.svelte';
   import * as AlertDialog from '@/components/ui/alert-dialog';
-  import { currentLoadingInfo, firstStartup, launcherVersion, setupValues } from '@/global';
+  import {
+    currentLoadingInfo,
+    discordPresence,
+    firstStartup,
+    launcherVersion,
+    presenceLoading,
+    setupValues,
+  } from '@/global';
   import { onMount } from 'svelte';
   import OsuCursor from '@/components/ui/osu-cursor/OsuCursor.svelte';
   import {
@@ -20,6 +27,7 @@
   import { userAuth } from '@/userAuthentication';
   import { exit, getLauncherVersion, getPlatform } from '@/osuUtil';
   import Button from '@/components/ui/button/button.svelte';
+  import * as presence from '@/presence';
 
   import '@fontsource/sora';
   import '@fontsource/space-mono';
@@ -92,17 +100,39 @@
     const config_cursor_smoothening = $userSettings.value('cursor_smoothening');
     const config_reduce_animations = $userSettings.value('reduce_animations');
     const config_osu_installation_path = $userSettings.value('osu_installation_path');
+    const config_discord_presence = $userSettings.value('discord_presence');
 
     patch.set(config_patching.get(true));
     customCursor.set(config_custom_cursor.get(true));
     cursorSmoothening.set(config_cursor_smoothening.get(true));
     reduceAnimations.set(config_reduce_animations.get(false));
     osuInstallationPath.set(config_osu_installation_path.get(''));
+    discordPresence.set(config_discord_presence.get(true));
+
+    try {
+      if ($discordPresence) {
+        presenceLoading.set(true);
+        await presence.connect();
+        presenceLoading.set(false);
+      }
+    } catch {}
 
     patch.subscribe((val) => config_patching.set(val));
     customCursor.subscribe((val) => config_custom_cursor.set(val));
     cursorSmoothening.subscribe((val) => config_cursor_smoothening.set(val));
     reduceAnimations.subscribe((val) => config_reduce_animations.set(val));
+    discordPresence.subscribe(async (val) => {
+      config_discord_presence.set(val);
+      try {
+        presenceLoading.set(true);
+        if (val) {
+          await presence.connect();
+        } else {
+          await presence.disconnect();
+        }
+        presenceLoading.set(false);
+      } catch {}
+    });
 
     firstStartup.set(isFirstStartup);
   });