Add support for wiki links in known fixes

Author: arielj

public/locales/en/gamepage.json

@@ -284,5 +284,6 @@
         "header": "This game is managed by a third-party application",
         "notice1": "This game is managed by a third-party application: \"{{application_name}}\"",
         "notice2": "After clicking Install, Heroic will run the application in order to complete the installation process"
-    }
+    },
+    "wikiLink": "Important information about this game, read this:&nbsp;<1>Open page</1>"
 }

src/backend/api/misc.ts

@@ -115,6 +115,8 @@ export const callTool = async (toolArgs: Tools) =>
   ipcRenderer.invoke('callTool', toolArgs)
 export const getAnticheatInfo = async (namespace: string) =>
   ipcRenderer.invoke('getAnticheatInfo', namespace)
+export const getKnownFixes = async (appName: string, runner: Runner) =>
+  ipcRenderer.invoke('getKnownFixes', appName, runner)
 
 export const clipboardReadText = async () =>
   ipcRenderer.invoke('clipboardReadText')

src/backend/downloadmanager/utils.ts

@@ -9,7 +9,7 @@ import { DMStatus, InstallParams, Runner } from 'common/types'
 import i18next from 'i18next'
 import { notify, showDialogBoxModalAuto } from '../dialog/dialog'
 import { isOnline } from '../online_monitor'
-import { fixesPath, isWindows } from 'backend/constants'
+import { fixesPath } from 'backend/constants'
 import path from 'path'
 import { existsSync, mkdirSync } from 'graceful-fs'
 import { storeMap } from 'common/utils'
@@ -74,9 +74,7 @@ async function installQueueElement(params: InstallParams): Promise<{
   }
 
   try {
-    if (!isWindows) {
-      downloadFixesFor(appName, runner)
-    }
+    downloadFixesFor(appName, runner)
 
     const { status, error } = await gameManagerMap[runner].install(appName, {
       path: path.replaceAll("'", ''),

src/backend/launcher.ts

@@ -684,7 +684,7 @@ async function prepareWineLaunch(
   return { success: true, envVars: envVars }
 }
 
-function readKnownFixes(appName: string, runner: Runner) {
+export function readKnownFixes(appName: string, runner: Runner) {
   const fixPath = join(fixesPath, `${appName}-${storeMap[runner]}.json`)
 
   if (!existsSync(fixPath)) return null

src/backend/main.ts

@@ -103,7 +103,7 @@ import {
 } from './logger/logger'
 import { gameInfoStore } from 'backend/storeManagers/legendary/electronStores'
 import { getFonts } from 'font-list'
-import { launchEventCallback, runWineCommand } from './launcher'
+import { launchEventCallback, readKnownFixes, runWineCommand } from './launcher'
 import shlex from 'shlex'
 import { initQueue } from './downloadmanager/downloadqueue'
 import {
@@ -1498,6 +1498,10 @@ ipcMain.on('changeGameVersionPinnedStatus', (e, appName, runner, status) => {
   libraryManagerMap[runner].changeVersionPinnedStatus(appName, status)
 })
 
+ipcMain.handle('getKnownFixes', (e, appName, runner) =>
+  readKnownFixes(appName, runner)
+)
+
 /*
   Other Keys that should go into translation files:
   t('box.error.generic.title')

src/common/typedefs/ipcBridge.d.ts

@@ -34,7 +34,8 @@ import {
   InstallInfo,
   WikiInfo,
   UploadedLogData,
-  RunnerCommandStub
+  RunnerCommandStub,
+  KnowFixesInfo
 } from 'common/types'
 import { GameOverride, SelectiveDownload } from 'common/types/legendary'
 import { GOGCloudSavesLocation } from 'common/types/gog'
@@ -251,6 +252,7 @@ interface AsyncIPCFunctions {
   removeFromSteam: (appName: string, runner: Runner) => Promise<void>
   isAddedToSteam: (appName: string, runner: Runner) => Promise<boolean>
   getAnticheatInfo: (appNamespace: string) => AntiCheatInfo | null
+  getKnownFixes: (appName: string, runner: Runner) => KnowFixesInfo | null
   getEosOverlayStatus: () => {
     isInstalled: boolean
     version?: string

src/common/types.ts

@@ -768,6 +768,7 @@ export interface KnowFixesInfo {
   winetricks?: string[]
   runInPrefix?: string[]
   envVariables?: Record<string, string>
+  wikiLink?: string
 }
 
 export interface UploadedLogData {

src/frontend/hooks/hasKnownFixes.ts

@@ -0,0 +1,17 @@
+import { useEffect, useState } from 'react'
+import { KnowFixesInfo, Runner } from 'common/types'
+
+export const hasKnownFixes = (appName: string, runner: Runner) => {
+  const [knownFixes, setKnownFixes] = useState<KnowFixesInfo | null>(null)
+
+  useEffect(() => {
+    window.api
+      .getKnownFixes(appName, runner)
+      .then((info: KnowFixesInfo | null) => {
+        console.log({ info })
+        setKnownFixes(info)
+      })
+  }, [appName])
+
+  return knownFixes
+}

src/frontend/screens/Game/GamePage/index.scss

@@ -916,3 +916,20 @@
   left: 0;
   right: unset;
 }
+
+.gameConfigContainer {
+  .wikiLink {
+    background: var(--status-warning);
+    color: black;
+    padding: 0.5rem 1rem;
+    display: flex;
+    align-items: center;
+    & svg {
+      margin-inline-end: 0.5rem;
+    }
+    & a {
+      color: black;
+      text-decoration: underline;
+    }
+  }
+}

src/frontend/screens/Game/GamePage/index.tsx

@@ -20,8 +20,8 @@ import {
   sendKill,
   updateGame
 } from 'frontend/helpers'
-import { NavLink, useLocation, useParams } from 'react-router-dom'
-import { useTranslation } from 'react-i18next'
+import { Link, NavLink, useLocation, useParams } from 'react-router-dom'
+import { Trans, useTranslation } from 'react-i18next'
 import ContextProvider from 'frontend/state/ContextProvider'
 import { CachedImage, UpdateComponent, TabPanel } from 'frontend/components/UI'
 import UninstallModal from 'frontend/components/UI/UninstallModal'
@@ -71,13 +71,14 @@ import { hasAnticheatInfo } from 'frontend/hooks/hasAnticheatInfo'
 import { hasHelp } from 'frontend/hooks/hasHelp'
 import Genres from './components/Genres'
 import ReleaseDate from './components/ReleaseDate'
+import { hasKnownFixes } from 'frontend/hooks/hasKnownFixes'
 
 export default React.memo(function GamePage(): JSX.Element | null {
   const { appName, runner } = useParams() as { appName: string; runner: Runner }
   const location = useLocation() as {
     state: { fromDM: boolean; gameInfo: GameInfo }
   }
-  const { t } = useTranslation('gamepage')
+  const { t, i18n } = useTranslation('gamepage')
   const { t: t2 } = useTranslation()
 
   const { gameInfo: locationGameInfo } = location.state
@@ -133,6 +134,8 @@ export default React.memo(function GamePage(): JSX.Element | null {
 
   const anticheatInfo = hasAnticheatInfo(gameInfo)
 
+  const knownFixes = hasKnownFixes(appName, runner)
+
   const isWin = platform === 'win32'
   const isLinux = platform === 'linux'
   const isMac = platform === 'darwin'
@@ -347,6 +350,21 @@ export default React.memo(function GamePage(): JSX.Element | null {
 
     const hasRequirements = extraInfo ? extraInfo.reqs.length > 0 : false
 
+    let wikiLink = <></>
+    if (knownFixes && knownFixes.wikiLink) {
+      wikiLink = (
+        <p className="wikiLink">
+          <Info />
+          <span>
+            <Trans key="wikiLink" i18n={i18n}>
+              Important information about this game, read this:&nbsp;
+              <Link to={knownFixes.wikiLink}>Open page</Link>
+            </Trans>
+          </span>
+        </p>
+      )
+    }
+
     return (
       <div className="gameConfigContainer">
         {!!(art_background ?? art_cover) &&
@@ -439,6 +457,7 @@ export default React.memo(function GamePage(): JSX.Element | null {
                   />
 
                   <Anticheat anticheatInfo={anticheatInfo} />
+                  {wikiLink}
                   <MainButton
                     gameInfo={gameInfo}
                     handlePlay={handlePlay}
@@ -499,6 +518,7 @@ export default React.memo(function GamePage(): JSX.Element | null {
                       gameInfo={gameInfo}
                       setLaunchArguments={setLaunchArguments}
                     />
+                    {wikiLink}
                     <div className="buttons">
                       <MainButton
                         gameInfo={gameInfo}