Updated customVoicePlugins: Added settingsModal

src/plugins/customVoiceFilter/SettingsModal.tsx

@@ -0,0 +1,78 @@
+/*
+ * Vencord, a Discord client mod
+ * Copyright (c) 2025 Vendicated and contributors
+ * SPDX-License-Identifier: GPL-3.0-or-later
+ */
+
+import { Margins } from "@utils/margins";
+import { closeModal, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
+import { Button, Flex, Forms, Slider } from "@webpack/common";
+import { JSX } from "react";
+
+import plugin, { settings } from "./index";
+
+
+export function openSettingsModal(): string {
+    const key = openModal(modalProps => (
+        <SettingsModal modalProps={modalProps} close={() => closeModal(key)} />
+    ));
+    return key;
+}
+
+interface SettingsModalProps {
+    modalProps: ModalProps;
+    close: () => void;
+}
+
+
+//  Create Voice Filter Modal
+function SettingsModal({ modalProps, close }: SettingsModalProps): JSX.Element {
+    const settingsState = settings.use();
+    const { settings: { def } } = plugin;
+
+    return (
+        <ModalRoot {...modalProps} size={ModalSize.MEDIUM}>
+            <ModalHeader>
+                <Forms.FormTitle tag="h2" className="modalTitle">
+                    Settings
+                </Forms.FormTitle>
+                <ModalCloseButton onClick={close} />
+            </ModalHeader>
+            <ModalContent className="vc-voice-filters-modal">
+                <Flex style={{ gap: "1rem" }} direction={Flex.Direction.VERTICAL}>
+                    <Forms.FormSection>
+                        <Forms.FormTitle>Pitch</Forms.FormTitle>
+                        <Forms.FormText className={Margins.bottom20} type="description">{def.pitch.description}</Forms.FormText>
+                        <Slider
+                            markers={def.pitch.markers}
+                            minValue={def.pitch.markers[0]}
+                            maxValue={def.pitch.markers.at(-1)}
+                            initialValue={settingsState.pitch ?? def.pitch.default}
+                            onValueChange={value => settingsState.pitch = value}
+                            onValueRender={value => `${value}`}
+                            stickToMarkers={true}
+                        />
+                    </Forms.FormSection>
+                    <Forms.FormSection>
+                        <Forms.FormTitle>Frequency</Forms.FormTitle>
+                        <Forms.FormText className={Margins.bottom20} type="description">{def.frequency.description}</Forms.FormText>
+                        <Slider
+                            markers={def.frequency.markers}
+                            minValue={def.frequency.markers[0]}
+                            maxValue={def.frequency.markers.at(-1)}
+                            initialValue={settingsState.frequency ?? def.frequency.default}
+                            onValueChange={value => settingsState.frequency = value}
+                            onValueRender={value => `${value}Hz`}
+                            stickToMarkers={true}
+                        />
+                    </Forms.FormSection>
+                </Flex>
+            </ModalContent>
+            <ModalFooter>
+                <Flex style={{ gap: "0.5rem" }} justify={Flex.Justify.END} align={Flex.Align.CENTER}>
+                    <Button color={Button.Colors.GREEN} onClick={close} >Save & Exit</Button>
+                </Flex>
+            </ModalFooter>
+        </ModalRoot>
+    );
+}

src/plugins/customVoiceFilter/VoiceFiltersModal.tsx

@@ -14,6 +14,7 @@ import { openCreateVoiceModal } from "./CreateVoiceFilterModal";
 import { openHelpModal } from "./HelpModal";
 import { DownloadIcon, DownloadingIcon, PauseIcon, PlayIcon, RefreshIcon, TrashIcon } from "./Icons";
 import { downloadCustomVoiceModel, getClient, IVoiceFilter, useVoiceFiltersStore, VoiceFilterStyles } from "./index";
+import { openSettingsModal } from "./SettingsModal";
 import { cl, useAudio } from "./utils";
 import { openWikiHomeModal } from "./WikiHomeModal";
 
@@ -86,6 +87,7 @@ function VoiceFiltersModal({ modalProps, close, accept }: VoiceFiltersModalProps
             </ModalContent>
             <ModalFooter>
                 <Flex style={{ gap: "0.5rem" }} justify={Flex.Justify.END} align={Flex.Align.CENTER}>
+                    <Button color={Button.Colors.TRANSPARENT} onClick={openSettingsModal}>Settings</Button>
                     <Button color={Button.Colors.TRANSPARENT} onClick={openHelpModal}>Learn how to build your own voicepack</Button>
                     <Button color={Button.Colors.TRANSPARENT} onClick={() => openCreateVoiceModal()}>Create Voicepack</Button>
                     <Button color={Button.Colors.GREEN} onClick={openWikiHomeModal}>Wiki</Button>

src/plugins/customVoiceFilter/index.tsx

@@ -8,10 +8,11 @@
 import "./style.css";
 
 import { DataStore } from "@api/index";
+import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
 import { proxyLazy } from "@utils/lazy";
 import { closeModal } from "@utils/modal";
-import definePlugin, { PluginNative } from "@utils/types";
+import definePlugin, { OptionType, PluginNative } from "@utils/types";
 import { filters, findAll, findByProps, findStore } from "@webpack";
 import { zustandCreate, zustandPersist } from "@webpack/common";
 
@@ -290,6 +291,21 @@ export const requiredFields = [
     "temporarilyAvailable"
 ] as const;
 
+export const settings = definePluginSettings({
+    pitch: {
+        type: OptionType.SLIDER,
+        markers: Array.from({ length: 25 }, (_, i) => i - 12),
+        default: 0,
+        description: "Pitch of the voice",
+    },
+    frequency: {
+        type: OptionType.SLIDER,
+        markers: Array.from({ length: 13 }, (_, i) => 4000 * i),
+        default: 24000,
+        description: "Frequency of the voice",
+    }
+});
+
 export default definePlugin({
     name: "CustomVoiceFilters",
     description: "Custom voice filters for your voice channels.",
@@ -297,6 +313,7 @@ export default definePlugin({
         Devs.fox3000foxy,
         Devs.davr1,
     ],
+    settings,
     renderChatBarButton: CustomVoiceFilterChatBarIcon,
     async start() {
         console.log("CustomVoiceFilters started");