aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/PluginSettings/index.tsx19
-rw-r--r--src/components/VencordSettings/BackupAndRestoreTab.tsx (renamed from src/components/VencordSettings/BackupRestoreTab.tsx)11
-rw-r--r--src/components/VencordSettings/CloudTab.tsx9
-rw-r--r--src/components/VencordSettings/PatchHelperTab.tsx (renamed from src/components/PatchHelper.tsx)13
-rw-r--r--src/components/VencordSettings/PluginsTab.tsx5
-rw-r--r--src/components/VencordSettings/ThemesTab.tsx15
-rw-r--r--src/components/VencordSettings/UpdaterTab.tsx (renamed from src/components/VencordSettings/Updater.tsx)14
-rw-r--r--src/components/VencordSettings/VencordTab.tsx9
-rw-r--r--src/components/VencordSettings/index.tsx96
-rw-r--r--src/components/VencordSettings/settingsStyles.css2
-rw-r--r--src/components/VencordSettings/shared.tsx51
-rw-r--r--src/components/index.ts21
12 files changed, 97 insertions, 168 deletions
diff --git a/src/components/PluginSettings/index.tsx b/src/components/PluginSettings/index.tsx
index 3fb9bb4..8ccc740 100644
--- a/src/components/PluginSettings/index.tsx
+++ b/src/components/PluginSettings/index.tsx
@@ -20,20 +20,18 @@ import "./styles.css";
import * as DataStore from "@api/DataStore";
import { showNotice } from "@api/Notices";
-import { useSettings } from "@api/Settings";
+import { Settings, useSettings } from "@api/Settings";
import { classNameFactory } from "@api/Styles";
-import ErrorBoundary from "@components/ErrorBoundary";
import { Flex } from "@components/Flex";
-import { handleComponentFailed } from "@components/handleComponentFailed";
import { Badge } from "@components/PluginSettings/components";
import PluginModal from "@components/PluginSettings/PluginModal";
import { Switch } from "@components/Switch";
+import { SettingsTab } from "@components/VencordSettings/shared";
import { ChangeList } from "@utils/ChangeList";
import { Logger } from "@utils/Logger";
import { Margins } from "@utils/margins";
import { classes } from "@utils/misc";
import { openModalLazy } from "@utils/modal";
-import { onlyOnce } from "@utils/onlyOnce";
import { LazyComponent, useAwaiter } from "@utils/react";
import { Plugin } from "@utils/types";
import { findByCode, findByPropsLazy } from "@webpack";
@@ -96,7 +94,7 @@ interface PluginCardProps extends React.HTMLProps<HTMLDivElement> {
}
function PluginCard({ plugin, disabled, onRestartNeeded, onMouseEnter, onMouseLeave, isNew }: PluginCardProps) {
- const settings = useSettings([`plugins.${plugin.name}.enabled`]).plugins[plugin.name];
+ const settings = Settings.plugins[plugin.name];
const isEnabled = () => settings.enabled ?? false;
@@ -179,7 +177,7 @@ enum SearchStatus {
DISABLED
}
-export default ErrorBoundary.wrap(function PluginSettings() {
+export default function PluginSettings() {
const settings = useSettings();
const changes = React.useMemo(() => new ChangeList<string>(), []);
@@ -303,7 +301,7 @@ export default ErrorBoundary.wrap(function PluginSettings() {
}
return (
- <Forms.FormSection className={Margins.top16}>
+ <SettingsTab title="Plugins">
<ReloadRequiredCard required={changes.hasChanges} />
<Forms.FormTitle tag="h5" className={classes(Margins.top20, Margins.bottom8)}>
@@ -342,12 +340,9 @@ export default ErrorBoundary.wrap(function PluginSettings() {
<div className={cl("grid")}>
{requiredPlugins}
</div>
- </Forms.FormSection >
+ </SettingsTab >
);
-}, {
- message: "Failed to render the Plugin Settings. If this persists, try using the installer to reinstall!",
- onError: onlyOnce(handleComponentFailed),
-});
+}
function makeDependencyList(deps: string[]) {
return (
diff --git a/src/components/VencordSettings/BackupRestoreTab.tsx b/src/components/VencordSettings/BackupAndRestoreTab.tsx
index 1737470..a9a1c9f 100644
--- a/src/components/VencordSettings/BackupRestoreTab.tsx
+++ b/src/components/VencordSettings/BackupAndRestoreTab.tsx
@@ -16,16 +16,17 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
-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, Text } from "@webpack/common";
+import { Button, Card, Text } from "@webpack/common";
+
+import { SettingsTab, wrapTab } from "./shared";
function BackupRestoreTab() {
return (
- <Forms.FormSection title="Settings Sync" className={Margins.top16}>
+ <SettingsTab title="Backup & Restore">
<Card className={classes("vc-settings-card", "vc-backup-restore-card")}>
<Flex flexDirection="column">
<strong>Warning</strong>
@@ -59,8 +60,8 @@ function BackupRestoreTab() {
Export Settings
</Button>
</Flex>
- </Forms.FormSection>
+ </SettingsTab>
);
}
-export default ErrorBoundary.wrap(BackupRestoreTab);
+export default wrapTab(BackupRestoreTab, "Backup & Restore");
diff --git a/src/components/VencordSettings/CloudTab.tsx b/src/components/VencordSettings/CloudTab.tsx
index 5e48a72..77e5298 100644
--- a/src/components/VencordSettings/CloudTab.tsx
+++ b/src/components/VencordSettings/CloudTab.tsx
@@ -19,13 +19,14 @@
import { showNotification } from "@api/Notifications";
import { Settings, useSettings } from "@api/Settings";
import { CheckedTextInput } from "@components/CheckedTextInput";
-import ErrorBoundary from "@components/ErrorBoundary";
import { Link } from "@components/Link";
import { authorizeCloud, cloudLogger, deauthorizeCloud, getCloudAuth, getCloudUrl } from "@utils/cloud";
import { Margins } from "@utils/margins";
import { deleteCloudSettings, getCloudSettings, putCloudSettings } from "@utils/settingsSync";
import { Alerts, Button, Forms, Switch, Tooltip } from "@webpack/common";
+import { SettingsTab, wrapTab } from "./shared";
+
function validateUrl(url: string) {
try {
new URL(url);
@@ -114,7 +115,7 @@ function CloudTab() {
const settings = useSettings(["cloud.authenticated", "cloud.url"]);
return (
- <>
+ <SettingsTab title="Vencord Cloud">
<Forms.FormSection title="Cloud Settings" className={Margins.top16}>
<Forms.FormText variant="text-md/normal" className={Margins.bottom20}>
Vencord comes with a cloud integration that adds goodies like settings sync across devices.
@@ -157,8 +158,8 @@ function CloudTab() {
<Forms.FormDivider className={Margins.top16} />
</Forms.FormSection >
<SettingsSyncSection />
- </>
+ </SettingsTab>
);
}
-export default ErrorBoundary.wrap(CloudTab);
+export default wrapTab(CloudTab, "Cloud");
diff --git a/src/components/PatchHelper.tsx b/src/components/VencordSettings/PatchHelperTab.tsx
index 6c95a8a..d5bd94c 100644
--- a/src/components/PatchHelper.tsx
+++ b/src/components/VencordSettings/PatchHelperTab.tsx
@@ -16,16 +16,16 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
+import { CheckedTextInput } from "@components/CheckedTextInput";
import { debounce } from "@utils/debounce";
import { Margins } from "@utils/margins";
import { canonicalizeMatch, canonicalizeReplace } from "@utils/patches";
import { makeCodeblock } from "@utils/text";
import { ReplaceFn } from "@utils/types";
import { search } from "@webpack";
-import { Button, Clipboard, Forms, Parser, React, Switch, Text, TextInput } from "@webpack/common";
+import { Button, Clipboard, Forms, Parser, React, Switch, TextInput } from "@webpack/common";
-import { CheckedTextInput } from "./CheckedTextInput";
-import ErrorBoundary from "./ErrorBoundary";
+import { SettingsTab, wrapTab } from "./shared";
// Do not include diff in non dev builds (side effects import)
if (IS_DEV) {
@@ -258,8 +258,7 @@ function PatchHelper() {
}
return (
- <Forms.FormSection>
- <Text variant="heading-md/normal" tag="h2" className={Margins.bottom8}>Patch Helper</Text>
+ <SettingsTab title="Patch Helper">
<Forms.FormTitle>find</Forms.FormTitle>
<TextInput
type="text"
@@ -304,8 +303,8 @@ function PatchHelper() {
<Button onClick={() => Clipboard.copy(code)}>Copy to Clipboard</Button>
</>
)}
- </Forms.FormSection>
+ </SettingsTab>
);
}
-export default IS_DEV ? ErrorBoundary.wrap(PatchHelper) : null;
+export default IS_DEV ? wrapTab(PatchHelper, "PatchHelper") : null;
diff --git a/src/components/VencordSettings/PluginsTab.tsx b/src/components/VencordSettings/PluginsTab.tsx
index 04b5dc2..6a32095 100644
--- a/src/components/VencordSettings/PluginsTab.tsx
+++ b/src/components/VencordSettings/PluginsTab.tsx
@@ -16,7 +16,8 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
-import ErrorBoundary from "@components/ErrorBoundary";
import PluginSettings from "@components/PluginSettings";
-export default ErrorBoundary.wrap(PluginSettings);
+import { wrapTab } from "./shared";
+
+export default wrapTab(PluginSettings, "Plugins");
diff --git a/src/components/VencordSettings/ThemesTab.tsx b/src/components/VencordSettings/ThemesTab.tsx
index 75fea34..79ddc50 100644
--- a/src/components/VencordSettings/ThemesTab.tsx
+++ b/src/components/VencordSettings/ThemesTab.tsx
@@ -17,13 +17,14 @@
*/
import { useSettings } from "@api/Settings";
-import ErrorBoundary from "@components/ErrorBoundary";
import { Link } from "@components/Link";
import { Margins } from "@utils/margins";
import { useAwaiter } from "@utils/react";
import { findLazy } from "@webpack";
import { Card, Forms, React, TextArea } from "@webpack/common";
+import { SettingsTab, wrapTab } from "./shared";
+
const TextAreaProps = findLazy(m => typeof m.textarea === "string");
function Validator({ link }: { link: string; }) {
@@ -74,8 +75,8 @@ function Validators({ themeLinks }: { themeLinks: string[]; }) {
);
}
-export default ErrorBoundary.wrap(function () {
- const settings = useSettings();
+function ThemesTab() {
+ const settings = useSettings(["themeLinks"]);
const [themeText, setThemeText] = React.useState(settings.themeLinks.join("\n"));
function onBlur() {
@@ -89,7 +90,7 @@ export default ErrorBoundary.wrap(function () {
}
return (
- <>
+ <SettingsTab title="Themes">
<Card className="vc-settings-card vc-text-selectable">
<Forms.FormTitle tag="h5">Paste links to .theme.css files here</Forms.FormTitle>
<Forms.FormText>One link per line</Forms.FormText>
@@ -124,6 +125,8 @@ export default ErrorBoundary.wrap(function () {
onBlur={onBlur}
/>
<Validators themeLinks={settings.themeLinks} />
- </>
+ </SettingsTab>
);
-});
+}
+
+export default wrapTab(ThemesTab, "Themes");
diff --git a/src/components/VencordSettings/Updater.tsx b/src/components/VencordSettings/UpdaterTab.tsx
index 9345d27..4d0b86c 100644
--- a/src/components/VencordSettings/Updater.tsx
+++ b/src/components/VencordSettings/UpdaterTab.tsx
@@ -17,21 +17,20 @@
*/
import { useSettings } from "@api/Settings";
-import ErrorBoundary from "@components/ErrorBoundary";
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 } from "@utils/misc";
import { relaunch } from "@utils/native";
-import { onlyOnce } from "@utils/onlyOnce";
import { useAwaiter } from "@utils/react";
import { changes, checkForUpdates, getRepo, isNewer, update, updateError, UpdateLogger } from "@utils/updater";
import { Alerts, Button, Card, Forms, Parser, React, Switch, Toasts } from "@webpack/common";
import gitHash from "~git-hash";
+import { SettingsTab, wrapTab } from "./shared";
+
function withDispatcher(dispatcher: React.Dispatch<React.SetStateAction<boolean>>, action: () => any) {
return async () => {
dispatcher(true);
@@ -199,7 +198,7 @@ function Updater() {
};
return (
- <Forms.FormSection className={Margins.top16}>
+ <SettingsTab title="Vencord Updater">
<Forms.FormTitle tag="h5">Updater Settings</Forms.FormTitle>
<Switch
value={settings.notifyAboutUpdates}
@@ -246,11 +245,8 @@ function Updater() {
<Forms.FormTitle tag="h5">Updates</Forms.FormTitle>
{isNewer ? <Newer {...commonProps} /> : <Updatable {...commonProps} />}
- </Forms.FormSection >
+ </SettingsTab>
);
}
-export default IS_WEB ? null : ErrorBoundary.wrap(Updater, {
- message: "Failed to render the Updater. If this persists, try using the installer to reinstall!",
- onError: onlyOnce(handleComponentFailed),
-});
+export default IS_WEB ? null : wrapTab(Updater, "Updater");
diff --git a/src/components/VencordSettings/VencordTab.tsx b/src/components/VencordSettings/VencordTab.tsx
index 8c71821..1502bfa 100644
--- a/src/components/VencordSettings/VencordTab.tsx
+++ b/src/components/VencordSettings/VencordTab.tsx
@@ -21,7 +21,6 @@ import { openNotificationLogModal } from "@api/Notifications/notificationLog";
import { Settings, useSettings } from "@api/Settings";
import { classNameFactory } from "@api/Styles";
import DonateButton from "@components/DonateButton";
-import ErrorBoundary from "@components/ErrorBoundary";
import { ErrorCard } from "@components/ErrorCard";
import { Margins } from "@utils/margins";
import { identity } from "@utils/misc";
@@ -29,6 +28,8 @@ import { relaunch, showItemInFolder } from "@utils/native";
import { useAwaiter } from "@utils/react";
import { Button, Card, Forms, React, Select, Slider, Switch } from "@webpack/common";
+import { SettingsTab, wrapTab } from "./shared";
+
const cl = classNameFactory("vc-settings-");
const DEFAULT_DONATE_IMAGE = "https://cdn.discordapp.com/emojis/1026533090627174460.png";
@@ -97,7 +98,7 @@ function VencordSettings() {
];
return (
- <React.Fragment>
+ <SettingsTab title="Vencord Settings">
<DonateCard image={donateImage} />
<Forms.FormSection title="Quick Actions">
<Card className={cl("quick-actions-card")}>
@@ -153,7 +154,7 @@ function VencordSettings() {
{typeof Notification !== "undefined" && <NotificationSection settings={settings.notifications} />}
- </React.Fragment>
+ </SettingsTab>
);
}
@@ -263,4 +264,4 @@ function DonateCard({ image }: DonateCardProps) {
);
}
-export default ErrorBoundary.wrap(VencordSettings);
+export default wrapTab(VencordSettings, "Vencord Settings");
diff --git a/src/components/VencordSettings/index.tsx b/src/components/VencordSettings/index.tsx
deleted file mode 100644
index 6d65aa1..0000000
--- a/src/components/VencordSettings/index.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-/*
- * Vencord, a modification for Discord's desktop app
- * Copyright (c) 2022 Vendicated and contributors
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
-*/
-
-import "./settingsStyles.css";
-
-import { classNameFactory } from "@api/Styles";
-import ErrorBoundary from "@components/ErrorBoundary";
-import { handleComponentFailed } from "@components/handleComponentFailed";
-import { isMobile } from "@utils/misc";
-import { onlyOnce } from "@utils/onlyOnce";
-import { Forms, SettingsRouter, TabBar, Text } from "@webpack/common";
-
-import BackupRestoreTab from "./BackupRestoreTab";
-import CloudTab from "./CloudTab";
-import PluginsTab from "./PluginsTab";
-import ThemesTab from "./ThemesTab";
-import Updater from "./Updater";
-import VencordSettings from "./VencordTab";
-
-const cl = classNameFactory("vc-settings-");
-
-interface SettingsProps {
- tab: string;
-}
-
-interface SettingsTab {
- name: string;
- component?: React.ComponentType;
-}
-
-const SettingsTabs: Record<string, SettingsTab> = {
- VencordSettings: { name: "Vencord", component: () => <VencordSettings /> },
- VencordPlugins: { name: "Plugins", component: () => <PluginsTab /> },
- VencordThemes: { name: "Themes", component: () => <ThemesTab /> },
- VencordUpdater: { name: "Updater" }, // Only show updater if IS_WEB is false
- VencordCloud: { name: "Cloud", component: () => <CloudTab /> },
- VencordSettingsSync: { name: "Backup & Restore", component: () => <BackupRestoreTab /> }
-};
-
-if (!IS_WEB) SettingsTabs.VencordUpdater.component = () => Updater && <Updater />;
-
-function Settings(props: SettingsProps) {
- const { tab = "VencordSettings" } = props;
-
- const CurrentTab = SettingsTabs[tab]?.component ?? null;
- if (isMobile) {
- return CurrentTab && <CurrentTab />;
- }
-
- return <Forms.FormSection>
- <Text variant="heading-lg/semibold" style={{ color: "var(--header-primary)" }} tag="h2">Vencord Settings</Text>
-
- <TabBar
- type="top"
- look="brand"
- className={cl("tab-bar")}
- selectedItem={tab}
- onItemSelect={SettingsRouter.open}
- >
- {Object.entries(SettingsTabs).map(([key, { name, component }]) => {
- if (!component) return null;
- return <TabBar.Item
- id={key}
- className={cl("tab-bar-item")}
- key={key}>
- {name}
- </TabBar.Item>;
- })}
- </TabBar>
- <Forms.FormDivider />
- {CurrentTab && <CurrentTab />}
- </Forms.FormSection >;
-}
-
-const onError = onlyOnce(handleComponentFailed);
-
-export default function (props: SettingsProps) {
- return <ErrorBoundary onError={onError}>
- <Settings tab={props.tab} />
- </ErrorBoundary>;
-}
diff --git a/src/components/VencordSettings/settingsStyles.css b/src/components/VencordSettings/settingsStyles.css
index 3652756..f7d75e6 100644
--- a/src/components/VencordSettings/settingsStyles.css
+++ b/src/components/VencordSettings/settingsStyles.css
@@ -29,14 +29,12 @@
.vc-settings-card {
padding: 1em;
margin-bottom: 1em;
- margin-top: 1em;
}
.vc-backup-restore-card {
background-color: var(--info-warning-background);
border-color: var(--info-warning-foreground);
color: var(--info-warning-text);
- margin-top: 0;
}
.vc-settings-theme-links {
diff --git a/src/components/VencordSettings/shared.tsx b/src/components/VencordSettings/shared.tsx
new file mode 100644
index 0000000..0d3910d
--- /dev/null
+++ b/src/components/VencordSettings/shared.tsx
@@ -0,0 +1,51 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import "./settingsStyles.css";
+
+import ErrorBoundary from "@components/ErrorBoundary";
+import { handleComponentFailed } from "@components/handleComponentFailed";
+import { Margins } from "@utils/margins";
+import { onlyOnce } from "@utils/onlyOnce";
+import { Forms, Text } from "@webpack/common";
+import type { ComponentType, PropsWithChildren } from "react";
+
+export function SettingsTab({ title, children }: PropsWithChildren<{ title: string; }>) {
+ return (
+ <Forms.FormSection>
+ <Text
+ variant="heading-lg/semibold"
+ tag="h2"
+ className={Margins.bottom16}
+ >
+ {title}
+ </Text>
+
+ {children}
+ </Forms.FormSection>
+ );
+}
+
+const onError = onlyOnce(handleComponentFailed);
+
+export function wrapTab(component: ComponentType, tab: string) {
+ return ErrorBoundary.wrap(component, {
+ message: `Failed to render the ${tab} tab. If this issue persists, try using the installer to reinstall!`,
+ onError,
+ });
+}
diff --git a/src/components/index.ts b/src/components/index.ts
deleted file mode 100644
index 3ee53b0..0000000
--- a/src/components/index.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-/*
- * Vencord, a modification for Discord's desktop app
- * Copyright (c) 2022 Vendicated and contributors
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
-*/
-
-export { default as PatchHelper } from "./PatchHelper";
-export { default as PluginSettings } from "./PluginSettings";
-export { default as VencordSettings } from "./VencordSettings";