SheWhoReignsSupreme/Equicord
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

UI: cleanup and migration (#532)

Browse source 
* cook

* minor changes

* h

* t

* b

* revert

* updates

---------

Co-authored-by: thororen1234 <78185467+thororen1234@users.noreply.github.com>
This commit is contained in:
prism 2025-12-02 22:28:01 +01:00 • committed by GitHub
parent e3745f2ed1
commit 18513870a2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
18 changed files with 114 additions and 128 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/components/Alert.tsx
View file

@ -5,7 +5,7 @@
*/
import { filters, mapMangledModuleLazy } from "@webpack";
import type { ReactNode } from "react";
import type { ComponentType, CSSProperties, ReactNode } from "react";
const { HelpMessage, HelpMessageTypes } = mapMangledModuleLazy('POSITIVE="positive', {
HelpMessageTypes: filters.byProps("POSITIVE", "WARNING", "INFO", "ERROR"),
@ -15,35 +15,37 @@ const { HelpMessage, HelpMessageTypes } = mapMangledModuleLazy('POSITIVE="positi
export interface AlertProps {
children: ReactNode;
className?: string;
style?: CSSProperties;
icon?: ComponentType<{ className?: string; color?: string; }>;
}
function Warning({ children, className }: AlertProps) {
function Warning({ children, className, style, icon }: AlertProps) {
return (
<HelpMessage messageType={HelpMessageTypes.WARNING} className={className}>
<HelpMessage messageType={HelpMessageTypes.WARNING} className={className} style={style} icon={icon}>
{children}
</HelpMessage>
);
}
function Info({ children, className }: AlertProps) {
function Info({ children, className, style, icon }: AlertProps) {
return (
<HelpMessage messageType={HelpMessageTypes.INFO} className={className}>
<HelpMessage messageType={HelpMessageTypes.INFO} className={className} style={style} icon={icon}>
{children}
</HelpMessage>
);
}
function Error({ children, className }: AlertProps) {
function Error({ children, className, style, icon }: AlertProps) {
return (
<HelpMessage messageType={HelpMessageTypes.ERROR} className={className}>
<HelpMessage messageType={HelpMessageTypes.ERROR} className={className} style={style} icon={icon}>
{children}
</HelpMessage>
);
}
function Positive({ children, className }: AlertProps) {
function Positive({ children, className, style, icon }: AlertProps) {
return (
<HelpMessage messageType={HelpMessageTypes.POSITIVE} className={className}>
<HelpMessage messageType={HelpMessageTypes.POSITIVE} className={className} style={style} icon={icon}>
{children}
</HelpMessage>
);

5
src/components/ThemeSettings/ThemesTab.tsx
View file

@ -21,6 +21,7 @@ import "./themesStyles.css";
import { isPluginEnabled } from "@api/PluginManager";
import { Settings, useSettings } from "@api/Settings";
import { classNameFactory } from "@api/Styles";
import { Button } from "@components/Button";
import { Card } from "@components/Card";
import { Divider } from "@components/Divider";
import { ErrorCard } from "@components/ErrorCard";
@ -43,7 +44,7 @@ import { getThemeInfo, stripBOM, type UserThemeHeader } from "@utils/themes/bd";
import { usercssParse } from "@utils/themes/usercss";
import { getStylusWebStoreUrl } from "@utils/web";
import { findLazy } from "@webpack";
import { Alerts, Button, React, showToast, TabBar, TextInput, Tooltip, useEffect, useMemo, useRef, useState } from "@webpack/common";
import { Alerts, React, showToast, TabBar, TextInput, Tooltip, useEffect, useMemo, useRef, useState } from "@webpack/common";
import type { ComponentType, Ref, SyntheticEvent } from "react";
import type { UserstyleHeader } from "usercss-meta";
@ -599,7 +600,7 @@ export function CspErrorCard() {
{i !== 0 && <Divider className={Margins.bottom8} />}
<div className="vc-settings-csp-row">
<Link href={url}>{url}</Link>
<Button color={Button.Colors.PRIMARY} onClick={() => allowUrl(url)} disabled={isImgurHtmlDomain(url)}>
<Button variant="secondary" onClick={() => allowUrl(url)} disabled={isImgurHtmlDomain(url)}>
Allow
</Button>
</div>

4
src/components/ThemeSettings/UserCSSModal.tsx
View file

@ -90,8 +90,8 @@ function ResetButton({ themeSettings, themeId, close, onReset }: ResetButtonProp
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
onClick={async () => {
await close(); // close the modal first to stop rendering
onClick={() => {
close(); // close the modal first to stop rendering
delete themeSettings[themeId];
onReset();
}}>

42
src/components/settings/DonateButton.tsx
View file

@ -16,41 +16,24 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import { Button } from "@components/Button";
import { Heart } from "@components/Heart";
import { openInviteModal } from "@utils/discord";
import { ButtonProps } from "@vencord/discord-types";
import { Button, showToast } from "@webpack/common";
export function VCDonateButton({
look = Button.Looks.LINK,
color = Button.Colors.TRANSPARENT,
...props
}: Partial<ButtonProps>) {
return (
<Button
{...props}
look={look}
color={color}
onClick={() => VencordNative.native.openExternal("https://github.com/sponsors/Vendicated")}
className="vc-donate-button"
>
<Heart />
Donate
</Button>
);
}
import { showToast } from "@webpack/common";
export function DonateButton({
look = Button.Looks.LINK,
color = Button.Colors.TRANSPARENT,
equicord = false,
...props
}: Partial<ButtonProps>) {
}: Partial<ButtonProps> & { equicord?: boolean; }) {
const link = equicord ? "https://github.com/sponsors/thororen1234" : "https://github.com/sponsors/Vendicated";
return (
<Button
{...props}
look={look}
color={color}
onClick={() => VencordNative.native.openExternal("https://github.com/sponsors/thororen1234")}
variant="none"
size="medium"
type="button"
onClick={() => VencordNative.native.openExternal(link)}
className="vc-donate-button"
>
<Heart />
@ -60,15 +43,14 @@ export function DonateButton({
}
export function InviteButton({
look = Button.Looks.LINK,
color = Button.Colors.TRANSPARENT,
...props
}: Partial<ButtonProps>) {
return (
<Button
{...props}
look={look}
color={color}
variant="none"
size="medium"
type="button"
onClick={async e => {
e.preventDefault();
openInviteModal("equicord-1173279886065029291").catch(() =>

1
src/components/settings/SpecialCard.css
View file

@ -1,5 +1,6 @@
.vc-donate-button {
overflow: visible !important;
color: var(--text-default)
}
.vc-donate-button .vc-heart-icon {

7
src/components/settings/tabs/changelog/NewPluginsSection.tsx
View file

@ -6,6 +6,7 @@
import { useSettings } from "@api/Settings";
import { classNameFactory } from "@api/Styles";
import { Button } from "@components/Button";
import { Card } from "@components/Card";
import { Heading } from "@components/Heading";
import { Paragraph } from "@components/Paragraph";
@ -13,7 +14,7 @@ import { PluginCard } from "@components/settings/tabs/plugins/PluginCard";
import { ChangeList } from "@utils/ChangeList";
import { Margins } from "@utils/margins";
import { useForceUpdater } from "@utils/react";
import { Button, React, Tooltip } from "@webpack/common";
import { React, Tooltip } from "@webpack/common";
import Plugins from "~plugins";
@ -165,8 +166,8 @@ export function NewPluginsSection({
{tooltipProps => (
<Button
{...tooltipProps}
color={Button.Colors.LINK}
size={Button.Sizes.SMALL}
variant="link"
size="small"
onClick={() => location.reload()}
className={Margins.top16}
>

28
src/components/settings/tabs/changelog/index.tsx
View file

@ -6,6 +6,7 @@
import "./styles.css";
import { Button } from "@components/Button";
import { Card } from "@components/Card";
import { Divider } from "@components/Divider";
import { ErrorCard } from "@components/ErrorCard";
@ -19,7 +20,7 @@ import { gitHashShort } from "@shared/vencordUserAgent";
import { Margins } from "@utils/margins";
import { useAwaiter } from "@utils/react";
import { getRepo, UpdateLogger } from "@utils/updater";
import { Alerts, Button, React, Toasts } from "@webpack/common";
import { Alerts, React, Toasts } from "@webpack/common";
import gitHash from "~git-hash";
@ -116,9 +117,8 @@ function UpdateLogCard({
: `Update: ${log.fromHash.slice(0, 7)} → ${log.toHash.slice(0, 7)}`}
</span>
<Button
size={Button.Sizes.NONE}
color={Button.Colors.TRANSPARENT}
look={Button.Looks.FILLED}
size="min"
variant="secondary"
className="vc-changelog-delete-button"
style={{
padding: "4px",
@ -503,14 +503,10 @@ function ChangelogContent() {
<div className="vc-changelog-controls">
<Button
size={Button.Sizes.SMALL}
size="small"
disabled={isLoading || repoPending || !!repoErr}
onClick={fetchChangelog}
color={
recentlyChecked
? Button.Colors.GREEN
: Button.Colors.BRAND
}
variant={recentlyChecked ? "positive" : "primary"}
>
{isLoading
? "Loading..."
@ -522,20 +518,16 @@ function ChangelogContent() {
{changelogHistory.length > 0 && (
<>
<Button
size={Button.Sizes.SMALL}
color={
showHistory
? Button.Colors.PRIMARY
: Button.Colors.BRAND
}
size="small"
variant={showHistory ? "primary" : "secondary"}
onClick={() => setShowHistory(!showHistory)}
style={{ marginLeft: "8px" }}
>
{showHistory ? "Hide Logs" : "Show Logs"}
</Button>
<Button
size={Button.Sizes.SMALL}
color={Button.Colors.RED}
size="small"
variant="dangerPrimary"
onClick={() => {
Alerts.show({
title: "Clear All Logs",

16
src/components/settings/tabs/plugins/PluginModal.tsx
View file

@ -22,6 +22,7 @@ import { generateId } from "@api/Commands";
import { Settings, useSettings } from "@api/Settings";
import { classNameFactory } from "@api/Styles";
import { BaseText } from "@components/BaseText";
import { Button } from "@components/Button";
import ErrorBoundary from "@components/ErrorBoundary";
import { Flex } from "@components/Flex";
import { Paragraph } from "@components/Paragraph";
@ -34,7 +35,7 @@ import { ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, M
import { OptionType, Plugin } from "@utils/types";
import { User } from "@vencord/discord-types";
import { findByPropsLazy } from "@webpack";
import { Button, Clickable, FluxDispatcher, React, Toasts, Tooltip, useEffect, UserStore, UserSummaryItem, UserUtils, useState } from "@webpack/common";
import { Clickable, FluxDispatcher, React, Toasts, Tooltip, useEffect, UserStore, UserSummaryItem, UserUtils, useState } from "@webpack/common";
import { Constructor } from "type-fest";
import { PluginMeta } from "~plugins";
@ -229,8 +230,8 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
{({ onMouseEnter, onMouseLeave }) => (
<Button
className={cl("disable-warning")}
size={Button.Sizes.SMALL}
color={Button.Colors.BRAND}
size="small"
variant="primary"
onClick={handleResetClick}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
@ -351,16 +352,15 @@ export function openWarningModal(plugin?: Plugin | null, pluginModalProps?: Moda
<Flex className="vc-button-container">
<Flex className="button-group">
<Button
size={Button.Sizes.SMALL}
color={Button.Colors.PRIMARY}
size="small"
variant="secondary"
onClick={warningModalProps.onClose}
look={Button.Looks.FILLED}
>
Cancel
</Button>
{!Settings.ignoreResetWarning && (
<Button
size={Button.Sizes.SMALL}
size="small"
className={cl("disable-warning")}
onClick={() => {
Settings.ignoreResetWarning = true;
@ -370,7 +370,7 @@ export function openWarningModal(plugin?: Plugin | null, pluginModalProps?: Moda
</Button>
)}
<Button
size={Button.Sizes.SMALL}
size="small"
onClick={() => {
if (isPlugin) {
if (plugin && pluginModalProps)

2
src/components/settings/tabs/plugins/styles.css
View file

@ -298,4 +298,4 @@
.vc-plugins-ui-elements {
margin-top: 16px;
}
}

29
src/components/settings/tabs/sync/BackupAndRestoreTab.tsx
View file

@ -17,66 +17,65 @@
*/
import { downloadSettingsBackup, uploadSettingsBackup } from "@api/SettingsSync/offline";
import { Card } from "@components/Card";
import { Alert } from "@components/Alert";
import { Button } from "@components/Button";
import { Flex } from "@components/Flex";
import { Heading } from "@components/Heading";
import { Paragraph } from "@components/Paragraph";
import { SettingsTab, wrapTab } from "@components/settings/tabs/BaseTab";
import { Margins } from "@utils/margins";
import { Button, Text } from "@webpack/common";
function BackupAndRestoreTab() {
return (
<SettingsTab title="Backup & Restore">
<Flex flexDirection="column" gap="0.5em">
<Card variant="warning">
<Heading tag="h4">Warning</Heading>
<Paragraph>Importing a settings file will overwrite your current settings.</Paragraph>
</Card>
<Alert.Warning>
Importing a settings file will overwrite your current settings.
</Alert.Warning>
<Text variant="text-md/normal" className={Margins.bottom8}>
<Paragraph className={Margins.bottom8}>
You can import and export your Vencord settings as a JSON file.
This allows you to easily transfer your settings to another device,
or recover your settings after reinstalling Vencord or Discord.
</Text>
</Paragraph>
<Heading tag="h4">Settings Export contains:</Heading>
<Text variant="text-md/normal" className={Margins.bottom8}>
<Paragraph className={Margins.bottom8}>
<ul>
<li>&mdash; Custom QuickCSS</li>
<li>&mdash; Theme Links</li>
<li>&mdash; Plugin Settings</li>
</ul>
</Text>
</Paragraph>
<Flex>
<Button
onClick={() => uploadSettingsBackup()}
size={Button.Sizes.SMALL}
size="small"
>
Import Settings
</Button>
<Button
onClick={() => downloadSettingsBackup("settings")}
size={Button.Sizes.SMALL}
size="small"
>
Export Settings
</Button>
<Button
onClick={() => downloadSettingsBackup("plugins")}
size={Button.Sizes.SMALL}
size="small"
>
Export Plugins
</Button>
<Button
onClick={() => downloadSettingsBackup("css")}
size={Button.Sizes.SMALL}
size="small"
>
Export CSS
</Button>
<Button
onClick={() => downloadSettingsBackup("datastore")}
size={Button.Sizes.SMALL}
size="small"
>
Export DataStores
</Button>

23
src/components/settings/tabs/sync/CloudTab.tsx
View file

@ -19,6 +19,7 @@
import { useSettings } from "@api/Settings";
import { authorizeCloud, deauthorizeCloud } from "@api/SettingsSync/cloudSetup";
import { deleteCloudSettings, eraseAllCloudData, getCloudSettings, putCloudSettings } from "@api/SettingsSync/cloudSync";
import { Button } from "@components/Button";
import { CheckedTextInput } from "@components/CheckedTextInput";
import { Divider } from "@components/Divider";
import { FormSwitch } from "@components/FormSwitch";
@ -28,7 +29,7 @@ import { Link } from "@components/Link";
import { Paragraph } from "@components/Paragraph";
import { SettingsTab, wrapTab } from "@components/settings/tabs/BaseTab";
import { Margins } from "@utils/margins";
import { Alerts, Button, Tooltip, useState } from "@webpack/common";
import { Alerts, Tooltip, useState } from "@webpack/common";
function validateUrl(url: string) {
try {
@ -60,7 +61,7 @@ function SettingsSyncSection() {
/>
<div className="vc-cloud-settings-sync-grid">
<Button
size={Button.Sizes.SMALL}
size="small"
disabled={!sectionEnabled}
onClick={() => putCloudSettings(true)}
>
@ -71,8 +72,8 @@ function SettingsSyncSection() {
<Button
onMouseLeave={onMouseLeave}
onMouseEnter={onMouseEnter}
size={Button.Sizes.SMALL}
color={Button.Colors.RED}
size="small"
variant="dangerPrimary"
disabled={!sectionEnabled}
onClick={() => getCloudSettings(true, true)}
>
@ -81,8 +82,8 @@ function SettingsSyncSection() {
)}
</Tooltip>
<Button
size={Button.Sizes.SMALL}
color={Button.Colors.RED}
size="small"
variant="dangerPrimary"
disabled={!sectionEnabled}
onClick={() => deleteCloudSettings()}
>
@ -152,7 +153,7 @@ function CloudTab() {
<Grid columns={2} gap="1em" className={Margins.top8}>
<Button
size={Button.Sizes.MEDIUM}
size="medium"
disabled={!settings.cloud.authenticated}
onClick={async () => {
settings.cloud.authenticated = false;
@ -163,8 +164,8 @@ function CloudTab() {
Reauthorize
</Button>
<Button
size={Button.Sizes.MEDIUM}
color={Button.Colors.RED}
size="medium"
variant="dangerPrimary"
disabled={!settings.cloud.authenticated}
onClick={() => Alerts.show({
title: "Are you sure?",
@ -177,10 +178,10 @@ function CloudTab() {
>
Erase All Data
</Button>
<Button size={Button.Sizes.MEDIUM} onClick={() => changeUrl("https://cloud.equicord.org/")}>
<Button size="medium" onClick={() => changeUrl("https://cloud.equicord.org/")}>
Use Equicord's Cloud
</Button>
<Button size={Button.Sizes.MEDIUM} onClick={() => changeUrl("https://api.vencord.dev/")}>
<Button size="medium" onClick={() => changeUrl("https://api.vencord.dev/")}>
Use Vencord's Cloud
</Button>
</Grid>

7
src/components/settings/tabs/updater/Components.tsx
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import { Button } from "@components/Button";
import { Card } from "@components/Card";
import { ErrorCard } from "@components/ErrorCard";
import { Flex } from "@components/Flex";
@ -13,7 +14,7 @@ import { Margins } from "@utils/margins";
import { classes } from "@utils/misc";
import { relaunch } from "@utils/native";
import { changes, checkForUpdates, update, updateError } from "@utils/updater";
import { Alerts, Button, React, Toasts, useState } from "@webpack/common";
import { Alerts, React, Toasts, useState } from "@webpack/common";
import { runWithDispatch } from "./runWithDispatch";
@ -95,7 +96,7 @@ export function Updatable(props: CommonProps) {
<Flex className={classes(Margins.bottom8, Margins.top8)}>
{isOutdated && (
<Button
size={Button.Sizes.SMALL}
size="small"
disabled={isUpdating || isChecking}
onClick={runWithDispatch(setIsUpdating, async () => {
if (await update()) {
@ -121,7 +122,7 @@ export function Updatable(props: CommonProps) {
</Button>
)}
<Button
size={Button.Sizes.SMALL}
size="small"
disabled={isUpdating || isChecking}
onClick={runWithDispatch(setIsChecking, async () => {
const outdated = await checkForUpdates();

7
src/components/settings/tabs/updater/index.tsx
View file

@ -17,6 +17,7 @@
*/
import { useSettings } from "@api/Settings";
import { Button } from "@components/Button";
import { Divider } from "@components/Divider";
import { ErrorCard } from "@components/ErrorCard";
import { Flex } from "@components/Flex";
@ -30,7 +31,7 @@ import { classes } from "@utils/misc";
import { relaunch } from "@utils/native";
import { useAwaiter } from "@utils/react";
import { changes, checkForUpdates, getRepo, isNewer, update, updateError, UpdateLogger } from "@utils/updater";
import { Alerts, Button, Parser, React, Toasts } from "@webpack/common";
import { Alerts, Parser, React, Toasts } from "@webpack/common";
import gitHash from "~git-hash";
@ -91,7 +92,7 @@ function Updatable(props: CommonProps) {
<>
<Flex className={classes(Margins.bottom8, Margins.top8)}>
{isOutdated && <Button
size={Button.Sizes.SMALL}
size="small"
disabled={isUpdating || isChecking}
onClick={withDispatcher(setIsUpdating, async () => {
if (await update()) {
@ -115,7 +116,7 @@ function Updatable(props: CommonProps) {
Update Now
</Button>}
<Button
size={Button.Sizes.SMALL}
size="small"
disabled={isUpdating || isChecking}
onClick={withDispatcher(setIsChecking, async () => {
const outdated = await checkForUpdates();

4
src/components/settings/tabs/vencord/DonateButton.tsx
View file

@ -7,7 +7,7 @@
import { DonateButton } from "@components/settings/DonateButton";
import BadgeAPI from "@plugins/_api/badges";
import { DONOR_ROLE_ID, VC_GUILD_ID } from "@utils/constants";
import { Button, GuildMemberStore } from "@webpack/common";
import { GuildMemberStore } from "@webpack/common";
export const isDonor = (userId: string) => !!(
BadgeAPI.getDonorBadges(userId)?.length > 0
@ -17,8 +17,6 @@ export const isDonor = (userId: string) => !!(
export function DonateButtonComponent() {
return (
<DonateButton
look={Button.Looks.FILLED}
color={Button.Colors.WHITE}
style={{ marginTop: "1em" }}
/>
);

3
src/components/settings/tabs/vencord/NotificationSettings.tsx
View file

@ -7,6 +7,7 @@
import { openNotificationLogModal } from "@api/Notifications/notificationLog";
import { useSettings } from "@api/Settings";
import { BaseText } from "@components/BaseText";
import { Button } from "@components/Button";
import { ErrorCard } from "@components/ErrorCard";
import { Flex } from "@components/Flex";
import { FormSwitch } from "@components/FormSwitch";
@ -15,7 +16,7 @@ import { Paragraph } from "@components/Paragraph";
import { Margins } from "@utils/margins";
import { identity } from "@utils/misc";
import { ModalCloseButton, ModalContent, ModalHeader, ModalRoot, ModalSize, openModal } from "@utils/modal";
import { Button, Select, Slider } from "@webpack/common";
import { Select, Slider } from "@webpack/common";
export function NotificationSection() {
return (

5
src/components/settings/tabs/vencord/VencordTab.css
View file

@ -47,3 +47,8 @@
text-align: center;
margin-top: 10px;
}
.vc-vencord-tab-settings-link {
color: var(--text-link);
display: inline-block;
}

33
src/components/settings/tabs/vencord/index.tsx
View file

@ -8,6 +8,9 @@ import "./VencordTab.css";
import { openNotificationLogModal } from "@api/Notifications/notificationLog";
import { useSettings } from "@api/Settings";
import { classNameFactory } from "@api/Styles";
import { Alert } from "@components/Alert";
import { Button } from "@components/Button";
import { Divider } from "@components/Divider";
import { Flex } from "@components/Flex";
import { FormSwitch } from "@components/FormSwitch";
@ -18,11 +21,11 @@ import { DonateButton, InviteButton, openContributorModal, openPluginModal, Sett
import { QuickAction, QuickActionCard } from "@components/settings/QuickAction";
import { SpecialCard } from "@components/settings/SpecialCard";
import { gitRemote } from "@shared/vencordUserAgent";
import { DONOR_ROLE_ID, GUILD_ID, VC_DONOR_ROLE_ID, VC_GUILD_ID } from "@utils/constants";
import { DONOR_ROLE_ID, GUILD_ID, IS_MAC, IS_WINDOWS, VC_DONOR_ROLE_ID, VC_GUILD_ID } from "@utils/constants";
import { Margins } from "@utils/margins";
import { identity, isAnyPluginDev } from "@utils/misc";
import { relaunch } from "@utils/native";
import { Button, GuildMemberStore, React, Select, UserStore } from "@webpack/common";
import { GuildMemberStore, React, Select, UserStore } from "@webpack/common";
import BadgeAPI from "plugins/_api/badges";
import { openNotificationSettingsModal } from "./NotificationSettings";
@ -36,6 +39,8 @@ const COZY_CONTRIB_IMAGE = "https://cdn.discordapp.com/emojis/102653307095587233
const DONOR_BACKGROUND_IMAGE = "https://media.discordapp.net/stickers/1311070116305436712.png?size=2048";
const CONTRIB_BACKGROUND_IMAGE = "https://media.discordapp.net/stickers/1311070166481895484.png?size=2048";
const cl = classNameFactory("vc-vencord-tab-");
type KeysOfType<Object, Type> = {
[K in keyof Object]: Object[K] extends Type ? K : never;
}[keyof Object];
@ -48,9 +53,7 @@ function EquicordSettings() {
[],
);
const isWindows = navigator.platform.toLowerCase().startsWith("win");
const isMac = navigator.platform.toLowerCase().startsWith("mac");
const needsVibrancySettings = IS_DISCORD_DESKTOP && isMac;
const needsVibrancySettings = IS_DISCORD_DESKTOP && IS_MAC;
const user = UserStore?.getCurrentUser();
@ -75,7 +78,7 @@ function EquicordSettings() {
warning: { enabled: false },
},
!IS_WEB &&
(!IS_DISCORD_DESKTOP || !isWindows
(!IS_DISCORD_DESKTOP || !IS_WINDOWS
? {
key: "frameless",
title: "Disable the Window Frame",
@ -95,7 +98,7 @@ function EquicordSettings() {
description: "A theme that supports transparency is required or this will do nothing. Stops the window from being resizable as a side effect",
restartRequired: true,
warning: {
enabled: isWindows,
enabled: IS_WINDOWS,
message: "Enabling this will prevent you from snapping this window.",
},
},
@ -106,7 +109,7 @@ function EquicordSettings() {
warning: { enabled: false },
},
!IS_WEB &&
isWindows && {
IS_WINDOWS && {
key: "winCtrlQ",
title:
"Register Ctrl+Q as shortcut to close Discord (Alternative to Alt+F4)",
@ -205,8 +208,9 @@ function EquicordSettings() {
<Paragraph className={Margins.bottom20} style={{ color: "var(--text-muted)" }}>
Hint: You can change the position of this settings section in the{" "}
<Button
look={Button.Looks.LINK}
style={{ color: "var(--text-link)", display: "inline-block" }}
variant="none"
size="small"
className={cl("settings-link")}
onClick={() => openPluginModal(Vencord.Plugins.plugins.Settings)}
>
settings of the Settings plugin
@ -226,9 +230,9 @@ function EquicordSettings() {
s.warning.enabled ? (
<>
{s.description}
<div className="form-switch-warning">
<Alert.Warning className={Margins.top8} style={{ width: "100%" }}>
{s.warning.message}
</div>
</Alert.Warning>
</>
) : (
s.description
@ -330,12 +334,9 @@ function DonateButtonComponent() {
return (
<Flex>
<DonateButton
look={Button.Looks.FILLED}
color={Button.Colors.TRANSPARENT}
equicord={true}
style={{ marginTop: "1em" }} />
<InviteButton
look={Button.Looks.FILLED}
color={Button.Colors.TRANSPARENT}
style={{ marginTop: "1em" }} />
</Flex>
);

6
src/plugins/_api/badges/modals.tsx
View file

@ -6,7 +6,7 @@
import { Flex } from "@components/Flex";
import { Heart } from "@components/Heart";
import { DonateButton, ErrorBoundary, HeadingPrimary, Paragraph, VCDonateButton } from "@components/index";
import { DonateButton, ErrorBoundary, HeadingPrimary, Paragraph } from "@components/index";
import { Margins } from "@utils/margins";
import { closeModal, ModalContent, ModalFooter, ModalHeader, ModalRoot, openModal } from "@utils/modal";
@ -57,7 +57,7 @@ export function VencordDonorModal() {
</ModalContent>
<ModalFooter>
<Flex justifyContent="center" style={{ width: "100%" }}>
<VCDonateButton />
<DonateButton />
</Flex>
</ModalFooter>
</ModalRoot>
@ -113,7 +113,7 @@ export function EquicordDonorModal() {
</ModalContent>
<ModalFooter>
<Flex justifyContent="center" style={{ width: "100%" }}>
<DonateButton />
<DonateButton equicord={true} />
</Flex>
</ModalFooter>
</ModalRoot>