Vesktop/src/renderer/components/settings/TrayIconImagePicker.tsx

74 lines
2.8 KiB
TypeScript

/*
* SPDX-License-Identifier: GPL-3.0
* Vesktop, a desktop app aiming to give you a snappier Discord Experience
* Copyright (c) 2023 Vendicated and Vencord contributors
*/
import { findByPropsLazy } from "@vencord/types/webpack";
import { Forms, Switch, Toasts } from "@vencord/types/webpack/common";
import { Settings } from "renderer/settings";
import { SettingsComponent } from "./Settings";
const { PencilIcon } = findByPropsLazy("PencilIcon");
export const TrayIconImagePicker: SettingsComponent = ({ settings }) => {
return (
<>
<div id="vcd-tray-setting">
<div className="vcd-tray-setting-switch">
<Switch
key="tray"
value={Settings.store.tray ?? false}
onChange={v => (Settings.store.tray = v)}
note={"Add a tray icon for Vesktop"}
>
Tray Icon
</Switch>
</div>
<div className="vcd-tray-setting-reset">
<Forms.FormText>
<a
href="about:blank"
onClick={e => {
e.preventDefault();
settings.trayIconPath = void 0;
}}
>
Reset
</a>
</Forms.FormText>
</div>
<div className="vcd-tray-icon-wrap">
<img
className="vcd-tray-icon-image"
src={VesktopNative.tray.getTrayIcon()}
alt="hello"
width="48"
height="48"
></img>
<PencilIcon
className="vcd-edit-button"
width="40"
height="40"
onClick={async () => {
const choice = await VesktopNative.fileManager.selectTrayIcon();
switch (choice) {
case "cancelled":
return;
case "invalid":
Toasts.show({
message: "Please select a valid .png or .jpg image!",
id: Toasts.genId(),
type: Toasts.Type.FAILURE
});
return;
}
settings.trayIconPath = choice;
}}
/>
</div>
</div>
</>
);
};