From 8161a07dba401f04dac93f861e6b2cffe53ab7e3 Mon Sep 17 00:00:00 2001 From: Vendicated Date: Sat, 1 Oct 2022 00:42:50 +0200 Subject: Add in client updater, Notices API --- src/components/ErrorBoundary.tsx | 8 +-- src/components/Flex.tsx | 1 + src/components/Link.tsx | 19 ++++++ src/components/Settings.tsx | 43 +++++++++++-- src/components/Updater.tsx | 128 +++++++++++++++++++++++++++++++++++++++ 5 files changed, 189 insertions(+), 10 deletions(-) create mode 100644 src/components/Link.tsx create mode 100644 src/components/Updater.tsx (limited to 'src/components') diff --git a/src/components/ErrorBoundary.tsx b/src/components/ErrorBoundary.tsx index 2b754b2..5946cb1 100644 --- a/src/components/ErrorBoundary.tsx +++ b/src/components/ErrorBoundary.tsx @@ -1,5 +1,5 @@ import Logger from "../utils/logger"; -import { React } from "../webpack/common"; +import { Card, React } from "../webpack/common"; interface Props { fallback?: React.ComponentType>; @@ -16,7 +16,7 @@ export default class ErrorBoundary extends React.Component(Component: React.ComponentType): (props: T) => React.ReactElement { return (props) => ( - + ); } @@ -49,7 +49,7 @@ export default class ErrorBoundary extends React.Component; return ( -
{this.state.error} -
+ ); } } diff --git a/src/components/Flex.tsx b/src/components/Flex.tsx index c369767..881c7c2 100644 --- a/src/components/Flex.tsx +++ b/src/components/Flex.tsx @@ -4,6 +4,7 @@ import type { React } from '../webpack/common'; export function Flex(props: React.PropsWithChildren<{ flexDirection?: React.CSSProperties["flexDirection"]; style?: React.CSSProperties; + className?: string; }>) { props.style ??= {}; props.style.flexDirection ||= props.flexDirection; diff --git a/src/components/Link.tsx b/src/components/Link.tsx new file mode 100644 index 0000000..ef342d1 --- /dev/null +++ b/src/components/Link.tsx @@ -0,0 +1,19 @@ +import { React } from "../webpack/common"; + +interface Props { + href: string; + disabled?: boolean; + style?: React.CSSProperties; +} + +export function Link(props: React.PropsWithChildren) { + if (props.disabled) { + props.style ??= {}; + props.style.pointerEvents = "none"; + } + return ( + + {props.children} + + ); +} diff --git a/src/components/Settings.tsx b/src/components/Settings.tsx index 1950d7a..dd23b73 100644 --- a/src/components/Settings.tsx +++ b/src/components/Settings.tsx @@ -1,16 +1,19 @@ -import { humanFriendlyJoin, useAwaiter } from "../utils/misc"; +import { classes, humanFriendlyJoin, lazy, useAwaiter } from "../utils/misc"; import Plugins from 'plugins'; import { useSettings } from "../api/settings"; import IpcEvents from "../utils/IpcEvents"; -import { Button, Switch, Forms, React } from "../webpack/common"; +import { Button, Switch, Forms, React, Margins } from "../webpack/common"; import ErrorBoundary from "./ErrorBoundary"; import { startPlugin } from "../plugins"; import { stopPlugin } from '../plugins/index'; import { Flex } from './Flex'; +import { isOutdated } from "../utils/updater"; +import { Updater } from "./Updater"; export default ErrorBoundary.wrap(function Settings(props) { const [settingsDir, , settingsDirPending] = useAwaiter(() => VencordNative.ipc.invoke(IpcEvents.GET_SETTINGS_DIR), "Loading..."); + const [outdated, setOutdated] = React.useState(isOutdated); const settings = useSettings(); const depMap = React.useMemo(() => { @@ -31,8 +34,24 @@ export default ErrorBoundary.wrap(function Settings(props) { return ( - SettingsDir: {settingsDir} - + {outdated && ( + <> + Updater + + + )} + + + + + Settings + + + + SettingsDir: {settingsDir} + + + - Settings + settings.useQuickCss = v} @@ -56,6 +75,13 @@ export default ErrorBoundary.wrap(function Settings(props) { > Use QuickCss + settings.notifyAboutUpdates = v} + note="Shows a Toast on StartUp" + > + Get notified about new Updates + settings.unsafeRequire = v} @@ -63,8 +89,13 @@ export default ErrorBoundary.wrap(function Settings(props) { > Enable Unsafe Require + - Plugins + + + Plugins + + {sortedPlugins.map(p => { const enabledDependants = depMap[p.name]?.filter(d => settings.plugins[d].enabled); const dependency = enabledDependants?.length; diff --git a/src/components/Updater.tsx b/src/components/Updater.tsx new file mode 100644 index 0000000..e7b6d54 --- /dev/null +++ b/src/components/Updater.tsx @@ -0,0 +1,128 @@ +import gitHash from "git-hash"; +import { changes, checkForUpdates, getRepo, rebuild, update, UpdateLogger } from "../utils/updater"; +import { React, Forms, Button, Margins, Alerts, Card, Parser } from '../webpack/common'; +import { Flex } from "./Flex"; +import { useAwaiter } from '../utils/misc'; +import { Link } from "./Link"; + +interface Props { + setIsOutdated(b: boolean): void; +} + +function withDispatcher(dispatcher: React.Dispatch>, action: () => any) { + return async () => { + dispatcher(true); + try { + await action(); + } catch (e: any) { + UpdateLogger.error("Failed to update", e); + if (!e) { + var err = "An unknown error occurred (error is undefined).\nPlease try again."; + } else if (e.code && e.cmd) { + const { code, path, cmd, stderr } = e; + + if (code === "ENOENT") + var err = `Command \`${path}\` not found.\nPlease install it and try again`; + else { + var err = `An error occured while running \`${cmd}\`:\n`; + err += stderr || `Code \`${code}\`. See the console for more info`; + } + + } else { + var err = "An unknown error occurred. See the console for more info."; + } + Alerts.show({ + title: "Oops!", + body: err.split("\n").map(line =>
{Parser.parse(line)}
) + }); + } + finally { + dispatcher(false); + } + }; +}; + +export function Updater(p: Props) { + const [repo, err, repoPending] = useAwaiter(getRepo, "Loading..."); + const [isChecking, setIsChecking] = React.useState(false); + const [isUpdating, setIsUpdating] = React.useState(false); + const [updates, setUpdates] = React.useState(changes); + + React.useEffect(() => { + if (err) + UpdateLogger.error("Failed to retrieve repo", err); + }, [err]); + + return ( + <> + Repo: {repoPending ? repo : err ? "Failed to retrieve - check console" : ( + + {repo.split("/").slice(-2).join("/")} + + )} ({gitHash}) + + + There are {updates.length} Updates + + + + {updates.map(({ hash, author, message }) => ( +
+ + {hash} + + {message} - {author} +
+ ))} + + + + + + + + ); +} -- cgit