fix: news page crashing; + feat: loading "page" for yarg launch page; (…

…#29) * refactor: getYARGReleaseZip + getYARGReleaseSig * refactor: remove os fetch from util methods * refactor: make useYARG hooks more type safe; * feat: add return for loading/error states on yarg pages * fix: new news crashing when opening oops * fix: missing "os" tauri module for catching os type also just discovered that the os module has locale in BCP-47 which will be quite useful in the future (https://tauri.app/v1/api/js/os#locale) * refactor: get sig asset url from an zip asset url * chore: package updates * chore: use es2020 instead of esnext for compatibility * feat: compatibility with es2020 (safari 14/chrome 105)
YARC-Official · Aug 13, 2023 · 03ab5f3 · 03ab5f3
1 parent d99fb9e
commit 03ab5f3
Show file tree

Hide file tree

Showing 17 changed files with 737 additions and 1,329 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -12,7 +12,7 @@
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
- "ecmaVersion": "latest",
+ "ecmaVersion": "2020",
  "sourceType": "module"
  },
  "plugins": [

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -18,49 +18,49 @@
  "@tauri-apps/cli": "^1.4.0",
  "@types/dompurify": "^3.0.2",
  "@types/marked": "^5.0.1",
- "@types/node": "^20.4.2",
- "@types/react": "^18.2.15",
+ "@types/node": "^20.4.10",
+ "@types/react": "^18.2.20",
  "@types/react-dom": "^18.2.7",
- "@typescript-eslint/eslint-plugin": "^6.1.0",
- "@typescript-eslint/parser": "^6.1.0",
- "@vitejs/plugin-react": "^4.0.3",
+ "@typescript-eslint/eslint-plugin": "^6.3.0",
+ "@typescript-eslint/parser": "^6.3.0",
+ "@vitejs/plugin-react": "^4.0.4",
  "autoprefixer": "^10.4.14",
- "eslint": "^8.45.0",
- "eslint-import-resolver-typescript": "^3.5.5",
- "eslint-plugin-import": "^2.27.5",
- "eslint-plugin-react": "^7.33.0",
- "postcss": "^8.4.26",
+ "eslint": "^8.47.0",
+ "eslint-import-resolver-typescript": "^3.6.0",
+ "eslint-plugin-import": "^2.28.0",
+ "eslint-plugin-react": "^7.33.1",
+ "postcss": "^8.4.27",
  "postcss-cli": "^10.1.0",
  "typescript": "^5.1.6",
- "vite": "^4.4.5",
- "vite-plugin-node-polyfills": "^0.9.0",
+ "vite": "^4.4.9",
+ "vite-plugin-node-polyfills": "^0.11.1",
  "vite-plugin-svgr": "^3.2.0",
  "vite-tsconfig-paths": "^4.2.0"
  },
  "dependencies": {
  "@radix-ui/react-dialog": "^1.0.4",
  "@radix-ui/react-progress": "^1.0.3",
  "@radix-ui/react-tooltip": "1.0.6",
- "@tanstack/query-sync-storage-persister": "^4.29.25",
- "@tanstack/react-query": "^4.29.25",
- "@tanstack/react-query-persist-client": "^4.29.25",
+ "@tanstack/query-sync-storage-persister": "^4.32.6",
+ "@tanstack/react-query": "^4.32.6",
+ "@tanstack/react-query-persist-client": "^4.32.6",
  "@tauri-apps/api": "^1.4.0",
- "@types/lodash": "^4.14.195",
+ "@types/lodash": "^4.14.197",
  "async-wait-until": "^2.0.12",
  "date-fns": "^2.30.0",
  "dompurify": "^3.0.5",
  "gray-matter": "^4.0.3",
  "js-video-url-parser": "^0.5.1",
  "lodash": "^4.17.21",
- "marked": "^5.1.1",
+ "marked": "^7.0.2",
  "react": "^18.2.0",
  "react-dom": "^18.2.0",
- "react-error-boundary": "^4.0.10",
+ "react-error-boundary": "^4.0.11",
  "react-image": "^4.1.0",
- "react-router-dom": "^6.14.2",
- "serialize-error": "^11.0.0",
+ "react-router-dom": "^6.15.0",
+ "serialize-error": "^11.0.1",
  "tauri-plugin-log-api": "github:tauri-apps/tauri-plugin-log#v1",
  "vite-plugin-top-level-await": "^1.3.1",
- "zustand": "^4.3.9"
+ "zustand": "^4.4.1"
  }
 }
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
@@ -15,7 +15,7 @@ tauri-build = { version = "1.3", features = [] }
 [dependencies]
 log = "^0.4"
 tauri-plugin-log = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v1" }
-tauri = { version = "1.3", features = ["dialog-all", "shell-open", "updater", "window-close", "window-hide", "window-maximize", "window-minimize", "window-show", "window-start-dragging", "window-unmaximize", "window-unminimize"] }
+tauri = { version = "1.3", features = [ "os-all", "dialog-all", "shell-open", "updater", "window-close", "window-hide", "window-maximize", "window-minimize", "window-show", "window-start-dragging", "window-unmaximize", "window-unminimize"] }
 serde = { version = "1.0", features = ["derive"] }
 serde_json = "1.0"
 reqwest = { version = "0.11.18", features = ["stream"] }

diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -35,6 +35,9 @@
  "message": true,
  "open": true,
  "save": true
+ },
+ "os": {
+ "all": true
  }
  },
  "bundle": {

diff --git a/src/components/Sidebar/Versions/YARG.tsx b/src/components/Sidebar/Versions/YARG.tsx
@@ -1,4 +1,4 @@
-import { useYARGRelease } from "@app/hooks/useYARGRelease";
+import { YARGChannels, useYARGRelease } from "@app/hooks/useYARGRelease";
 import { YARGStates, useYARGVersion } from "@app/hooks/useYARGVersion";
 import BaseVersion from "./Base";
 import NightlyYARGIcon from "@app/assets/NightlyYARGIcon.png";
@@ -7,11 +7,11 @@ import DevYARGIcon from "@app/assets/DevYARGIcon.png";
 import { NavLink } from "react-router-dom";
 
 interface Props {
- channel: "stable" | "nightly" | "newEngine";
+ channel: YARGChannels
 }
 
 const YARGVersion: React.FC<Props> = ({ channel }: Props) => {
- const releaseData = useYARGRelease(channel);
+ const {data: releaseData} = useYARGRelease(channel);
  const { state } = useYARGVersion(releaseData, channel);
 
  function getChannelIcon() {

diff --git a/src/hooks/useYARGRelease.ts b/src/hooks/useYARGRelease.ts
@@ -1,6 +1,7 @@
 import { useQuery } from "@tanstack/react-query";
 import { Endpoints } from "@octokit/types";
-import { invoke } from "@tauri-apps/api/tauri";
+import { OsType } from "@tauri-apps/api/os";
+
 
 export type YARGChannels = "stable" | "nightly" | "newEngine";
 
@@ -22,62 +23,36 @@ export const useYARGRelease = (channel: YARGChannels) => {
  `https://api.github.com/repos/YARC-Official/${repositoryName[channel]}/releases/latest`)
  .then(res => res.json()),
  select: (data): ExtendedReleaseData => ({ ...data, channel: channel })
- }).data as ExtendedReleaseData;
+ });
 };
 
-export const getYARGReleaseZip = async (releaseData: ReleaseData) => {
- const os = await invoke("get_os") as string;
-
- // Get the zip suffix depending on the OS
- let zipSuffixes: string[] = [];
- switch (os) {
- case "windows":
- zipSuffixes = ["Windows-x64.zip"];
- break;
- case "macos":
- zipSuffixes = ["MacOS-Universal.zip"];
- break;
- case "linux":
- zipSuffixes = ["Linux-x86_64.zip", "Linux-x64.zip"];
- break;
- }
+export const getYARGReleaseZip = (releaseData: ReleaseData, platformType: OsType) => {
+ const suffixesPerPlatform: {[key in OsType]: string[]} = {
+ "Windows_NT": ["Windows-x64.zip"],
+ "Darwin": ["MacOS-Universal.zip"],
+ "Linux": ["Linux-x86_64.zip", "Linux-x64.zip"],
+ };
 
- // Find the zip in the assets
- for (const asset of releaseData.assets) {
- // Check all of the suffixes
- let skip = true;
- for (const suffix of zipSuffixes) {
- if (asset.name.endsWith(suffix)) {
- skip = false;
- break;
- }
- }
+ const platformSuffixes = suffixesPerPlatform[platformType];
 
- // If not found, continue
- if (skip) {
- continue;
- }
+ const asset = releaseData.assets.find(asset => {
+ return platformSuffixes.find(suffix => asset.name.endsWith(suffix));
+ });
 
- // Done!
- return asset.browser_download_url;
- }
+ if(asset) return asset.browser_download_url;
 
  // Otherwise, the platform is not supported!
- throw new Error(`Platform "${os}" is not supported in release "${releaseData.tag_name}"!`);
+ throw new Error(`Platform of type "${platformType}" is not supported in release "${releaseData.tag_name}"!`);
 };
 
-export const getYARGReleaseSig = async (releaseData: ReleaseData) => {
- const zip = await getYARGReleaseZip(releaseData);
- const sig = zip.split("/").at(-1) + ".sig";
+export const getYARGReleaseSigFromZipURL = (releaseData: ReleaseData, zipUrl: string) => {
+ const sigAssetName = zipUrl.split("/").slice(-1) + ".sig";
+
+ const asset = releaseData.assets.find(asset => asset.name === sigAssetName);
 
- // Find the zip in the assets
- for (const asset of releaseData.assets) {
- if (asset.name == sig) {
- return asset.browser_download_url;
- }
- }
+ if(asset) return asset.browser_download_url;
 
  // Otherwise, there's no signature
- console.warn(`Failed to find signature file "${sig}" in release "${releaseData.tag_name}"!`);
+ console.warn(`Failed to find signature file "${sigAssetName}" in release "${releaseData.tag_name}"!`);
  return undefined;
 };
diff --git a/src/hooks/useYARGVersion.ts b/src/hooks/useYARGVersion.ts
@@ -1,6 +1,7 @@
 import { useEffect } from "react";
-import { ExtendedReleaseData, getYARGReleaseZip, getYARGReleaseSig } from "./useYARGRelease";
+import { ExtendedReleaseData, getYARGReleaseZip, getYARGReleaseSigFromZipURL } from "./useYARGRelease";
 import { invoke } from "@tauri-apps/api/tauri";
+import { type } from "@tauri-apps/api/os";
 import { useYARGState } from "@app/stores/YARGStateStore";
 import { useDownloadClient } from "@app/utils/Download/provider";
 import { YARGDownload, generateYARGUUID } from "@app/utils/Download/Processors/YARG";
@@ -24,12 +25,12 @@ export type YARGVersion = {
  payload?: DownloadPayload
 }
 
-export const useYARGVersion = (releaseData: ExtendedReleaseData, profileName: string) => {
+export const useYARGVersion = (releaseData: ExtendedReleaseData | undefined, profileName: string): YARGVersion => {
+ // Initialize hooks before returning
  const { state, setState } = useYARGState(releaseData?.tag_name);
-
  const dialogManager = useDialogManager();
  const downloadClient = useDownloadClient();
- const payload = downloadClient.usePayload(generateYARGUUID(releaseData?.tag_name));
+ const payload = downloadClient.usePayload(releaseData ? generateYARGUUID(releaseData.tag_name) : undefined);
 
  useEffect(() => {
  (
@@ -46,6 +47,15 @@ export const useYARGVersion = (releaseData: ExtendedReleaseData, profileName: st
  )();
  }, [releaseData]);
 
+ // If we don't have a release data yet, return a dummy loading version;
+ if(!releaseData) {
+ return {
+ state,
+ play: async () => {},
+ download: async () => {},
+ };
+ } 
+
  const play = async () => {
  if (!releaseData) return;
 
@@ -83,8 +93,9 @@ export const useYARGVersion = (releaseData: ExtendedReleaseData, profileName: st
  setState(YARGStates.DOWNLOADING);
 
  try {
- const zipUrl = await getYARGReleaseZip(releaseData);
- const sigUrl = await getYARGReleaseSig(releaseData);
+ const platformType = await type();
+ const zipUrl = getYARGReleaseZip(releaseData, platformType);
+ const sigUrl = getYARGReleaseSigFromZipURL(releaseData, zipUrl);
 
  const downloader = new YARGDownload(
  zipUrl,
@@ -104,5 +115,5 @@ export const useYARGVersion = (releaseData: ExtendedReleaseData, profileName: st
  }
  };
 
- return { state, play, download, payload } as YARGVersion;
+ return { state, play, download, payload };
 };
diff --git a/src/main.tsx b/src/main.tsx
@@ -18,16 +18,7 @@ window.addEventListener("error", event => {
  LogError(JSON.stringify(serializeError(event)));
 });
 
-let error = undefined;
-
-try {
- await invoke("init");
-} catch (e) {
- error = e as string;
- console.error(e);
-}
-
-if (!error) {
+invoke("init").then(() => {
  ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <React.StrictMode>
  <ErrorBoundary FallbackComponent={ErrorScreen} onError={onError}>
@@ -42,7 +33,10 @@ if (!error) {
  </ErrorBoundary>
  </React.StrictMode>
  );
-} else {
+}).catch(e => {
+ console.error(e);
+ LogError(JSON.stringify(serializeError(e)));
+
  ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <React.StrictMode>
  <TitleBar />
@@ -51,8 +45,8 @@ if (!error) {
  Please report this to our Discord or GitHub immediately.
  </p>
  <p>
- {error}
+ {e instanceof Error ? e.message : JSON.stringify(serializeError(e))}
  </p>
  </React.StrictMode>
  );
-}
+});