diff options
| -rw-r--r-- | src/components/ErrorBoundary.tsx | 12 | ||||
| -rw-r--r-- | src/components/ErrorCard.tsx | 21 | ||||
| -rw-r--r-- | src/components/Settings.tsx | 4 | ||||
| -rw-r--r-- | src/components/Updater.tsx | 32 | ||||
| -rw-r--r-- | src/utils/updater.ts | 3 |
5 files changed, 55 insertions, 17 deletions
diff --git a/src/components/ErrorBoundary.tsx b/src/components/ErrorBoundary.tsx index 5946cb1..21a3155 100644 --- a/src/components/ErrorBoundary.tsx +++ b/src/components/ErrorBoundary.tsx @@ -1,5 +1,6 @@ import Logger from "../utils/logger"; import { Card, React } from "../webpack/common"; +import { ErrorCard } from "./ErrorCard"; interface Props { fallback?: React.ComponentType<React.PropsWithChildren<{ error: any; }>>; @@ -49,12 +50,8 @@ export default class ErrorBoundary extends React.Component<React.PropsWithChildr />; return ( - <Card style={{ + <ErrorCard style={{ overflow: "hidden", - padding: "2em", - backgroundColor: color + "30", - borderColor: color, - color: "var(--text-normal)" }}> <h1>Oh no!</h1> <p> @@ -62,10 +59,11 @@ export default class ErrorBoundary extends React.Component<React.PropsWithChildr and in your console. </p> <code> - <pre>{this.state.error} + <pre> + {this.state.error} </pre> </code> - </Card> + </ErrorCard> ); } } diff --git a/src/components/ErrorCard.tsx b/src/components/ErrorCard.tsx new file mode 100644 index 0000000..d0bf8c3 --- /dev/null +++ b/src/components/ErrorCard.tsx @@ -0,0 +1,21 @@ +import { Card } from "../webpack/common"; + +interface Props { + style?: React.CSSProperties; + className?: string; +} +export function ErrorCard(props: React.PropsWithChildren<Props>) { + return ( + <Card className={props.className} style={ + { + padding: "2em", + backgroundColor: "#e7828430", + borderColor: "#e78284", + color: "var(--text-normal)", + ...props.style + } + }> + {props.children} + </Card> + ); +} diff --git a/src/components/Settings.tsx b/src/components/Settings.tsx index 3e883b9..bc44e26 100644 --- a/src/components/Settings.tsx +++ b/src/components/Settings.tsx @@ -74,14 +74,14 @@ export default ErrorBoundary.wrap(function Settings() { <Flex className={classes(Margins.marginBottom20)}> <Button - onClick={() => location.reload()} + onClick={() => window.DiscordNative.app.relaunch()} size={Button.Sizes.SMALL} color={Button.Colors.GREEN} > Reload </Button> <Button - onClick={() => VencordNative.ipc.invoke(IpcEvents.OPEN_PATH, settingsDir)} + onClick={() => window.DiscordNative.fileManager.showItemInFolder(settingsDir)} size={Button.Sizes.SMALL} disabled={settingsDirPending} > diff --git a/src/components/Updater.tsx b/src/components/Updater.tsx index 947ce43..7e4b2a7 100644 --- a/src/components/Updater.tsx +++ b/src/components/Updater.tsx @@ -1,10 +1,11 @@ import gitHash from "git-hash"; -import { changes, checkForUpdates, getRepo, rebuild, update, UpdateLogger } from "../utils/updater"; +import { changes, checkForUpdates, getRepo, rebuild, update, UpdateLogger, updateError } from '../utils/updater'; import { React, Forms, Button, Margins, Alerts, Card, Parser, Toasts } from '../webpack/common'; import { Flex } from "./Flex"; import { useAwaiter } from '../utils/misc'; import { Link } from "./Link"; import ErrorBoundary from "./ErrorBoundary"; +import { ErrorCard } from "./ErrorCard"; function withDispatcher(dispatcher: React.Dispatch<React.SetStateAction<boolean>>, action: () => any) { @@ -31,7 +32,11 @@ function withDispatcher(dispatcher: React.Dispatch<React.SetStateAction<boolean> } Alerts.show({ title: "Oops!", - body: err.split("\n").map(line => <div>{Parser.parse(line)}</div>) + body: ( + <ErrorCard> + {err.split("\n").map(line => <div>{Parser.parse(line)}</div>)} + </ErrorCard> + ) }); } finally { @@ -51,7 +56,7 @@ export default ErrorBoundary.wrap(function Updater() { UpdateLogger.error("Failed to retrieve repo", err); }, [err]); - const isOutdated = updates.length > 0; + const isOutdated = updates?.length > 0; return ( <Forms.FormSection tag="h1" title="Vencord Updater"> @@ -67,11 +72,22 @@ export default ErrorBoundary.wrap(function Updater() { <Forms.FormTitle tag="h5">Updates</Forms.FormTitle> - <Forms.FormText className={Margins.marginBottom8}> - {updates.length ? `There are ${updates.length} Updates` : "Up to Date!"} - </Forms.FormText> + {!updates && updateError ? ( + <> + <Forms.FormText>Failed to check updates. Check the console for more info</Forms.FormText> + <ErrorCard style={{ padding: "1em" }}> + <p>{updateError.stderr || updateError.stdout || "An unknown error occurred"}</p> + </ErrorCard> + </> + ) : + ( + <Forms.FormText className={Margins.marginBottom8}> + {isOutdated ? `There are ${updates.length} Updates` : "Up to Date!"} + </Forms.FormText> + ) + } - {updates.length > 0 && ( + {isOutdated && ( <Card style={{ padding: ".5em" }}> {updates.map(({ hash, author, message }) => ( <div> @@ -139,6 +155,6 @@ export default ErrorBoundary.wrap(function Updater() { Check for Updates </Button> </Flex> - </Forms.FormSection> + </Forms.FormSection > ); }); diff --git a/src/utils/updater.ts b/src/utils/updater.ts index b3fa812..e66a149 100644 --- a/src/utils/updater.ts +++ b/src/utils/updater.ts @@ -4,12 +4,15 @@ import { IpcRes } from './types'; export const UpdateLogger = new Logger("Updater", "white"); export let isOutdated = false; +export let updateError: any; export let changes: Record<"hash" | "author" | "message", string>[]; async function Unwrap<T>(p: Promise<IpcRes<T>>) { const res = await p; if (res.ok) return res.value; + + updateError = res.error; throw res.error; } |