aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/components/PatchHelper.tsx11
-rw-r--r--src/components/PluginSettings/index.tsx15
-rw-r--r--src/components/VencordSettings/BackupRestoreTab.tsx9
-rw-r--r--src/components/VencordSettings/ThemesTab.tsx7
-rw-r--r--src/components/VencordSettings/Updater.tsx13
-rw-r--r--src/components/VencordSettings/index.tsx7
-rw-r--r--src/plugins/apiBadges.tsx5
-rw-r--r--src/plugins/emoteCloner.tsx5
-rw-r--r--src/plugins/typingTweaks.tsx2
-rw-r--r--src/plugins/vcNarrator.tsx5
-rw-r--r--src/plugins/viewRaw.tsx5
-rw-r--r--src/webpack/common/components.ts4
-rw-r--r--src/webpack/common/types/components.d.ts3
13 files changed, 47 insertions, 44 deletions
diff --git a/src/components/PatchHelper.tsx b/src/components/PatchHelper.tsx
index cb60980..6524528 100644
--- a/src/components/PatchHelper.tsx
+++ b/src/components/PatchHelper.tsx
@@ -17,10 +17,11 @@
*/
import { debounce } from "@utils/debounce";
+import { Margins } from "@utils/margins";
import { makeCodeblock } from "@utils/misc";
import { canonicalizeMatch, canonicalizeReplace, ReplaceFn } from "@utils/patches";
import { search } from "@webpack";
-import { Button, Clipboard, Forms, Margins, Parser, React, Switch, Text, TextInput } from "@webpack/common";
+import { Button, Clipboard, Forms, Parser, React, Switch, Text, TextInput } from "@webpack/common";
import { CheckedTextInput } from "./CheckedTextInput";
import ErrorBoundary from "./ErrorBoundary";
@@ -128,7 +129,7 @@ function ReplacementComponent({ module, match, replacement, setReplacementError
)}
{!!diff?.length && (
- <Button className={Margins.marginTop20} onClick={() => {
+ <Button className={Margins.top20} onClick={() => {
try {
Function(patchedCode.replace(/^function\(/, "function patchedModule("));
setCompileResult([true, "Compiled successfully"]);
@@ -202,7 +203,7 @@ function ReplacementInput({ replacement, setReplacement, replacementError }) {
)}
<Switch
- className={Margins.marginTop8}
+ className={Margins.top8}
value={isFunc}
onChange={setIsFunc}
note="'replacement' will be evaled if this is toggled"
@@ -256,7 +257,7 @@ function PatchHelper() {
return (
<Forms.FormSection>
- <Text variant="heading-md/normal" tag="h2" className={Margins.marginBottom8}>Patch Helper</Text>
+ <Text variant="heading-md/normal" tag="h2" className={Margins.bottom8}>Patch Helper</Text>
<Forms.FormTitle>find</Forms.FormTitle>
<TextInput
type="text"
@@ -296,7 +297,7 @@ function PatchHelper() {
{!!(find && match && replacement) && (
<>
- <Forms.FormTitle className={Margins.marginTop20}>Code</Forms.FormTitle>
+ <Forms.FormTitle className={Margins.top20}>Code</Forms.FormTitle>
<div style={{ userSelect: "text" }}>{Parser.parse(makeCodeblock(code, "ts"))}</div>
<Button onClick={() => Clipboard.copy(code)}>Copy to Clipboard</Button>
</>
diff --git a/src/components/PluginSettings/index.tsx b/src/components/PluginSettings/index.tsx
index 4e64eb8..3d69a60 100644
--- a/src/components/PluginSettings/index.tsx
+++ b/src/components/PluginSettings/index.tsx
@@ -30,11 +30,12 @@ import PluginModal from "@components/PluginSettings/PluginModal";
import { Switch } from "@components/Switch";
import { ChangeList } from "@utils/ChangeList";
import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
import { classes, LazyComponent, useAwaiter } from "@utils/misc";
import { openModalLazy } from "@utils/modal";
import { Plugin } from "@utils/types";
import { findByCode, findByPropsLazy } from "@webpack";
-import { Alerts, Button, Card, Forms, Margins, Parser, React, Select, Text, TextInput, Toasts, Tooltip } from "@webpack/common";
+import { Alerts, Button, Card, Forms, Parser, React, Select, Text, TextInput, Toasts, Tooltip } from "@webpack/common";
import Plugins from "~plugins";
@@ -296,15 +297,15 @@ export default ErrorBoundary.wrap(function PluginSettings() {
}
return (
- <Forms.FormSection className={Margins.marginTop16}>
+ <Forms.FormSection className={Margins.top16}>
<ReloadRequiredCard required={changes.hasChanges} />
- <Forms.FormTitle tag="h5" className={classes(Margins.marginTop20, Margins.marginBottom8)}>
+ <Forms.FormTitle tag="h5" className={classes(Margins.top20, Margins.bottom8)}>
Filters
</Forms.FormTitle>
<div className={cl("filter-controls")}>
- <TextInput autoFocus value={searchValue.value} placeholder="Search for a plugin..." onChange={onSearch} className={Margins.marginBottom20} />
+ <TextInput autoFocus value={searchValue.value} placeholder="Search for a plugin..." onChange={onSearch} className={Margins.bottom20} />
<div className={InputStyles.inputWrapper}>
<Select
className={InputStyles.inputDefault}
@@ -321,15 +322,15 @@ export default ErrorBoundary.wrap(function PluginSettings() {
</div>
</div>
- <Forms.FormTitle className={Margins.marginTop20}>Plugins</Forms.FormTitle>
+ <Forms.FormTitle className={Margins.top20}>Plugins</Forms.FormTitle>
<div className={cl("grid")}>
{plugins}
</div>
- <Forms.FormDivider className={Margins.marginTop20} />
+ <Forms.FormDivider className={Margins.top20} />
- <Forms.FormTitle tag="h5" className={classes(Margins.marginTop20, Margins.marginBottom8)}>
+ <Forms.FormTitle tag="h5" className={classes(Margins.top20, Margins.bottom8)}>
Required Plugins
</Forms.FormTitle>
<div className={cl("grid")}>
diff --git a/src/components/VencordSettings/BackupRestoreTab.tsx b/src/components/VencordSettings/BackupRestoreTab.tsx
index 2ea0452..7a3729d 100644
--- a/src/components/VencordSettings/BackupRestoreTab.tsx
+++ b/src/components/VencordSettings/BackupRestoreTab.tsx
@@ -18,25 +18,26 @@
import ErrorBoundary from "@components/ErrorBoundary";
import { Flex } from "@components/Flex";
+import { Margins } from "@utils/margins";
import { classes } from "@utils/misc";
import { downloadSettingsBackup, uploadSettingsBackup } from "@utils/settingsSync";
-import { Button, Card, Forms, Margins, Text } from "@webpack/common";
+import { Button, Card, Forms, Text } from "@webpack/common";
function BackupRestoreTab() {
return (
- <Forms.FormSection title="Settings Sync" className={Margins.marginTop16}>
+ <Forms.FormSection title="Settings Sync" className={Margins.top16}>
<Card className={classes("vc-settings-card", "vc-backup-restore-card")}>
<Flex flexDirection="column">
<strong>Warning</strong>
<span>Importing a settings file will overwrite your current settings.</span>
</Flex>
</Card>
- <Text variant="text-md/normal" className={Margins.marginBottom8}>
+ <Text variant="text-md/normal" 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>
- <Text variant="text-md/normal" className={Margins.marginBottom8}>
+ <Text variant="text-md/normal" className={Margins.bottom8}>
Settings Export contains:
<ul>
<li>&mdash; Custom QuickCSS</li>
diff --git a/src/components/VencordSettings/ThemesTab.tsx b/src/components/VencordSettings/ThemesTab.tsx
index b2cf85b..b8381f7 100644
--- a/src/components/VencordSettings/ThemesTab.tsx
+++ b/src/components/VencordSettings/ThemesTab.tsx
@@ -19,9 +19,10 @@
import { useSettings } from "@api/settings";
import ErrorBoundary from "@components/ErrorBoundary";
import { Link } from "@components/Link";
+import { Margins } from "@utils/margins";
import { useAwaiter } from "@utils/misc";
import { findLazy } from "@webpack";
-import { Card, Forms, Margins, React, TextArea } from "@webpack/common";
+import { Card, Forms, React, TextArea } from "@webpack/common";
const TextAreaProps = findLazy(m => typeof m.textarea === "string");
@@ -51,7 +52,7 @@ function Validators({ themeLinks }: { themeLinks: string[]; }) {
return (
<>
- <Forms.FormTitle className={Margins.marginTop20} tag="h5">Validator</Forms.FormTitle>
+ <Forms.FormTitle className={Margins.top20} tag="h5">Validator</Forms.FormTitle>
<Forms.FormText>This section will tell you whether your themes can successfully be loaded</Forms.FormText>
<div>
{themeLinks.map(link => (
@@ -93,7 +94,7 @@ export default ErrorBoundary.wrap(function () {
<Forms.FormTitle tag="h5">Paste links to .css / .theme.css files here</Forms.FormTitle>
<Forms.FormText>One link per line</Forms.FormText>
<Forms.FormText>Make sure to use the raw links or github.io links!</Forms.FormText>
- <Forms.FormDivider className={Margins.marginTop8 + " " + Margins.marginBottom8} />
+ <Forms.FormDivider className={Margins.top8 + " " + Margins.bottom8} />
<Forms.FormTitle tag="h5">Find Themes:</Forms.FormTitle>
<div style={{ marginBottom: ".5em" }}>
<Link style={{ marginRight: ".5em" }} href="https://betterdiscord.app/themes">
diff --git a/src/components/VencordSettings/Updater.tsx b/src/components/VencordSettings/Updater.tsx
index b5243f2..caed4f7 100644
--- a/src/components/VencordSettings/Updater.tsx
+++ b/src/components/VencordSettings/Updater.tsx
@@ -22,9 +22,10 @@ import { ErrorCard } from "@components/ErrorCard";
import { Flex } from "@components/Flex";
import { handleComponentFailed } from "@components/handleComponentFailed";
import { Link } from "@components/Link";
+import { Margins } from "@utils/margins";
import { classes, useAwaiter } from "@utils/misc";
import { changes, checkForUpdates, getRepo, isNewer, rebuild, update, updateError, UpdateLogger } from "@utils/updater";
-import { Alerts, Button, Card, Forms, Margins, Parser, React, Switch, Toasts } from "@webpack/common";
+import { Alerts, Button, Card, Forms, Parser, React, Switch, Toasts } from "@webpack/common";
import gitHash from "~git-hash";
@@ -109,14 +110,14 @@ function Updatable(props: CommonProps) {
</ErrorCard>
</>
) : (
- <Forms.FormText className={Margins.marginBottom8}>
+ <Forms.FormText className={Margins.bottom8}>
{isOutdated ? `There are ${updates.length} Updates` : "Up to Date!"}
</Forms.FormText>
)}
{isOutdated && <Changes updates={updates} {...props} />}
- <Flex className={classes(Margins.marginBottom8, Margins.marginTop8)}>
+ <Flex className={classes(Margins.bottom8, Margins.top8)}>
{isOutdated && <Button
size={Button.Sizes.SMALL}
disabled={isUpdating || isChecking}
@@ -175,7 +176,7 @@ function Updatable(props: CommonProps) {
function Newer(props: CommonProps) {
return (
<>
- <Forms.FormText className={Margins.marginBottom8}>
+ <Forms.FormText className={Margins.bottom8}>
Your local copy has more recent commits. Please stash or reset them.
</Forms.FormText>
<Changes {...props} updates={changes} />
@@ -199,7 +200,7 @@ function Updater() {
};
return (
- <Forms.FormSection className={Margins.marginTop16}>
+ <Forms.FormSection className={Margins.top16}>
<Forms.FormTitle tag="h5">Updater Settings</Forms.FormTitle>
<Switch
value={settings.notifyAboutUpdates}
@@ -225,7 +226,7 @@ function Updater() {
</Link>
)} (<HashLink hash={gitHash} repo={repo} disabled={repoPending} />)</Forms.FormText>
- <Forms.FormDivider className={Margins.marginTop8 + " " + Margins.marginBottom8} />
+ <Forms.FormDivider className={Margins.top8 + " " + Margins.bottom8} />
<Forms.FormTitle tag="h5">Updates</Forms.FormTitle>
diff --git a/src/components/VencordSettings/index.tsx b/src/components/VencordSettings/index.tsx
index acd81c3..6c946a1 100644
--- a/src/components/VencordSettings/index.tsx
+++ b/src/components/VencordSettings/index.tsx
@@ -20,6 +20,7 @@ import "./settingsStyles.css";
import { classNameFactory } from "@api/Styles";
import ErrorBoundary from "@components/ErrorBoundary";
+import { handleComponentFailed } from "@components/handleComponentFailed";
import { findByCodeLazy } from "@webpack";
import { Forms, SettingsRouter, Text } from "@webpack/common";
@@ -61,8 +62,8 @@ function Settings(props: SettingsProps) {
<Text variant="heading-md/normal" tag="h2">Vencord Settings</Text>
<TabBar
- type={TabBar.Types.TOP}
- look={TabBar.Looks.BRAND}
+ type="top"
+ look="brand"
className={cl("tab-bar")}
selectedItem={tab}
onItemSelect={SettingsRouter.open}
@@ -83,7 +84,7 @@ function Settings(props: SettingsProps) {
}
export default function (props: SettingsProps) {
- return <ErrorBoundary>
+ return <ErrorBoundary onError={handleComponentFailed}>
<Settings tab={props.tab} />
</ErrorBoundary>;
}
diff --git a/src/plugins/apiBadges.tsx b/src/plugins/apiBadges.tsx
index 3fe2f6b..14b548c 100644
--- a/src/plugins/apiBadges.tsx
+++ b/src/plugins/apiBadges.tsx
@@ -24,9 +24,10 @@ import { Heart } from "@components/Heart";
import { Devs } from "@utils/constants";
import IpcEvents from "@utils/IpcEvents";
import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
import { closeModal, Modals, openModal } from "@utils/modal";
import definePlugin from "@utils/types";
-import { Forms, Margins } from "@webpack/common";
+import { Forms } from "@webpack/common";
const CONTRIBUTOR_BADGE = "https://media.discordapp.net/stickers/1026517526106087454.webp";
@@ -150,7 +151,7 @@ export default definePlugin({
<Forms.FormText>
This Badge is a special perk for Vencord Donors
</Forms.FormText>
- <Forms.FormText className={Margins.marginTop20}>
+ <Forms.FormText className={Margins.top20}>
Please consider supporting the development of Vencord by becoming a donor. It would mean a lot!!
</Forms.FormText>
</div>
diff --git a/src/plugins/emoteCloner.tsx b/src/plugins/emoteCloner.tsx
index 15d1358..e252fe5 100644
--- a/src/plugins/emoteCloner.tsx
+++ b/src/plugins/emoteCloner.tsx
@@ -20,11 +20,12 @@ import { migratePluginSettings, Settings } from "@api/settings";
import { CheckedTextInput } from "@components/CheckedTextInput";
import { Devs } from "@utils/constants";
import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
import { makeLazy } from "@utils/misc";
import { ModalContent, ModalHeader, ModalRoot, openModal } from "@utils/modal";
import definePlugin from "@utils/types";
import { findByCodeLazy, findByPropsLazy } from "@webpack";
-import { Forms, GuildStore, Margins, Menu, PermissionStore, React, Toasts, Tooltip, UserStore } from "@webpack/common";
+import { Forms, GuildStore, Menu, PermissionStore, React, Toasts, Tooltip, UserStore } from "@webpack/common";
const MANAGE_EMOJIS_AND_STICKERS = 1n << 30n;
@@ -96,7 +97,7 @@ function CloneModal({ id, name: emojiName, isAnimated }: { id: string; name: str
return (
<>
- <Forms.FormTitle className={Margins.marginTop20}>Custom Name</Forms.FormTitle>
+ <Forms.FormTitle className={Margins.top20}>Custom Name</Forms.FormTitle>
<CheckedTextInput
value={name}
onChange={setName}
diff --git a/src/plugins/typingTweaks.tsx b/src/plugins/typingTweaks.tsx
index 47b6978..c3f8f87 100644
--- a/src/plugins/typingTweaks.tsx
+++ b/src/plugins/typingTweaks.tsx
@@ -105,7 +105,7 @@ export default definePlugin({
}}>
{settings.store.showAvatars && <div style={{ marginTop: "4px" }}>
<Avatar
- size={Avatar.Sizes.SIZE_16}
+ size="SIZE_16"
src={user.getAvatarURL(guildId, 128)} />
</div>}
{GuildMemberStore.getNick(guildId!, user.id) || !guildId && RelationshipStore.getNickname(user.id) || user.username}
diff --git a/src/plugins/vcNarrator.tsx b/src/plugins/vcNarrator.tsx
index b2904ac..7a06fe9 100644
--- a/src/plugins/vcNarrator.tsx
+++ b/src/plugins/vcNarrator.tsx
@@ -20,10 +20,11 @@ import { Settings } from "@api/settings";
import { ErrorCard } from "@components/ErrorCard";
import { Devs } from "@utils/constants";
import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
import { wordsToTitle } from "@utils/text";
import definePlugin, { OptionType, PluginOptionsItem } from "@utils/types";
import { findByPropsLazy } from "@webpack";
-import { Button, ChannelStore, FluxDispatcher, Forms, Margins, SelectedChannelStore, useMemo, UserStore } from "@webpack/common";
+import { Button, ChannelStore, FluxDispatcher, Forms, SelectedChannelStore, useMemo, UserStore } from "@webpack/common";
interface VoiceState {
userId: string;
@@ -304,7 +305,7 @@ export default definePlugin({
</Forms.FormText>
{hasEnglishVoices && (
<>
- <Forms.FormTitle className={Margins.marginTop20} tag="h3">Play Example Sounds</Forms.FormTitle>
+ <Forms.FormTitle className={Margins.top20} tag="h3">Play Example Sounds</Forms.FormTitle>
<div
style={{
display: "grid",
diff --git a/src/plugins/viewRaw.tsx b/src/plugins/viewRaw.tsx
index 5105203..e0e3c9b 100644
--- a/src/plugins/viewRaw.tsx
+++ b/src/plugins/viewRaw.tsx
@@ -20,10 +20,11 @@ import { addButton, removeButton } from "@api/MessagePopover";
import ErrorBoundary from "@components/ErrorBoundary";
import { Flex } from "@components/Flex";
import { Devs } from "@utils/constants";
+import { Margins } from "@utils/margins";
import { copyWithToast } from "@utils/misc";
import { closeModal, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalRoot, ModalSize, openModal } from "@utils/modal";
import definePlugin from "@utils/types";
-import { Button, ChannelStore, Forms, Margins, Parser, Text } from "@webpack/common";
+import { Button, ChannelStore, Forms, Parser, Text } from "@webpack/common";
import { Message } from "discord-types/general";
@@ -98,7 +99,7 @@ function openViewRawModal(msg: Message) {
<>
<Forms.FormTitle tag="h5">Content</Forms.FormTitle>
<CodeBlock content={msg.content} lang="" />
- <Forms.FormDivider className={Margins.marginBottom20} />
+ <Forms.FormDivider className={Margins.bottom20} />
</>
)}
diff --git a/src/webpack/common/components.ts b/src/webpack/common/components.ts
index 63511a7..4993b22 100644
--- a/src/webpack/common/components.ts
+++ b/src/webpack/common/components.ts
@@ -53,8 +53,4 @@ export const Slider = waitForComponent<t.Slider>("Slider", filters.byCode("close
export const Flex = waitForComponent<t.Flex>("Flex", ["Justify", "Align", "Wrap"]);
export const ButtonWrapperClasses = findByPropsLazy("buttonWrapper", "buttonContent") as Record<string, string>;
-/**
- * @deprecated Use @utils/margins instead
- */
-export const Margins: t.Margins = findByPropsLazy("marginTop20");
export const ButtonLooks: t.ButtonLooks = findByPropsLazy("BLANK", "FILLED", "INVERTED");
diff --git a/src/webpack/common/types/components.d.ts b/src/webpack/common/types/components.d.ts
index 4dfa7dc..a2e66bd 100644
--- a/src/webpack/common/types/components.d.ts
+++ b/src/webpack/common/types/components.d.ts
@@ -322,7 +322,4 @@ export type Flex = ComponentType<PropsWithChildren<any>> & {
Direction: Record<"VERTICAL" | "HORIZONTAL" | "HORIZONTAL_REVERSE", string>;
Justify: Record<"START" | "END" | "CENTER" | "BETWEEN" | "AROUND", string>;
Wrap: Record<"NO_WRAP" | "WRAP" | "WRAP_REVERSE", string>;
-
- Content: ComponentType<PropsWithChildren<any>>;
- Sidebar: ComponentType<PropsWithChildren<any>>;
};