refactor Settings UI (#3545)

Much improved file structure and cleaner code. Also gets rid of temporary settings & saving and instead applies all changes immediately.

Besides that, this change only changes code and doesn't change the ui
This commit is contained in:
V 2025-07-15 15:57:24 +02:00 committed by GitHub
parent a33e81d1cb
commit 3f51ee1b2a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
94 changed files with 2120 additions and 2002 deletions

View file

@ -17,7 +17,7 @@
*/
import { ErrorCard } from "@components/ErrorCard";
import { Devs } from "@utils/constants";
import { Devs, IS_LINUX } from "@utils/constants";
import { Logger } from "@utils/Logger";
import { Margins } from "@utils/margins";
import { wordsToTitle } from "@utils/text";
@ -44,9 +44,11 @@ const VoiceStateStore = findByPropsLazy("getVoiceStatesForChannel", "getCurrentC
// Filtering out events is not as simple as just dropping duplicates, as otherwise mute, unmute, mute would
// not say the second mute, which would lead you to believe they're unmuted
function speak(text: string, { volume, rate } = settings.store) {
function speak(text: string) {
if (!text) return;
const { volume, rate } = settings.store;
const speech = new SpeechSynthesisUtterance(text);
const voice = getCurrentVoice();
speech.voice = voice!;
@ -139,19 +141,17 @@ function updateStatuses(type: string, { deaf, mute, selfDeaf, selfMute, userId,
}
*/
function playSample(tempSettings: any, type: string) {
const s = Object.assign({}, settings.plain, tempSettings);
function playSample(type: string) {
const currentUser = UserStore.getCurrentUser();
const myGuildId = SelectedGuildStore.getGuildId();
speak(formatText(
s[type + "Message"],
settings.store[type + "Message"],
currentUser.username,
"general",
currentUser.globalName ?? currentUser.username,
GuildMemberStore.getNick(myGuildId!, currentUser.id) ?? currentUser.username),
s
);
GuildMemberStore.getNick(myGuildId!, currentUser.id) ?? currentUser.username
));
}
export default definePlugin({
@ -222,7 +222,7 @@ export default definePlugin({
},
settingsAboutComponent({ tempSettings: s }) {
settingsAboutComponent() {
const [hasVoices, hasEnglishVoices] = useMemo(() => {
const voices = speechSynthesis.getVoices();
return [voices.length !== 0, voices.some(v => v.lang.startsWith("en"))];
@ -236,7 +236,7 @@ export default definePlugin({
let errorComponent: ReactElement<any> | null = null;
if (!hasVoices) {
let error = "No narrator voices found. ";
error += navigator.platform?.toLowerCase().includes("linux")
error += IS_LINUX
? "Install speech-dispatcher or espeak and run Discord with the --enable-speech-dispatcher flag"
: "Try installing some in the Narrator settings of your Operating System";
errorComponent = <ErrorCard>{error}</ErrorCard>;
@ -265,7 +265,7 @@ export default definePlugin({
className={"vc-narrator-buttons"}
>
{types.map(t => (
<Button key={t} onClick={() => playSample(s, t)}>
<Button key={t} onClick={() => playSample(t)}>
{wordsToTitle([t])}
</Button>
))}