Miko/Vesktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' into preload-sandboxing

Browse Source
This commit is contained in:
V
2025-12-12 22:23:28 +01:00
committed by GitHub
parent 4cec16be1b da8e8f52ab
commit 81e6caa05a
24 changed files with 551 additions and 825 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
package.json
View File

@@ -36,13 +36,13 @@
"devDependencies": {
"@fal-works/esbuild-plugin-global-externals": "^2.1.2",
"@stylistic/eslint-plugin": "^5.6.1",
"@types/node": "^24.10.1",
"@types/node": "^25.0.1",
"@types/react": "19.2.1",
"@vencord/types": "^1.13.2",
"@vencord/types": "^1.13.7",
"dotenv": "^17.2.3",
"electron": "^39.2.3",
"electron": "^39.2.7",
"electron-builder": "^26.0.12",
"esbuild": "^0.27.0",
"esbuild": "^0.27.1",
"eslint": "^9.39.1",
"eslint-import-resolver-alias": "^1.1.2",
"eslint-plugin-path-alias": "^2.1.0",
@@ -52,12 +52,12 @@
"eslint-plugin-simple-import-sort": "^12.1.1",
"eslint-plugin-unused-imports": "^4.3.0",
"libvesktop": "link:packages/libvesktop",
"prettier": "^3.6.2",
"prettier": "^3.7.4",
"source-map-support": "^0.5.21",
"tsx": "^4.20.6",
"type-fest": "^5.2.0",
"tsx": "^4.21.0",
"type-fest": "^5.3.1",
"typescript": "^5.9.3",
"typescript-eslint": "^8.47.0",
"typescript-eslint": "^8.49.0",
"xml-formatter": "^3.6.7"
},
"packageManager": "pnpm@10.7.1",

901
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

5
src/main/ipc.ts
View File

@@ -156,6 +156,11 @@ handle(IpcEvents.SELECT_VENCORD_DIR, async (_e, value?: null) => {
handle(IpcEvents.SET_BADGE_COUNT, (_, count: number) => setBadgeCount(count));
handle(IpcEvents.FLASH_FRAME, (_, flag: boolean) => {
if (!mainWin || mainWin.isDestroyed() || (flag && mainWin.isFocused())) return;
mainWin.flashFrame(flag);
});
handle(IpcEvents.CLIPBOARD_COPY_IMAGE, async (_, buf: ArrayBuffer, src: string) => {
clipboard.write({
html: `<img src="${src.replaceAll('"', '\\"')}">`,

12
src/main/mainWindow.ts
View File

@@ -312,7 +312,7 @@ function buildBrowserWindowOptions(): BrowserWindowConstructorOptions {
const { staticTitle, transparencyOption, enableMenu, customTitleBar, splashTheming, splashBackground } =
Settings.store;
const { frameless, transparent, macosTranslucency } = VencordSettings.store;
const { frameless, transparent, macosVibrancyStyle } = VencordSettings.store;
const noFrame = frameless === true || customTitleBar === true;
const backgroundColor =
@@ -358,9 +358,9 @@ function buildBrowserWindowOptions(): BrowserWindowConstructorOptions {
options.titleBarStyle = "hidden";
options.trafficLightPosition = { x: 10, y: 10 };
if (macosTranslucency) {
options.vibrancy = "sidebar";
options.backgroundColor = "#ffffff00";
if (macosVibrancyStyle) {
options.vibrancy = macosVibrancyStyle;
options.backgroundColor = "#00000000";
}
}
@@ -389,6 +389,10 @@ function createMainWindow() {
return false;
});
win.on("focus", () => {
win.flashFrame(false);
});
initWindowBoundsListeners(win);
if (!isDeckGameMode && (Settings.store.tray ?? true) && process.platform !== "darwin")
initTray(win, q => (isQuitting = q));

11
src/main/settings.ts
View File

@@ -4,6 +4,7 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { type Settings as TVencordSettings } from "@vencord/types/Vencord";
import { mkdirSync, readFileSync, writeFileSync } from "fs";
import { dirname, join } from "path";
import type { Settings as TSettings, State as TState } from "shared/settings";
@@ -27,13 +28,17 @@ function loadSettings<T extends object = any>(file: string, name: string) {
const store = new SettingsStore(settings);
store.addGlobalChangeListener(o => {
mkdirSync(dirname(file), { recursive: true });
writeFileSync(file, JSON.stringify(o, null, 4));
try {
mkdirSync(dirname(file), { recursive: true });
writeFileSync(file, JSON.stringify(o, null, 4));
} catch (err) {
console.error(`Failed to save settings to ${name}.json:`, err);
}
});
return store;
}
export const Settings = loadSettings<TSettings>(SETTINGS_FILE, "Vesktop settings");
export const VencordSettings = loadSettings<any>(VENCORD_SETTINGS_FILE, "Vencord settings");
export const VencordSettings = loadSettings<TVencordSettings>(VENCORD_SETTINGS_FILE, "Vencord settings");
export const State = loadSettings<TState>(STATE_FILE, "Vesktop state");

1
src/preload/VesktopNative.ts
View File

@@ -75,6 +75,7 @@ export const VesktopNative = {
close: (key?: string) => invoke<void>(IpcEvents.CLOSE, key),
minimize: (key?: string) => invoke<void>(IpcEvents.MINIMIZE, key),
maximize: (key?: string) => invoke<void>(IpcEvents.MAXIMIZE, key),
flashFrame: (flag: boolean) => invoke<void>(IpcEvents.FLASH_FRAME, flag),
setDevtoolsCallbacks: (onOpen: () => void, onClose: () => void) => {
onDevtoolsOpen = onOpen;
onDevtoolsClose = onClose;

5
src/renderer/arrpc.ts
View File

@@ -4,6 +4,7 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import type arRpcPlugin from "@vencord/types/plugins/arRPC.web";
import { Logger } from "@vencord/types/utils";
import { findLazy, findStoreLazy, onceReady } from "@vencord/types/webpack";
import { FluxDispatcher, InviteActions } from "@vencord/types/webpack/common";
@@ -15,9 +16,7 @@ import { Settings } from "./settings";
const logger = new Logger("VesktopRPC", "#5865f2");
const StreamerModeStore = findStoreLazy("StreamerModeStore");
const arRPC = Vencord.Plugins.plugins["WebRichPresence (arRPC)"] as any as {
handleEvent(e: MessageEvent): void;
};
const arRPC = Vencord.Plugins.plugins["WebRichPresence (arRPC)"] as typeof arRpcPlugin;
onIpcCommand(IpcCommands.RPC_ACTIVITY, async jsonData => {
if (!Settings.store.arRPC) return;

174
src/renderer/components/ScreenSharePicker.tsx
View File

@@ -7,10 +7,31 @@
import "./screenSharePicker.css";
import { classNameFactory } from "@vencord/types/api/Styles";
import { CogWheel, FormSwitch, RestartIcon } from "@vencord/types/components";
import { closeModal, Logger, Modals, ModalSize, openModal, useAwaiter, useForceUpdater } from "@vencord/types/utils";
import {
BaseText,
Button,
Card,
CogWheel,
FormSwitch,
Heading,
HeadingTertiary,
Margins,
Paragraph,
RestartIcon,
Span
} from "@vencord/types/components";
import {
closeModal,
Logger,
ModalCloseButton,
Modals,
ModalSize,
openModal,
useAwaiter,
useForceUpdater
} from "@vencord/types/utils";
import { onceReady } from "@vencord/types/webpack";
import { Button, Card, FluxDispatcher, Forms, Select, Text, UserStore, useState } from "@vencord/types/webpack/common";
import { FluxDispatcher, Select, UserStore, useState } from "@vencord/types/webpack/common";
import { Node } from "@vencord/venmic";
import type { Dispatch, SetStateAction } from "react";
import { MediaEngineStore } from "renderer/common";
@@ -18,6 +39,8 @@ import { addPatch } from "renderer/patches/shared";
import { State, useSettings, useVesktopState } from "renderer/settings";
import { isLinux, isWindows } from "renderer/utils";
import { SimpleErrorBoundary } from "./SimpleErrorBoundary";
const StreamResolutions = ["480", "720", "1080", "1440", "2160"] as const;
const StreamFps = ["15", "30", "60"] as const;
@@ -145,6 +168,9 @@ export function openScreenSharePicker(screens: Source[], skipPicker: boolean) {
onCloseRequest() {
closeModal(key);
reject("Aborted");
},
onCloseCallback() {
reject("Aborted");
}
}
);
@@ -165,9 +191,7 @@ function ScreenPicker({ screens, chooseScreen }: { screens: Source[]; chooseScre
/>
<img src={url} alt="" />
<Text className={cl("screen-name")} variant="text-sm/normal">
{name}
</Text>
<Paragraph className={cl("screen-name")}>{name}</Paragraph>
</label>
))}
</div>
@@ -188,19 +212,16 @@ function AudioSettingsModal({
return (
<Modals.ModalRoot {...modalProps} size={ModalSize.MEDIUM}>
<Modals.ModalHeader className={cl("header")}>
<Forms.FormTitle tag="h2">Venmic Settings</Forms.FormTitle>
<Modals.ModalCloseButton onClick={close} className={cl("header-close-button")} />
<BaseText size="lg" weight="semibold" tag="h3" style={{ flexGrow: 1 }}>
Audio Settings
</BaseText>
<ModalCloseButton onClick={close} />
</Modals.ModalHeader>
<Modals.ModalContent className={cl("modal", "venmic-settings")}>
<FormSwitch
title="Microphone Workaround"
description={
<>
Work around an issue that causes the microphone to be shared instead of the correct audio.
Only enable if you're experiencing this issue.
</>
}
description="Work around an issue that causes the microphone to be shared instead of the correct audio. Only enable if you're experiencing this issue."
hideBorder
onChange={v => (Settings.audio = { ...Settings.audio, workaround: v })}
value={Settings.audio?.workaround ?? false}
@@ -208,10 +229,7 @@ function AudioSettingsModal({
<FormSwitch
title="Only Speakers"
description={
<>
When sharing entire desktop audio, only share apps that play to a speaker. You may want to
disable this when using "mix bussing".
</>
'When sharing entire desktop audio, only share apps that play to a speaker. You may want to disable this when using "mix bussing".'
}
hideBorder
onChange={v => (Settings.audio = { ...Settings.audio, onlySpeakers: v })}
@@ -231,7 +249,7 @@ function AudioSettingsModal({
/>
<FormSwitch
title="Ignore Inputs"
description={<>Exclude nodes that are intended to capture audio.</>}
description="Exclude nodes that are intended to capture audio."
hideBorder
onChange={v => (Settings.audio = { ...Settings.audio, ignoreInputMedia: v })}
value={Settings.audio?.ignoreInputMedia ?? true}
@@ -239,10 +257,7 @@ function AudioSettingsModal({
<FormSwitch
title="Ignore Virtual"
description={
<>
Exclude virtual nodes, such as nodes belonging to loopbacks. This might be useful when using
"mix bussing".
</>
'Exclude virtual nodes, such as nodes belonging to loopbacks. This might be useful when using "mix bussing".'
}
hideBorder
onChange={v => (Settings.audio = { ...Settings.audio, ignoreVirtual: v })}
@@ -250,7 +265,7 @@ function AudioSettingsModal({
/>
<FormSwitch
title="Ignore Devices"
description={<>Exclude device nodes, such as nodes belonging to microphones or speakers.</>}
description="Exclude device nodes, such as nodes belonging to microphones or speakers."
hideBorder
onChange={v =>
(Settings.audio = {
@@ -263,7 +278,7 @@ function AudioSettingsModal({
/>
<FormSwitch
title="Granular Selection"
description={<>Allow to select applications more granularly.</>}
description="Allow to select applications more granularly."
hideBorder
onChange={value => {
Settings.audio = { ...Settings.audio, granularSelect: value };
@@ -289,7 +304,7 @@ function AudioSettingsModal({
/>
</Modals.ModalContent>
<Modals.ModalFooter className={cl("footer")}>
<Button color={Button.Colors.TRANSPARENT} onClick={close}>
<Button variant="secondary" onClick={close}>
Back
</Button>
</Modals.ModalFooter>
@@ -310,7 +325,7 @@ function OptionRadio<Settings extends object, Key extends keyof Settings>(props:
<div className={cl("option-radios")}>
{(options as string[]).map((option, idx) => (
<label className={cl("option-radio")} data-checked={settings[settingsKey] === option} key={option}>
<Text variant="text-sm/bold">{labels?.[idx] ?? option}</Text>
<Span weight="bold">{labels?.[idx] ?? option}</Span>
<input
className={cl("option-input")}
type="radio"
@@ -361,18 +376,18 @@ function StreamSettingsUi({
return (
<div>
<Forms.FormTitle>What you're streaming</Forms.FormTitle>
<HeadingTertiary className={Margins.bottom8}>What you're streaming</HeadingTertiary>
<Card className={cl("card", "preview")}>
<img src={thumb} alt="" className={cl(isLinux ? "preview-img-linux" : "preview-img")} />
<Text variant="text-sm/normal">{source.name}</Text>
<Paragraph>{source.name}</Paragraph>
</Card>
<Forms.FormTitle>Stream Settings</Forms.FormTitle>
<HeadingTertiary className={Margins.bottom8}>Stream Settings</HeadingTertiary>
<Card className={cl("card")}>
<div className={cl("quality")}>
<section className={cl("quality-section")}>
<Forms.FormTitle>Resolution</Forms.FormTitle>
<Heading tag="h5">Resolution</Heading>
<OptionRadio
options={StreamResolutions}
settings={qualitySettings}
@@ -382,7 +397,7 @@ function StreamSettingsUi({
</section>
<section className={cl("quality-section")}>
<Forms.FormTitle>Frame Rate</Forms.FormTitle>
<Heading tag="h5">Frame Rate</Heading>
<OptionRadio
options={StreamFps}
settings={qualitySettings}
@@ -393,7 +408,7 @@ function StreamSettingsUi({
</div>
<div className={cl("quality")}>
<section className={cl("quality-section")}>
<Forms.FormTitle>Content Type</Forms.FormTitle>
<Heading tag="h5">Content Type</Heading>
<div>
<OptionRadio
options={["motion", "detail"]}
@@ -402,12 +417,11 @@ function StreamSettingsUi({
settingsKey="contentHint"
onChange={option => setSettings(s => ({ ...s, contentHint: option }))}
/>
<div className={cl("hint-description")}>
<p>
Choosing "Prefer Clarity" will result in a significantly lower framerate in exchange
for a much sharper and clearer image.
</p>
</div>
<Paragraph className={Margins.top8}>
Choosing "Prefer Clarity" will result in a significantly lower framerate in exchange for
a much sharper and clearer image.
</Paragraph>
</div>
{isWindows && (
<FormSwitch
@@ -578,7 +592,7 @@ function AudioSourcePickerLinux({
if (!sources.ok && sources.isGlibCxxOutdated) {
return (
<Forms.FormText>
<Paragraph>
Failed to retrieve Audio Sources because your C++ library is too old to run
<a href="https://github.com/Vencord/venmic" target="_blank" rel="noreferrer">
venmic
@@ -592,13 +606,13 @@ function AudioSourcePickerLinux({
this guide
</a>{" "}
for possible solutions.
</Forms.FormText>
</Paragraph>
);
}
if (!hasPipewirePulse && !ignorePulseWarning) {
return (
<Text variant="text-sm/normal">
<Paragraph>
Could not find pipewire-pulse. See{" "}
<a
href="https://gist.github.com/the-spyke/2de98b22ff4f978ebf0650c90e82027e#install"
@@ -611,7 +625,7 @@ function AudioSourcePickerLinux({
You can still continue, however, please{" "}
<b>beware that you can only share audio of apps that are running under pipewire</b>.{" "}
<a onClick={() => setIgnorePulseWarning(true)}>I know what I'm doing!</a>
</Text>
</Paragraph>
);
}
@@ -631,50 +645,50 @@ function AudioSourcePickerLinux({
<>
<div className={cl("audio-sources")}>
<section>
<Forms.FormTitle>{loading ? "Loading Sources..." : "Audio Sources"}</Forms.FormTitle>
<Select
options={allSources.map(({ name, value }) => ({
label: name,
value: value,
default: name === "None"
}))}
isSelected={isItemSelected(includeSources)}
select={updateItems(setIncludeSources, includeSources)}
serialize={String}
popoutPosition="top"
closeOnSelect={false}
/>
</section>
{includeSources === "Entire System" && (
<section>
<Forms.FormTitle>Exclude Sources</Forms.FormTitle>
<Heading tag="h5">{loading ? "Loading Sources..." : "Audio Sources"}</Heading>
<SimpleErrorBoundary>
<Select
options={allSources
.filter(x => x.name !== "Entire System")
.map(({ name, value }) => ({
label: name,
value: value,
default: name === "None"
}))}
isSelected={isItemSelected(excludeSources)}
select={updateItems(setExcludeSources, excludeSources)}
options={allSources.map(({ name, value }) => ({
label: name,
value: value,
default: name === "None"
}))}
isSelected={isItemSelected(includeSources)}
select={updateItems(setIncludeSources, includeSources)}
serialize={String}
popoutPosition="top"
closeOnSelect={false}
/>
</SimpleErrorBoundary>
</section>
{includeSources === "Entire System" && (
<section>
<Heading tag="h5">Exclude Sources</Heading>
<SimpleErrorBoundary>
<Select
options={allSources
.filter(x => x.name !== "Entire System")
.map(({ name, value }) => ({
label: name,
value: value,
default: name === "None"
}))}
isSelected={isItemSelected(excludeSources)}
select={updateItems(setExcludeSources, excludeSources)}
serialize={String}
popoutPosition="top"
closeOnSelect={false}
/>
</SimpleErrorBoundary>
</section>
)}
</div>
<div className={cl("settings-buttons")}>
<Button
color={Button.Colors.TRANSPARENT}
onClick={refreshAudioSources}
className={cl("settings-button")}
>
<Button variant="secondary" onClick={refreshAudioSources} className={cl("settings-button")}>
<RestartIcon className={cl("settings-button-icon")} />
Refresh Audio Sources
</Button>
<Button color={Button.Colors.TRANSPARENT} onClick={openSettings} className={cl("settings-button")}>
<Button variant="secondary" onClick={openSettings} className={cl("settings-button")}>
<CogWheel className={cl("settings-button-icon")} />
Open Audio Settings
</Button>
@@ -710,8 +724,10 @@ function ModalComponent({
return (
<Modals.ModalRoot {...modalProps} size={ModalSize.MEDIUM}>
<Modals.ModalHeader className={cl("header")}>
<Forms.FormTitle tag="h2">ScreenShare</Forms.FormTitle>
<Modals.ModalCloseButton onClick={close} />
<BaseText size="lg" weight="semibold" tag="h3" style={{ flexGrow: 1 }}>
Screen Share Picker
</BaseText>
<ModalCloseButton onClick={close} />
</Modals.ModalHeader>
<Modals.ModalContent className={cl("modal")}>
{!selected ? (
@@ -789,11 +805,11 @@ function ModalComponent({
</Button>
{selected && !skipPicker ? (
<Button color={Button.Colors.TRANSPARENT} onClick={() => setSelected(void 0)}>
<Button variant="secondary" onClick={() => setSelected(void 0)}>
Back
</Button>
) : (
<Button color={Button.Colors.TRANSPARENT} onClick={close}>
<Button variant="secondary" onClick={close}>
Cancel
</Button>
)}

46
src/renderer/components/SimpleErrorBoundary.tsx Normal file
View File

@@ -0,0 +1,46 @@
/*
* Vesktop, a desktop app aiming to give you a snappier Discord Experience
* Copyright (c) 2025 Vendicated and Vesktop contributors
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { Card, ErrorBoundary, HeadingTertiary, Paragraph, TextButton } from "@vencord/types/components";
import { FluxDispatcher, InviteActions } from "@vencord/types/webpack/common";
import type { PropsWithChildren } from "react";
async function openSupportChannel() {
const code = "YVbdG2ZRG4";
try {
const { invite } = await InviteActions.resolveInvite(code, "Desktop Modal");
if (!invite) throw 0;
await FluxDispatcher.dispatch({
type: "INVITE_MODAL_OPEN",
invite,
code,
context: "APP"
});
} catch {
window.open(`https://discord.gg/${code}`, "_blank");
}
}
function Fallback() {
return (
<Card variant="danger">
<HeadingTertiary>Something went wrong.</HeadingTertiary>
<Paragraph>
Please make sure Vencord and Vesktop are fully up to date. You can get help in our{" "}
<TextButton variant="link" onClick={openSupportChannel}>
Support Channel
</TextButton>
</Paragraph>
</Card>
);
}
export function SimpleErrorBoundary({ children }: PropsWithChildren<{}>) {
return <ErrorBoundary fallback={Fallback}>{children}</ErrorBoundary>;
}

11
src/renderer/components/screenSharePicker.css
View File

@@ -81,13 +81,13 @@
/* Option Radios */
.vcd-screen-picker-option-radios {
display: flex;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
width: 100%;
border-radius: 3px;
}
.vcd-screen-picker-option-radio {
flex: 1 1 auto;
text-align: center;
background-color: var(--background-secondary);
border: 1px solid var(--primary-800);
@@ -151,11 +151,4 @@
>section {
flex: 1;
}
}
.vcd-screen-picker-hint-description {
color: var(--header-secondary);
font-size: 14px;
line-height: 20px;
font-weight: 400;
}

27
src/renderer/components/settings/DeveloperOptions.tsx
View File

@@ -4,6 +4,7 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { BaseText, Button, Heading, Paragraph, TextButton } from "@vencord/types/components";
import {
Margins,
ModalCloseButton,
@@ -14,7 +15,7 @@ import {
openModal,
useForceUpdater
} from "@vencord/types/utils";
import { Button, Forms, Text, Toasts } from "@vencord/types/webpack/common";
import { Toasts } from "@vencord/types/webpack/common";
import { Settings } from "shared/settings";
import { cl, SettingsComponent } from "./Settings";
@@ -27,20 +28,20 @@ function openDeveloperOptionsModal(settings: Settings) {
openModal(props => (
<ModalRoot {...props} size={ModalSize.MEDIUM}>
<ModalHeader>
<Text variant="heading-lg/semibold" style={{ flexGrow: 1 }}>
<BaseText size="lg" weight="semibold" tag="h3" style={{ flexGrow: 1 }}>
Vesktop Developer Options
</Text>
</BaseText>
<ModalCloseButton onClick={props.onClose} />
</ModalHeader>
<ModalContent>
<div style={{ padding: "1em 0" }}>
<Forms.FormTitle tag="h5">Vencord Location</Forms.FormTitle>
<Heading tag="h5">Vencord Location</Heading>
<VencordLocationPicker settings={settings} />
<Forms.FormTitle tag="h5" className={Margins.top16}>
<Heading tag="h5" className={Margins.top16}>
Debugging
</Forms.FormTitle>
</Heading>
<div className={cl("button-grid")}>
<Button onClick={() => VesktopNative.debug.launchGpu()}>Open chrome://gpu</Button>
<Button onClick={() => VesktopNative.debug.launchWebrtcInternals()}>
@@ -59,25 +60,24 @@ const VencordLocationPicker: SettingsComponent = ({ settings }) => {
return (
<>
<Forms.FormText>
<Paragraph>
Vencord files are loaded from{" "}
{vencordDir ? (
<a
href="about:blank"
<TextButton
variant="link"
onClick={e => {
e.preventDefault();
VesktopNative.fileManager.showItemInFolder(vencordDir!);
}}
>
{vencordDir}
</a>
</TextButton>
) : (
"the default location"
)}
</Forms.FormText>
</Paragraph>
<div className={cl("button-grid")}>
<Button
size={Button.Sizes.SMALL}
onClick={async () => {
const choice = await VesktopNative.fileManager.selectVencordDir();
switch (choice) {
@@ -105,8 +105,7 @@ const VencordLocationPicker: SettingsComponent = ({ settings }) => {
Change
</Button>
<Button
size={Button.Sizes.SMALL}
color={Button.Colors.RED}
variant="dangerPrimary"
onClick={async () => {
await VesktopNative.fileManager.selectVencordDir(null);
forceUpdate();

6
src/renderer/components/settings/DiscordBranchPicker.tsx
View File

@@ -4,14 +4,14 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { ErrorBoundary } from "@vencord/types/components";
import { Select } from "@vencord/types/webpack/common";
import { SimpleErrorBoundary } from "../SimpleErrorBoundary";
import { SettingsComponent } from "./Settings";
export const DiscordBranchPicker: SettingsComponent = ({ settings }) => {
return (
<ErrorBoundary noop>
<SimpleErrorBoundary>
<Select
placeholder="Stable"
options={[
@@ -24,6 +24,6 @@ export const DiscordBranchPicker: SettingsComponent = ({ settings }) => {
isSelected={v => v === settings.discordBranch}
serialize={s => s}
/>
</ErrorBoundary>
</SimpleErrorBoundary>
);
};

27
src/renderer/components/settings/OutdatedVesktopWarning.tsx Normal file
View File

@@ -0,0 +1,27 @@
/*
* Vesktop, a desktop app aiming to give you a snappier Discord Experience
* Copyright (c) 2025 Vendicated and Vesktop contributors
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { Button, Card, HeadingTertiary, Paragraph } from "@vencord/types/components";
import { useAwaiter } from "@vencord/types/utils";
import { cl } from "./Settings";
export function OutdatedVesktopWarning() {
const [isOutdated] = useAwaiter(VesktopNative.app.isOutdated);
if (!isOutdated) return null;
return (
<Card variant="warning" className={cl("updater-card")}>
<HeadingTertiary>Your Vesktop is outdated!</HeadingTertiary>
<Paragraph>Staying up to date is important for security and stability.</Paragraph>
<Button onClick={() => VesktopNative.app.openUpdater()} variant="secondary">
Open Updater
</Button>
</Card>
);
}

26
src/renderer/components/settings/Settings.tsx
View File

@@ -7,8 +7,7 @@
import "./settings.css";
import { classNameFactory } from "@vencord/types/api/Styles";
import { ErrorBoundary } from "@vencord/types/components";
import { Forms, Text } from "@vencord/types/webpack/common";
import { BaseText, Divider, ErrorBoundary } from "@vencord/types/components";
import { ComponentType } from "react";
import { Settings, useSettings } from "renderer/settings";
import { isMac, isWindows } from "renderer/utils";
@@ -17,7 +16,7 @@ import { AutoStartToggle } from "./AutoStartToggle";
import { DeveloperOptionsButton } from "./DeveloperOptions";
import { DiscordBranchPicker } from "./DiscordBranchPicker";
import { NotificationBadgeToggle } from "./NotificationBadgeToggle";
import { Updater } from "./Updater";
import { OutdatedVesktopWarning } from "./OutdatedVesktopWarning";
import { UserAssetsButton } from "./UserAssets";
import { VesktopSettingsSwitch } from "./VesktopSettingsSwitch";
import { WindowsTransparencyControls } from "./WindowsTransparencyControls";
@@ -125,7 +124,15 @@ const SettingsOptions: Record<string, Array<BooleanSetting | SettingsComponent>>
defaultValue: false
}
],
Notifications: [NotificationBadgeToggle],
Notifications: [
NotificationBadgeToggle,
{
key: "enableTaskbarFlashing",
title: "Enable Taskbar Flashing",
description: "Flashes the app in your taskbar when you have new notifications.",
defaultValue: false
}
],
Miscellaneous: [
{
key: "arRPC",
@@ -149,9 +156,9 @@ function SettingsSections() {
const sections = Object.entries(SettingsOptions).map(([title, settings], i, arr) => (
<div key={title} className={cl("category")}>
<Text variant="heading-lg/semibold" color="header-primary" className={cl("category-title")}>
<BaseText size="lg" weight="semibold" tag="h3" className={cl("category-title")}>
{title}
</Text>
</BaseText>
<div className={cl("category-content")}>
{settings.map((Setting, i) => {
@@ -173,7 +180,7 @@ function SettingsSections() {
})}
</div>
{i < arr.length - 1 && <Forms.FormDivider className={cl("category-divider")} />}
{i < arr.length - 1 && <Divider className={cl("category-divider")} />}
</div>
));
@@ -184,10 +191,7 @@ export default ErrorBoundary.wrap(
function SettingsUI() {
return (
<section>
<Text variant="heading-xl/semibold" color="header-primary" className={cl("title")}>
Vesktop Settings
</Text>
<Updater />
<OutdatedVesktopWarning />
<SettingsSections />
</section>
);

31
src/renderer/components/settings/Updater.tsx
View File

@@ -1,31 +0,0 @@
/*
* Vesktop, a desktop app aiming to give you a snappier Discord Experience
* Copyright (c) 2025 Vendicated and Vesktop contributors
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { useAwaiter } from "@vencord/types/utils";
import { Button, Text } from "@vencord/types/webpack/common";
import { cl } from "./Settings";
export function Updater() {
const [isOutdated] = useAwaiter(VesktopNative.app.isOutdated);
if (!isOutdated) return null;
return (
<div className={cl("updater-card")}>
<Text variant="text-md/semibold">Your Vesktop is outdated!</Text>
<Text variant="text-sm/normal">Staying up to date is important for security and stability.</Text>
<Button
onClick={() => VesktopNative.app.openUpdater()}
size={Button.Sizes.SMALL}
color={Button.Colors.TRANSPARENT}
>
Open Updater
</Button>
</div>
);
}

14
src/renderer/components/settings/UserAssets.tsx
View File

@@ -6,7 +6,7 @@
import "./UserAssets.css";
import { FormSwitch } from "@vencord/types/components";
import { BaseText, Button, FormSwitch } from "@vencord/types/components";
import {
Margins,
ModalCloseButton,
@@ -18,7 +18,7 @@ import {
wordsFromCamel,
wordsToTitle
} from "@vencord/types/utils";
import { Button, showToast, Text, useState } from "@vencord/types/webpack/common";
import { showToast, useState } from "@vencord/types/webpack/common";
import { UserAssetType } from "main/userAssets";
import { useSettings } from "renderer/settings";
@@ -34,9 +34,9 @@ function openAssetsModal() {
openModal(props => (
<ModalRoot {...props} size={ModalSize.MEDIUM}>
<ModalHeader>
<Text variant="heading-lg/semibold" style={{ flexGrow: 1 }}>
<BaseText size="lg" weight="semibold" tag="h3" style={{ flexGrow: 1 }}>
User Assets
</Text>
</BaseText>
<ModalCloseButton onClick={props.onClose} />
</ModalHeader>
@@ -73,9 +73,9 @@ function Asset({ asset }: { asset: UserAssetType }) {
return (
<section>
<Text tag="h3" variant="text-md/semibold">
<BaseText size="md" weight="medium" tag="h3">
{wordsToTitle(wordsFromCamel(asset))}
</Text>
</BaseText>
<div className="vcd-user-assets-asset">
<img
className="vcd-user-assets-image"
@@ -86,7 +86,7 @@ function Asset({ asset }: { asset: UserAssetType }) {
<div className="vcd-user-assets-actions">
<div className="vcd-user-assets-buttons">
<Button onClick={onChooseAsset()}>Customize</Button>
<Button color={Button.Colors.PRIMARY} onClick={onChooseAsset(null)}>
<Button variant="secondary" onClick={onChooseAsset(null)}>
Reset to default
</Button>
</div>

2
src/renderer/components/settings/VesktopSettingsSwitch.tsx
View File

@@ -5,7 +5,7 @@
*/
import { FormSwitch } from "@vencord/types/components";
import { ComponentProps } from "react";
import type { ComponentProps } from "react";
import { cl } from "./Settings";

21
src/renderer/components/settings/WindowsTransparencyControls.tsx
View File

@@ -4,23 +4,24 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { ErrorBoundary } from "@vencord/types/components";
import { Heading, Paragraph } from "@vencord/types/components";
import { Margins } from "@vencord/types/utils";
import { Forms, Select } from "@vencord/types/webpack/common";
import { Select } from "@vencord/types/webpack/common";
import { SimpleErrorBoundary } from "../SimpleErrorBoundary";
import { SettingsComponent } from "./Settings";
export const WindowsTransparencyControls: SettingsComponent = ({ settings }) => {
if (!VesktopNative.app.supportsWindowsTransparency()) return null;
return (
<ErrorBoundary noop>
<div>
<Forms.FormTitle className={Margins.bottom8}>Transparency Options</Forms.FormTitle>
<Forms.FormText className={Margins.bottom8}>
Requires a full restart. You will need a theme that supports transparency for this to work.
</Forms.FormText>
<div>
<Heading tag="h5">Transparency Options</Heading>
<Paragraph className={Margins.bottom8}>
Requires a full restart. You will need a theme that supports transparency for this to work.
</Paragraph>
<SimpleErrorBoundary>
<Select
placeholder="None"
options={[
@@ -44,7 +45,7 @@ export const WindowsTransparencyControls: SettingsComponent = ({ settings }) =>
isSelected={v => v === settings.transparencyOption}
serialize={s => s}
/>
</div>
</ErrorBoundary>
</SimpleErrorBoundary>
</div>
);
};

6
src/renderer/components/settings/settings.css
View File

@@ -38,10 +38,4 @@
margin-bottom: 1em;
display: grid;
gap: 0.5em;
border-radius: 8px;
background-color: var(--bg-secondary);
background: var(--background-feedback-warning);
border: 1px solid var(--info-warning-foreground);
color: var(--text-feedback-warning);
}

3
src/renderer/index.ts
View File

@@ -23,7 +23,8 @@ import type SettingsPlugin from "@vencord/types/plugins/_core/settings";
VesktopLogger.log("read if cute :3");
VesktopLogger.log("Vesktop v" + VesktopNative.app.getVersion());
const customSettingsSections = (Vencord.Plugins.plugins.Settings as any as typeof SettingsPlugin).customSections;
// TODO
const customSettingsSections = (Vencord.Plugins.plugins.Settings as typeof SettingsPlugin).customSections;
customSettingsSections.push(() => ({
section: "Vesktop",

27
src/renderer/patches/taskBarFlash.ts Normal file
View File

@@ -0,0 +1,27 @@
/*
* Vesktop, a desktop app aiming to give you a snappier Discord Experience
* Copyright (c) 2025 Vendicated and Vesktop contributors
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { Settings } from "renderer/settings";
import { addPatch } from "./shared";
addPatch({
patches: [
{
find: ".flashFrame(!0)",
replacement: {
match: /(\i)&&\i\.\i\.taskbarFlash&&\i\.\i\.flashFrame\(!0\)/,
replace: "$self.flashFrame()"
}
}
],
flashFrame() {
if (Settings.store.enableTaskbarFlashing) {
VesktopNative.win.flashFrame(true);
}
}
});

2
src/renderer/themedSplash.ts
View File

@@ -60,7 +60,7 @@ const updateSplashColors = () => {
const bodyStyles = document.body.computedStyleMap();
const color = bodyStyles.get("--text-default");
const backgroundColor = bodyStyles.get("--background-primary");
const backgroundColor = bodyStyles.get("--background-base-lowest");
if (isValidColor(color)) {
Settings.store.splashColor = resolveColor(color[0]);

1
src/shared/IpcEvents.ts
View File

@@ -39,6 +39,7 @@ export const enum IpcEvents {
SPELLCHECK_ADD_TO_DICTIONARY = "VCD_SPELLCHECK_ADD_TO_DICTIONARY",
SET_BADGE_COUNT = "VCD_SET_BADGE_COUNT",
FLASH_FRAME = "FLASH_FRAME",
CAPTURER_GET_LARGE_THUMBNAIL = "VCD_CAPTURER_GET_LARGE_THUMBNAIL",

1
src/shared/settings.d.ts vendored
View File

@@ -20,6 +20,7 @@ export interface Settings {
hardwareVideoAcceleration?: boolean;
arRPC?: boolean;
appBadge?: boolean;
enableTaskbarFlashing?: boolean;
disableMinSize?: boolean;
clickTrayToShowHide?: boolean;
customTitleBar?: boolean;