diff options
| -rw-r--r-- | src/components/VencordSettings/index.tsx | 6 | ||||
| -rw-r--r-- | src/plugins/apiContextMenu.ts | 2 | ||||
| -rw-r--r-- | src/plugins/settings.tsx | 30 | ||||
| -rw-r--r-- | src/utils/misc.tsx | 4 |
4 files changed, 30 insertions, 12 deletions
diff --git a/src/components/VencordSettings/index.tsx b/src/components/VencordSettings/index.tsx index c15944c..b2916c4 100644 --- a/src/components/VencordSettings/index.tsx +++ b/src/components/VencordSettings/index.tsx @@ -21,6 +21,7 @@ import "./settingsStyles.css"; import { classNameFactory } from "@api/Styles"; import ErrorBoundary from "@components/ErrorBoundary"; import { handleComponentFailed } from "@components/handleComponentFailed"; +import { isMobile } from "@utils/misc"; import { Forms, SettingsRouter, TabBar, Text } from "@webpack/common"; import BackupRestoreTab from "./BackupRestoreTab"; @@ -55,7 +56,10 @@ if (!IS_WEB) SettingsTabs.VencordUpdater.component = () => Updater && <Updater / function Settings(props: SettingsProps) { const { tab = "VencordSettings" } = props; - const CurrentTab = SettingsTabs[tab]?.component; + 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> diff --git a/src/plugins/apiContextMenu.ts b/src/plugins/apiContextMenu.ts index 0eaca78..d04e0e6 100644 --- a/src/plugins/apiContextMenu.ts +++ b/src/plugins/apiContextMenu.ts @@ -23,6 +23,8 @@ export default definePlugin({ name: "ContextMenuAPI", description: "API for adding/removing items to/from context menus.", authors: [Devs.Nuckyz, Devs.Ven], + required: true, + patches: [ { find: "♫ (つ｡◕‿‿◕｡)つ ♪", diff --git a/src/plugins/settings.tsx b/src/plugins/settings.tsx index f9a7548..74d0496 100644 --- a/src/plugins/settings.tsx +++ b/src/plugins/settings.tsx @@ -16,6 +16,7 @@ * along with this program. If not, see <https://www.gnu.org/licenses/>. */ +import { addContextMenuPatch } from "@api/ContextMenu"; import { Settings } from "@api/settings"; import PatchHelper from "@components/PatchHelper"; import { Devs } from "@utils/constants"; @@ -33,6 +34,23 @@ export default definePlugin({ description: "Adds Settings UI and debug info", authors: [Devs.Ven, Devs.Megu], required: true, + + start() { + // The settings shortcuts in the user settings cog context menu + // read the elements from a hardcoded map which for obvious reason + // doesn't contain our sections. This patches the actions of our + // sections to manually use SettingsRouter (which only works on desktop + // but the context menu is usually not available on mobile anyway) + addContextMenuPatch("user-settings-cog", children => { + const section = children.find(c => Array.isArray(c) && c.some(it => it?.props?.id === "VencordSettings")) as any; + section?.forEach(c => { + if (c?.props?.id?.startsWith("Vencord")) { + c.props.action = () => SettingsRouter.open(c.props.id); + } + }); + }); + }, + patches: [{ find: ".versionHash", replacement: [ @@ -69,8 +87,6 @@ export default definePlugin({ }], makeSettingsCategories({ ID }: { ID: Record<string, unknown>; }) { - const makeOnClick = (tab: string) => () => SettingsRouter.open(tab); - return [ { section: ID.HEADER, @@ -79,50 +95,42 @@ export default definePlugin({ { section: "VencordSettings", label: "Vencord", - element: () => <SettingsComponent tab="VencordSettings" />, - onClick: makeOnClick("VencordSettings") + element: () => <SettingsComponent tab="VencordSettings" /> }, { section: "VencordPlugins", label: "Plugins", element: () => <SettingsComponent tab="VencordPlugins" />, - onClick: makeOnClick("VencordPlugins") }, { section: "VencordThemes", label: "Themes", element: () => <SettingsComponent tab="VencordThemes" />, - onClick: makeOnClick("VencordThemes") }, !IS_WEB && { section: "VencordUpdater", label: "Updater", element: () => <SettingsComponent tab="VencordUpdater" />, - onClick: makeOnClick("VencordUpdater") }, { section: "VencordCloud", label: "Cloud", element: () => <SettingsComponent tab="VencordCloud" />, - onClick: makeOnClick("VencordCloud") }, { section: "VencordSettingsSync", label: "Backup & Restore", element: () => <SettingsComponent tab="VencordSettingsSync" />, - onClick: makeOnClick("VencordSettingsSync") }, IS_DEV && { section: "VencordPatchHelper", label: "Patch Helper", element: PatchHelper!, - onClick: makeOnClick("VencordPatchHelper") }, IS_VENCORD_DESKTOP && { section: "VencordDesktop", label: "Desktop Settings", element: VencordDesktop.Components.Settings, - onClick: makeOnClick("VencordDesktop") }, { section: ID.DIVIDER diff --git a/src/utils/misc.tsx b/src/utils/misc.tsx index b64dff9..b6a6423 100644 --- a/src/utils/misc.tsx +++ b/src/utils/misc.tsx @@ -204,3 +204,7 @@ export const checkIntersecting = (el: Element) => { export function identity<T>(value: T): T { return value; } + +// https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent#mobile_tablet_or_desktop +// "In summary, we recommend looking for the string Mobi anywhere in the User Agent to detect a mobile device." +export const isMobile = navigator.userAgent.includes("Mobi"); |