diff --git a/src/components/settings/tabs/BaseTab.tsx b/src/components/settings/tabs/BaseTab.tsx index 9ef95463c..9a2b7f6d4 100644 --- a/src/components/settings/tabs/BaseTab.tsx +++ b/src/components/settings/tabs/BaseTab.tsx @@ -25,7 +25,7 @@ import type { ComponentType, PropsWithChildren } from "react"; export function SettingsTab({ title, children }: PropsWithChildren<{ title: string; }>) { return ( - +
{children} - +
); } diff --git a/src/components/settings/tabs/plugins/PluginModal.tsx b/src/components/settings/tabs/plugins/PluginModal.tsx index 239a8d145..87fd174ec 100644 --- a/src/components/settings/tabs/plugins/PluginModal.tsx +++ b/src/components/settings/tabs/plugins/PluginModal.tsx @@ -109,14 +109,15 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti const Component = OptionComponentMap[setting.type]; return ( - + + + ); }); @@ -156,7 +157,7 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti - +
{plugin.description} {!pluginMeta.userPlugin && ( @@ -195,22 +196,22 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti )} /> - +
{!!plugin.settingsAboutComponent && (
- +
- +
)} - +
Settings {renderSettings()} - +
{ hasSettings && diff --git a/src/components/settings/tabs/plugins/index.tsx b/src/components/settings/tabs/plugins/index.tsx index ef4309d9b..8945cad3b 100644 --- a/src/components/settings/tabs/plugins/index.tsx +++ b/src/components/settings/tabs/plugins/index.tsx @@ -21,6 +21,7 @@ import "./styles.css"; import * as DataStore from "@api/DataStore"; import { useSettings } from "@api/Settings"; import { classNameFactory } from "@api/Styles"; +import ErrorBoundary from "@components/ErrorBoundary"; import { SettingsTab } from "@components/settings"; import { debounce } from "@shared/debounce"; import { ChangeList } from "@utils/ChangeList"; @@ -362,23 +363,27 @@ export default function PluginSettings() {
- + + +
- 0 ? [{ label: "Show Custom", value: SearchStatus.CUSTOM }] : []), + { label: "Show New", value: SearchStatus.NEW }, + ]} + serialize={String} + select={onStatusChange} + isSelected={v => v === searchValue.status} + closeOnSelect={true} + /> +
diff --git a/src/components/settings/tabs/sync/CloudTab.tsx b/src/components/settings/tabs/sync/CloudTab.tsx index f51d43fac..86d9a9bf3 100644 --- a/src/components/settings/tabs/sync/CloudTab.tsx +++ b/src/components/settings/tabs/sync/CloudTab.tsx @@ -68,7 +68,9 @@ function SettingsSyncSection() { const sectionEnabled = cloud.authenticated && cloud.settingsSync; return ( - +
+ Settings Sync + Synchronize your settings to the cloud. This allows easy synchronization across multiple devices with minimal effort. @@ -111,7 +113,7 @@ function SettingsSyncSection() { Delete Cloud Settings - +
); } @@ -131,7 +133,9 @@ function CloudTab() { return ( - +
+ Cloud Settings + Equicord comes with a cloud integration allowing settings to be synced across apps and devices.
@@ -206,7 +210,7 @@ function CloudTab() { - +
); diff --git a/src/components/settings/tabs/vencord/MacVibrancySettings.tsx b/src/components/settings/tabs/vencord/MacVibrancySettings.tsx index 2f6810645..784b0be00 100644 --- a/src/components/settings/tabs/vencord/MacVibrancySettings.tsx +++ b/src/components/settings/tabs/vencord/MacVibrancySettings.tsx @@ -5,6 +5,7 @@ */ import { useSettings } from "@api/Settings"; +import ErrorBoundary from "@components/ErrorBoundary"; import { Margins } from "@utils/margins"; import { identity } from "@utils/misc"; import { Forms, Select } from "@webpack/common"; @@ -15,66 +16,69 @@ export function VibrancySettings() { return ( <> Window vibrancy style (requires restart) - settings.macosVibrancyStyle = v} + isSelected={v => settings.macosVibrancyStyle === v} + serialize={identity} + /> + ); } diff --git a/src/components/settings/tabs/vencord/NotificationSettings.tsx b/src/components/settings/tabs/vencord/NotificationSettings.tsx index 2ebd729fc..e864bd193 100644 --- a/src/components/settings/tabs/vencord/NotificationSettings.tsx +++ b/src/components/settings/tabs/vencord/NotificationSettings.tsx @@ -16,7 +16,8 @@ import { Button, Forms, Select, Slider, Text } from "@webpack/common"; export function NotificationSection() { return ( - +
+ Vencord Notifications - +
); } diff --git a/src/components/settings/tabs/vencord/index.tsx b/src/components/settings/tabs/vencord/index.tsx index f2fb2cc7e..c28341bdd 100644 --- a/src/components/settings/tabs/vencord/index.tsx +++ b/src/components/settings/tabs/vencord/index.tsx @@ -152,7 +152,10 @@ function EquicordSettings() { buttonOnClick={() => openContributorModal(user)} /> )} - + +
+ Quick Actions + - +
- - +
+ Settings + Hint: You can change the position of this settings section in the{" "}
{needsVibrancySettings && ( <> @@ -303,10 +304,9 @@ function EquicordSettings() { )} - - + ); } diff --git a/src/plugins/decor/ui/modals/CreateDecorationModal.tsx b/src/plugins/decor/ui/modals/CreateDecorationModal.tsx index 6feb3b4f8..2b273f1c6 100644 --- a/src/plugins/decor/ui/modals/CreateDecorationModal.tsx +++ b/src/plugins/decor/ui/modals/CreateDecorationModal.tsx @@ -89,7 +89,8 @@ function CreateDecorationModal(props: ModalProps) {
{error !== null && {error.message}} - +
+ File File should be APNG or PNG. - - +
+
+ Name This name will be used when referring to this decoration. - +
+
Usage After enabling this plugin, you will see custom colors in @@ -191,7 +191,7 @@ function SettingsAboutComponent() { />
- ); + ); } export default definePlugin({ diff --git a/src/plugins/ignoreActivities/index.tsx b/src/plugins/ignoreActivities/index.tsx index 855c51eb3..34b674300 100644 --- a/src/plugins/ignoreActivities/index.tsx +++ b/src/plugins/ignoreActivities/index.tsx @@ -131,7 +131,7 @@ function IdsListComponent(props: { setValue: (value: string) => void; }) { } return ( - +
Filter List Comma separated list of activity IDs to filter (Useful for filtering specific RPC activities and CustomRPC void; }) { onChange={handleChange} placeholder="235834946571337729, 343383572805058560" /> - +
); } diff --git a/src/plugins/pinDms/components/CreateCategoryModal.tsx b/src/plugins/pinDms/components/CreateCategoryModal.tsx index 5192d7e7b..7f86b66e6 100644 --- a/src/plugins/pinDms/components/CreateCategoryModal.tsx +++ b/src/plugins/pinDms/components/CreateCategoryModal.tsx @@ -81,15 +81,15 @@ export function NewCategoryModal({ categoryId, modalProps, initialChannelId }: P {/* form is here so when you press enter while in the text input it submits */}
- +
Name setName(e)} /> - +
- +
Color )} /> - +
diff --git a/src/plugins/startupTimings/StartupTimingPage.tsx b/src/plugins/startupTimings/StartupTimingPage.tsx index b12df47ff..4e5ed166f 100644 --- a/src/plugins/startupTimings/StartupTimingPage.tsx +++ b/src/plugins/startupTimings/StartupTimingPage.tsx @@ -88,7 +88,8 @@ function TimingSection({ title, logs, traceEnd }: TimingSectionProps) { }); return ( - +
+ {title} {traceEnd && (
@@ -105,7 +106,7 @@ function TimingSection({ title, logs, traceEnd }: TimingSectionProps) { ))}
- +
); } @@ -117,7 +118,8 @@ function ServerTrace({ trace }: ServerTraceProps) { const lines = trace.split("\n"); return ( - +
+ Server Trace {lines.map((line, idx) => ( @@ -125,7 +127,7 @@ function ServerTrace({ trace }: ServerTraceProps) { ))} - +
); } diff --git a/src/plugins/vcNarrator/VoiceSetting.tsx b/src/plugins/vcNarrator/VoiceSetting.tsx index a16b16924..42800e057 100644 --- a/src/plugins/vcNarrator/VoiceSetting.tsx +++ b/src/plugins/vcNarrator/VoiceSetting.tsx @@ -117,9 +117,9 @@ function VoiceSetting() { export function VoiceSettingSection() { return ( - +
Voice - +
); } diff --git a/src/plugins/vcNarrator/index.tsx b/src/plugins/vcNarrator/index.tsx index b2ca10d10..bf0c5eb62 100644 --- a/src/plugins/vcNarrator/index.tsx +++ b/src/plugins/vcNarrator/index.tsx @@ -227,7 +227,7 @@ export default definePlugin({ } return ( - +
You can customise the spoken messages below. You can disable specific messages by setting them to nothing @@ -255,7 +255,7 @@ export default definePlugin({ )} {errorComponent} - +
); } }); diff --git a/src/webpack/common/components.ts b/src/webpack/common/components.ts index c4e0ac8e9..1c5c4c02b 100644 --- a/src/webpack/common/components.ts +++ b/src/webpack/common/components.ts @@ -19,20 +19,19 @@ import { FormSwitchCompat } from "@components/FormSwitch"; import { LazyComponent } from "@utils/lazyReact"; import * as t from "@vencord/discord-types"; -import { filters, mapMangledModuleLazy, waitFor } from "@webpack"; +import { filters, find, LazyComponentWebpack, mapMangledModuleLazy, waitFor } from "@webpack"; import { FormText } from "./FormText"; import { waitForComponent } from "./internal"; - const FormTitle = waitForComponent("FormTitle", filters.componentByCode('["defaultMargin".concat', '="h5"')); -const FormSection = waitForComponent("FormSection", filters.componentByCode(".titleId)")); const FormDivider = waitForComponent("FormDivider", filters.componentByCode(".divider,", ",style:", '"div"', /\.divider,\i\),style:/)); export const Forms = { FormTitle, FormText, - FormSection, + /** @deprecated don't use this */ + FormSection: "section" as never, // Backwards compat since Vesktop uses this FormDivider }; @@ -57,8 +56,16 @@ export const TextInput = waitForComponent("TextInput", filters.comp export const TextArea = waitForComponent("TextArea", filters.componentByCode("this.getPaddingRight()},id:")); export const Text = waitForComponent("Text", filters.componentByCode('case"always-white"')); export const Heading = waitForComponent("Heading", filters.componentByCode(">6?{", "variant:")); -export const Select = waitForComponent("Select", filters.componentByCode('="bottom",', ".select,", '"Escape"===')); -export const SearchableSelect = waitForComponent("SearchableSelect", filters.componentByCode(".setSelectionRange(", ".multi]:")); +export const Select: t.Select = LazyComponentWebpack(() => { + const oldFilter = filters.componentByCode('="bottom",', ".select,", '"Escape"==='); + const newFilter = filters.componentByCode('"Select"', ".newOptionLabel"); + + const res = find(oldFilter) ?? find(newFilter); + if (res) return res; + + throw new Error("Vencord failed to find the Select component"); +}); +export const SearchableSelect = waitForComponent("SearchableSelect", filters.componentByCode('"SearchableSelect"')); export const Slider = waitForComponent("Slider", filters.componentByCode('"markDash".concat(')); export const Popout = waitForComponent("Popout", filters.componentByCode("ref:this.ref,", "renderPopout:this.renderPopout,")); export const Dialog = waitForComponent("Dialog", filters.componentByCode('role:"dialog",tabIndex:-1'));