Refactored status card

src/app/app.ts

@@ -7,6 +7,8 @@ import { base58 } from "@scure/base";
 import axios from "axios";
 import { Account, AccountsFile, getAccounts } from "@/lib/accounts";
 import { Page } from "@/components/page/PageView";
+import { Channel } from "@/lib/types";
+import { invoke } from "@tauri-apps/api/core";
 import { ClientMethod } from "./protocol";
 import { Config, getConfig } from "@/lib/config";
 
@@ -152,6 +154,44 @@ export default class Enclave<P = Page> {
     this.forceRender();
   }
 
+  public joinVoice(channel: Channel) {
+    const server = this.server;
+
+    if (!server || channel.kind !== "voice") return;
+
+    server.voiceJoin = (pin, channelId) => {
+      invoke("connect_to_vc", { hostname: server.hostname, pin, channelId })
+        .then(() => {
+          server.isInVoiceChat = true;
+          server.voiceChannelId = channelId;
+          this.forceRender();
+        })
+        .catch(console.error);
+    };
+
+    server.isInVoiceChat = true;
+    server.voiceChannelId = channel.id;
+
+    server.websocket?.send({ method: "JoinVoice", channel_id: channel.id });
+
+    this.forceRender();
+  }
+
+  public leaveVoice() {
+    const server = this.server;
+
+    if (!server || !server.isInVoiceChat) return;
+
+    server.websocket?.send({ method: "LeaveVoice" });
+    invoke("disconnect_from_vc").catch(console.error);
+
+    server.isInVoiceChat = false;
+    server.voiceChannelId = undefined;
+    server.voiceChatSpeakers = {};
+
+    this.forceRender();
+  }
+
   public async onMessage(msg: ClientMethod) {
     const server = this.server;
 

src/app/server.ts

@@ -36,6 +36,8 @@ export default class EnclaveServer {
   public voiceJoin?: (pin: bigint, channelId: string) => void;
   public voiceChatUsers: Record<string, string[]>;
   public voiceChatSpeakers: Record<string, NodeJS.Timeout>;
+  public isInVoiceChat: boolean;
+  public voiceChannelId?: string;
 
   public constructor(hostname: string, isSecure: boolean) {
     this.hostname = hostname;
@@ -44,6 +46,7 @@ export default class EnclaveServer {
     this.users = {};
     this.voiceChatUsers = {};
     this.voiceChatSpeakers = {};
+    this.isInVoiceChat = false;
   }
 
   public disconnect() {