userplugins/vcPanelSettings
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

reorganise settings and add collapsing

Browse source
This commit is contained in:
nin0dev 2024-12-25 17:06:39 -05:00
parent 2c232ba04d
commit d863cf300e
Signed by: nin0
SSH key fingerprint: SHA256:Is2DvJdw1OkSopR4wKJfdWV0fZhMLxpnCs1P1nPhIgA
2 changed files with 57 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
index.tsx
View file

@ -1,3 +1,5 @@
import "./style.css";
import { definePluginSettings } from "@api/Settings";
import { Devs } from "@utils/constants";
import definePlugin, { OptionType } from "@utils/types";
@ -110,11 +112,20 @@ function InputDeviceComponent() {
}
function VoiceSettings() {
const [showSettings, setShowSettings] = useState(Settings.plugins.VCPanelSettings.uncollapseSettingsByDefault);
return <div style={{ marginTop: "20px" }}>
{Settings.plugins.VCPanelSettings.outputVolume && <OutputVolumeComponent />}
{Settings.plugins.VCPanelSettings.inputVolume && <InputVolumeComponent />}
{Settings.plugins.VCPanelSettings.outputDevice && <OutputDeviceComponent />}
{Settings.plugins.VCPanelSettings.inputDevice && <InputDeviceComponent />}
<div style={{ marginBottom: "10px" }}>
<Link className="vc-panelsettings-underline-on-hover" style={{ color: "var(--header-secondary)" }} onClick={() => { setShowSettings(!showSettings); }}>{!showSettings ? "► Settings" : "▼ Hide"}</Link>
</div>
{
showSettings && <>
{Settings.plugins.VCPanelSettings.outputVolume && <OutputVolumeComponent />}
{Settings.plugins.VCPanelSettings.inputVolume && <InputVolumeComponent />}
{Settings.plugins.VCPanelSettings.outputDevice && <OutputDeviceComponent />}
{Settings.plugins.VCPanelSettings.inputDevice && <InputDeviceComponent />}
</>
}
</div>;
}
@ -123,46 +134,67 @@ export default definePlugin({
description: "Control voice settings right from the voice panel",
authors: [Devs.nin0dev],
settings: definePluginSettings({
showOutputVolumeHeader: {
title1: {
type: OptionType.COMPONENT,
component: () => <Text style={{ fontWeight: "bold", fontSize: "1.27rem" }}>Appearance</Text>,
description: ""
},
uncollapseSettingsByDefault: {
type: OptionType.BOOLEAN,
default: true,
description: "Show header above output volume slider"
default: false,
description: "Automatically uncollapse voice settings by default"
},
title2: {
type: OptionType.COMPONENT,
component: () => <Text style={{ fontWeight: "bold", fontSize: "1.27rem" }}>Settings to show</Text>,
description: ""
},
outputVolume: {
type: OptionType.BOOLEAN,
default: true,
description: "Show an output volume slider"
},
showInputVolumeHeader: {
type: OptionType.BOOLEAN,
default: true,
description: "Show header above input volume slider"
},
inputVolume: {
type: OptionType.BOOLEAN,
default: true,
description: "Show an input volume slider"
},
showOutputDeviceHeader: {
type: OptionType.BOOLEAN,
default: false,
description: "Show header above output device slider"
},
outputDevice: {
type: OptionType.BOOLEAN,
default: true,
description: "Show an output device selector"
},
inputDevice: {
type: OptionType.BOOLEAN,
default: true,
description: "Show an input device selector"
},
title3: {
type: OptionType.COMPONENT,
component: () => <Text style={{ fontWeight: "bold", fontSize: "1.27rem" }}>Headers to show</Text>,
description: ""
},
showOutputVolumeHeader: {
type: OptionType.BOOLEAN,
default: true,
description: "Show header above output volume slider"
},
showInputVolumeHeader: {
type: OptionType.BOOLEAN,
default: true,
description: "Show header above input volume slider"
},
showOutputDeviceHeader: {
type: OptionType.BOOLEAN,
default: false,
description: "Show header above output device slider"
},
showInputDeviceHeader: {
type: OptionType.BOOLEAN,
default: false,
description: "Show header above input device slider"
},
inputDevice: {
type: OptionType.BOOLEAN,
default: true,
description: "Show an input device selector"
}
}),
renderVoiceSettings() { return <VoiceSettings />; },
patches: [

3
style.css Normal file
View file

@ -0,0 +1,3 @@
.vc-panelsettings-underline-on-hover:hover {
text-decoration: underline;
}