Add deafen button

src/pages/channels/voice/VoiceHeader.tsx

@@ -11,6 +11,18 @@ import { useClient } from "../../../context/revoltjs/RevoltClient";
 
 import UserIcon from "../../../components/common/user/UserIcon";
 import Button from "../../../components/ui/Button";
+import {
+    Megaphone,
+    Microphone,
+    MicrophoneOff,
+    PhoneOff,
+    Speaker,
+    VolumeFull,
+    VolumeMute
+} from "@styled-icons/boxicons-solid";
+import Tooltip from "../../../components/common/Tooltip";
+import {Hashnode, Speakerdeck, Teamspeak} from "@styled-icons/simple-icons";
+import VoiceClient from "../../../lib/vortex/VoiceClient";
 
 interface Props {
     id: string;
@@ -89,7 +101,8 @@ export default observer(({ id }: Props) => {
                                       target={user}
                                       status={false}
                                       voice={
-                                          voiceState.participants!.get(id)
+                                          client.user?._id === id && voiceState.isDeaf()?"deaf"
+                                              : voiceState.participants!.get(id)
                                               ?.audio
                                               ? undefined
                                               : "muted"
@@ -115,18 +128,38 @@ export default observer(({ id }: Props) => {
                 )}
             </div>
             <div className="actions">
-                <Button error onClick={voiceState.disconnect}>
-                    <Text id="app.main.channel.voice.leave" />
-                </Button>
+                <Tooltip content={"Leave call"} placement={"bottom"}>
+                    <Button error onClick={voiceState.disconnect}>
+                        <PhoneOff width={25} />
+                    </Button>
+                </Tooltip>
                 {voiceState.isProducing("audio") ? (
-                    <Button onClick={() => voiceState.stopProducing("audio")}>
-                        <Text id="app.main.channel.voice.mute" />
-                    </Button>
+                        <Tooltip content={"Mute microphone"} placement={"bottom"}>
+                            <Button onClick={() => voiceState.stopProducing("audio")}>
+                                <Microphone width={25} />
+                            </Button>
+                        </Tooltip>
                 ) : (
-                    <Button onClick={() => voiceState.startProducing("audio")}>
-                        <Text id="app.main.channel.voice.unmute" />
-                    </Button>
+                    <Tooltip content={"Unmute microphone"} placement={"bottom"}>
+                        <Button onClick={() => voiceState.startProducing("audio")}>
+                            <MicrophoneOff width={25} />
+                        </Button>
+                    </Tooltip>
                 )}
+                {voiceState.isDeaf() ? (
+                    <Tooltip content={"Deafen"} placement={"bottom"}>
+                        <Button onClick={() => voiceState.stopDeafen()}>
+                            <VolumeMute width={25} />
+                        </Button>
+                    </Tooltip>
+                ): (
+                    <Tooltip content={"Deafen"} placement={"bottom"}>
+                        <Button onClick={() => voiceState.startDeafen()}>
+                            <VolumeFull width={25} />
+                        </Button>
+                    </Tooltip>
+                )
+                }
             </div>
         </VoiceBase>
     );

src/pages/settings/Settings.tsx

@@ -15,6 +15,7 @@ import {
     Flask,
     User,
     Megaphone,
+    Shield,
 } from "@styled-icons/boxicons-solid";
 import { Route, Switch, useHistory } from "react-router-dom";
 import { LIBRARY_VERSION } from "revolt.js";
@@ -76,6 +77,11 @@ export default function Settings() {
                     icon: <IdCard size={20} />,
                     title: <Text id="app.settings.pages.profile.title" />,
                 },
+                {
+                    id: "privacy",
+                    icon: <Shield size={20} />,
+                    title: <Text id="app.settings.pages.profile.title" />,
+                },
                 {
                     id: "sessions",
                     icon: <CheckShield size={20} />,

src/pages/settings/panes/Privacy.tsx

@@ -0,0 +1,36 @@
+import styles from "./Panes.module.scss";
+import { Text } from "preact-i18n";
+
+import { dispatch } from "../../../redux";
+import { connectState } from "../../../redux/connector";
+import { SyncKeys, SyncOptions } from "../../../redux/reducers/sync";
+
+import Checkbox from "../../../components/ui/Checkbox";
+
+interface Props {
+    options?: SyncOptions;
+}
+
+export function Component(props: Props) {
+    return (
+        <div className={styles.notifications}>
+            <Checkbox
+                key={"everyone_dm"}
+                checked={false}
+                description={
+                    <Text
+                        id={`app.settings.pages.privacy.allow_dms.d`}
+                    />
+                }
+                onChange={(enabled) => {console.log(enabled)}}>
+                <Text id="app.settings.pages.privacy.allow_dms.t" />
+            </Checkbox>
+        </div>
+    );
+}
+
+export const Sync = connectState(Component, (state) => {
+    return {
+        options: state.sync,
+    };
+});

src/pages/settings/server/Overview.tsx

@@ -152,7 +152,7 @@ export const Overview = observer(({ server }: Props) => {
                             <Text id="general.disabled" />
                         </option>
                         {server.channels
-                            .filter((x) => typeof x !== "undefined")
+                            .filter((x) => (typeof x !== "undefined" && x.channel_type === "TextChannel"))
                             .map((channel) => (
                                 <option key={channel!._id} value={channel!._id}>
                                     {getChannelName(channel!, true)}