From 5077c19fdca6f76fa9dbe59d8d4322e99e0adfee Mon Sep 17 00:00:00 2001 From: SpikeHD Date: Sun, 24 Jul 2022 19:28:05 -0700 Subject: [PATCH] show installed mods --- src-tauri/src/gamebanana.rs | 6 +++--- src/ui/components/mods/ModList.tsx | 26 +++++++++++++++++++++----- src/ui/components/mods/ModTile.css | 1 + src/ui/components/mods/ModTile.tsx | 30 +++++++++++++++++++++++++----- src/utils/gamebanana.ts | 14 +++++++++++++- 5 files changed, 63 insertions(+), 14 deletions(-) diff --git a/src-tauri/src/gamebanana.rs b/src-tauri/src/gamebanana.rs index 9bae0d6..ad4eab3 100644 --- a/src-tauri/src/gamebanana.rs +++ b/src-tauri/src/gamebanana.rs @@ -9,8 +9,8 @@ static API_URL: &str = "https://api.gamebanana.com"; static SITE_URL: &str = "https://gamebanana.com"; #[tauri::command] -pub async fn get_download_links(modId: String) -> String { - let res = web::query(format!("{}/apiv9/Mod/{}/DownloadPage", SITE_URL, modId).as_str()).await; +pub async fn get_download_links(mod_id: String) -> String { + let res = web::query(format!("{}/apiv9/Mod/{}/DownloadPage", SITE_URL, mod_id).as_str()).await; res } @@ -65,7 +65,7 @@ pub async fn list_mods(path: String) -> HashMap { mod_info_strings.insert( path.to_str().unwrap().to_string(), format!( - "{{ name: \"{}\" }}", + "{{ \"name\": \"{}\" }}", path.file_name().unwrap().to_str().unwrap() ), ); diff --git a/src/ui/components/mods/ModList.tsx b/src/ui/components/mods/ModList.tsx index 09c6289..497f702 100644 --- a/src/ui/components/mods/ModList.tsx +++ b/src/ui/components/mods/ModList.tsx @@ -1,5 +1,5 @@ import React from 'react' -import { getInstalledMods, getMods, ModData } from '../../../utils/gamebanana' +import { getInstalledMods, getMods, ModData, PartialModData } from '../../../utils/gamebanana' import { LoadingCircle } from './LoadingCircle' import './ModList.css' @@ -15,7 +15,7 @@ interface IState { installedList: | { path: string - info: unknown + info: ModData | PartialModData }[] | null } @@ -34,9 +34,23 @@ export class ModList extends React.Component { async componentDidMount() { if (this.props.mode === 'installed') { - const installedMods = await getInstalledMods() + const installedMods = (await getInstalledMods()).map((mod) => { + // Check if it's a partial mod, and if so, fill in some pseudo-data + if (!('id' in mod.info)) { + const newInfo = mod.info as PartialModData - console.log(installedMods) + newInfo.images = [] + newInfo.submitter = { name: 'Unknown' } + newInfo.likes = 0 + newInfo.views = 0 + + mod.info = newInfo + + return mod + } + + return mod + }) this.setState({ installedList: installedMods, @@ -63,7 +77,9 @@ export class ModList extends React.Component { (this.state.installedList && this.props.mode === 'installed') ? (
{this.props.mode === 'installed' - ? this.state.installedList?.map((mod) => <>) + ? this.state.installedList?.map((mod) => ( + + )) : this.state.modList?.map((mod: ModData) => ( ))} diff --git a/src/ui/components/mods/ModTile.css b/src/ui/components/mods/ModTile.css index 7dede96..4dde789 100644 --- a/src/ui/components/mods/ModTile.css +++ b/src/ui/components/mods/ModTile.css @@ -36,6 +36,7 @@ padding: 0 0 0 10px; } +.ModTileOpen, .ModTileDownload { position: absolute; object-fit: contain; diff --git a/src/ui/components/mods/ModTile.tsx b/src/ui/components/mods/ModTile.tsx index 4ff27a9..db8c9a8 100644 --- a/src/ui/components/mods/ModTile.tsx +++ b/src/ui/components/mods/ModTile.tsx @@ -1,13 +1,16 @@ import React from 'react' -import { ModData } from '../../../utils/gamebanana' +import { ModData, PartialModData } from '../../../utils/gamebanana' import './ModTile.css' import Like from '../../../resources/icons/like.svg' import Eye from '../../../resources/icons/eye.svg' import Download from '../../../resources/icons/download.svg' +import Folder from '../../../resources/icons/folder.svg' +import { shell } from '@tauri-apps/api' interface IProps { - mod: ModData + mod: ModData | PartialModData + path?: string onClick: (mod: ModData) => void } @@ -24,6 +27,10 @@ export class ModTile extends React.Component { } } + async openInExplorer() { + if (this.props.path) shell.open(this.props.path) + } + render() { const { mod } = this.props @@ -32,13 +39,26 @@ export class ModTile extends React.Component { className="ModListItem" onMouseEnter={() => this.setState({ hover: true })} onMouseLeave={() => this.setState({ hover: false })} - onClick={() => this.props.onClick(mod)} + onClick={() => { + // Disable downloading installed mods + if (!('id' in mod)) return this.openInExplorer() + + this.props.onClick(mod) + }} > {mod.name} {mod.submitter.name}
- {this.state.hover && Download} - + {this.state.hover && + (!this.props.path ? ( + Download + ) : ( + Open + ))} +
diff --git a/src/utils/gamebanana.ts b/src/utils/gamebanana.ts index 3e23ecd..0cb94e8 100644 --- a/src/utils/gamebanana.ts +++ b/src/utils/gamebanana.ts @@ -78,6 +78,16 @@ export interface ModData { type: string } +export interface PartialModData { + name: string + images: string[] + submitter: { + name: string + } + likes: number + views: number +} + interface GamebananaDownloads { _bIsTrashed: boolean _bIsWithheld: boolean @@ -157,9 +167,11 @@ export async function getInstalledMods() { // These are returned as JSON strings, so we have to parse them return Object.keys(mods).map((path) => { + const info = JSON.parse(mods[path]) as ModData | PartialModData + return { path, - info: JSON.parse(mods[path]), + info, } }) }