feat: add compiler path configuration; reducing the font size of fold…

…er inputs (#56)

Add a new input folder in the configuration page to change the path of the papyrus compiler
Change the font-size of folder inputs (to see more characters)

Fixes #55

src/common/constants.ts

@@ -1,7 +1,7 @@
 import { is } from 'electron-util'
 
+export const GITHUB_LINK = 'http://github.com/Kiyozz/papyrus-compiler-app'
+export const GITHUB_ISSUES_NEW = `${GITHUB_LINK}/issues/new`
 export const DEFAULT_COMPILER_PATH = `Papyrus Compiler${
   is.linux || is.macos ? '/' : '\\'
 }PapyrusCompiler.exe`
-export const GITHUB_LINK = 'http://github.com/Kiyozz/papyrus-compiler-app'
-export const GITHUB_ISSUES_NEW = `${GITHUB_LINK}/issues/new`

src/common/storeCheck.ts

@@ -2,6 +2,8 @@ import { AppStore } from '@pca/common/store'
 import { Config } from '@pca/common/interfaces/Config'
 import is from '@sindresorhus/is'
 import { groupValidator } from './validators/groupValidator'
+import { join } from '../main/services/path'
+import { DEFAULT_COMPILER_PATH } from '@pca/common/constants'
 
 function checkMo2(appStore: AppStore, defaultConfig: Config) {
   const mo2 = appStore.get('mo2')
@@ -94,17 +96,15 @@ function checkOutput(appStore: AppStore, defaultConfig: Config) {
   }
 }
 
-function checkCompilerPath(appStore: AppStore, defaultConfig: Config) {
+function checkCompilerPath(appStore: AppStore) {
   const compilerPath = appStore.get('compilerPath')
   const gamePath = appStore.get('gamePath')
 
   if (
     is.nullOrUndefined(compilerPath) ||
     (is.string(compilerPath) && is.emptyString(compilerPath.trim()))
   ) {
-    if (is.emptyString(gamePath)) {
-      appStore.set('compilerPath', defaultConfig.compilerPath)
-    }
+    appStore.set('compilerPath', join(gamePath, DEFAULT_COMPILER_PATH))
   }
 }
 
@@ -123,7 +123,7 @@ export function storeCheck(appStore: AppStore, defaultConfig: Config) {
   checkGameType(appStore, defaultConfig)
   checkGamePath(appStore)
   checkFlag(appStore)
-  checkCompilerPath(appStore, defaultConfig)
+  checkCompilerPath(appStore)
   checkOutput(appStore, defaultConfig)
   checkGroups(appStore, defaultConfig)
   checkNotSupportedKeys(appStore, defaultConfig)

src/main/event-handlers/ConfigUpdateHandler.ts

@@ -3,10 +3,8 @@ import deepmerge from 'deepmerge'
 import { appStore } from '@pca/common/store'
 import { Config } from '@pca/common/interfaces/Config'
 import { PartialDeep } from '@pca/common/interfaces/PartialDeep'
-import * as CONSTANTS from '@pca/common/constants'
 import { EventHandler } from '../EventHandler'
 import { Logger } from '../Logger'
-import { join } from '../services/path'
 
 const logger = new Logger('ConfigUpdateHandler')
 
@@ -18,30 +16,24 @@ interface ConfigUpdateHandlerParams {
 export class ConfigUpdateHandler
   implements EventHandler<ConfigUpdateHandlerParams> {
   listen(args?: ConfigUpdateHandlerParams): Config {
-    logger.info('Updating the configuration')
+    logger.info('updating the configuration')
 
     if (is.undefined(args)) {
-      throw new TypeError('Cannot update the configuration without arguments')
+      throw new TypeError('cannot update the configuration without arguments')
     }
 
     ;(Object.entries(args.config) as [keyof Config, unknown][]).forEach(
       ([key, value]) => {
-        logger.debug('Updating key', key, 'with value', value)
+        logger.debug('updating key', key, 'with value', value)
 
         if (!appStore.has(key)) {
           return
         }
 
-        if (key === 'gamePath' && is.string(value)) {
-          appStore.set('gamePath', value)
-          appStore.set(
-            'compilerPath',
-            join(value, CONSTANTS.DEFAULT_COMPILER_PATH)
-          )
-        }
+        this.handleGamePath(key, value)
 
         if (args.override) {
-          logger.debug('Total overwrite of the previous value')
+          logger.debug('total overwrite of the previous value')
 
           appStore.set(key, value)
         } else {
@@ -64,4 +56,10 @@ export class ConfigUpdateHandler
 
     return appStore.store
   }
+
+  private handleGamePath(key: keyof Config, value: unknown) {
+    if (key === 'gamePath' && is.string(value)) {
+      appStore.set('gamePath', value)
+    }
+  }
 }

src/main/event-handlers/ScriptCompileHandler.ts

@@ -2,6 +2,8 @@ import is from '@sindresorhus/is'
 import { EventHandler } from '../EventHandler'
 import { compileScript } from '../services/compileScript'
 import { Logger } from '../Logger'
+import { storeCheck } from '@pca/common/storeCheck'
+import { appStore, defaultConfig } from '@pca/common/store'
 
 export class ScriptCompileHandler implements EventHandler<string> {
   private readonly log = new Logger('ScriptCompileHandler')
@@ -13,6 +15,8 @@ export class ScriptCompileHandler implements EventHandler<string> {
 
     this.log.info('Started compilation for script:', script)
 
+    storeCheck(appStore, defaultConfig)
+
     const result = await compileScript(script)
 
     this.log.info(`Script ${script} successfully compiled.`, result)

src/renderer/components/folder-text-field/folder-text-field.module.scss

@@ -1,5 +1,5 @@
-.textField {
-  display: flex;
+.textField input {
+  font-size: 0.8rem;
 }
 
 .icon {

src/renderer/components/folder-text-field/folder-text-field.tsx

@@ -2,6 +2,7 @@ import InputAdornment from '@material-ui/core/InputAdornment'
 import TextField from '@material-ui/core/TextField'
 import FolderIcon from '@material-ui/icons/Folder'
 import FolderOpenIcon from '@material-ui/icons/FolderOpen'
+import cx from 'classnames'
 
 import React, { useCallback, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
@@ -10,6 +11,7 @@ import apiFactory from '../../redux/api/api-factory'
 import classes from './folder-text-field.module.scss'
 
 export interface Props {
+  className?: string
   error?: boolean
   label?: string
   defaultValue: string
@@ -20,7 +22,8 @@ const FolderTextField: React.FC<Props> = ({
   error = false,
   label,
   defaultValue,
-  onChange
+  onChange,
+  className = ''
 }) => {
   const { t } = useTranslation()
   const [value, setValue] = useState(defaultValue)
@@ -66,7 +69,7 @@ const FolderTextField: React.FC<Props> = ({
     <TextField
       error={error}
       fullWidth
-      className={classes.textField}
+      className={cx(classes.textField, { [className]: !!className })}
       value={value}
       onChange={onChangeInput}
       label={label}

src/renderer/pages/settings-page/settings-game.tsx

@@ -19,17 +19,19 @@ import classes from './settings-page.module.scss'
 interface Props {
   onClickRadio: (e: React.ChangeEvent<HTMLInputElement>) => void
   onChangeGameFolder: (value: string) => void
+  onChangeCompilerPath: (value: string) => void
   onClickRefreshInstallation: (e: React.MouseEvent<HTMLButtonElement>) => void
 }
 
-const SettingsGame: React.FC<Props> = ({
+export function SettingsGame({
   onChangeGameFolder,
   onClickRadio,
+  onChangeCompilerPath,
   onClickRefreshInstallation
-}) => {
+}: Props) {
   const { t } = useTranslation()
   const {
-    config: { gameType, gamePath }
+    config: { gameType, gamePath, compilerPath }
   } = usePageContext()
   const { installationIsBad } = useSettings()
   const exe = getExecutable(gameType)
@@ -81,8 +83,13 @@ const SettingsGame: React.FC<Props> = ({
           </Typography>
         </Alert>
       </Collapse>
+
+      <FolderTextField
+        label={t('page.settings.compilerPath')}
+        defaultValue={compilerPath}
+        onChange={onChangeCompilerPath}
+        className={classes.gap}
+      />
     </Paper>
   )
 }
-
-export default SettingsGame

src/renderer/pages/settings-page/settings-page.module.scss

@@ -22,3 +22,7 @@
 .listHeaderRightText {
   margin-left: auto;
 }
+
+div.gap {
+  margin-top: 10px;
+}

src/renderer/pages/settings-page/settings-page.tsx

@@ -9,7 +9,7 @@ import { usePageContext } from '../../components/page/page-context'
 import actions from '../../redux/actions'
 import { useAction, useStoreSelector } from '../../redux/use-store-selector'
 import SettingsContextProvider from './settings-context'
-import SettingsGame from './settings-game'
+import { SettingsGame } from './settings-game'
 import SettingsMo2 from './settings-mo2'
 import classes from './settings-page.module.scss'
 import { debounce } from 'lodash-es'
@@ -35,25 +35,28 @@ const SettingsPage: React.FC = () => {
     actions.settingsPage.detectBadInstallation.start
   )
   const setGame = useCallback(
-    (game: GameType) => debouncedUpdateConfig({ gameType: game }),
-    [debouncedUpdateConfig]
+    (game: GameType) => updateConfig({ gameType: game }),
+    [updateConfig]
   )
   const setGameFolder = useCallback(
     (path: string) => debouncedUpdateConfig({ gamePath: path }),
     [debouncedUpdateConfig]
   )
-  const setMo2 = useCallback(
-    (useMo2Updated: boolean) =>
-      debouncedUpdateConfig({ mo2: { use: useMo2Updated } }),
+  const setCompilerPath = useCallback(
+    (path: string) => debouncedUpdateConfig({ compilerPath: path }),
     [debouncedUpdateConfig]
   )
+  const setMo2 = useCallback(
+    (useMo2Updated: boolean) => updateConfig({ mo2: { use: useMo2Updated } }),
+    [updateConfig]
+  )
   const setMo2Instance = useCallback(
     (instance?: string) => debouncedUpdateConfig({ mo2: { instance } }),
     [debouncedUpdateConfig]
   )
   const setDisableMo2 = useCallback(
-    () => debouncedUpdateConfig({ mo2: { use: false, instance: undefined } }),
-    [debouncedUpdateConfig]
+    () => updateConfig({ mo2: { use: false, instance: undefined } }),
+    [updateConfig]
   )
   const setEmptyDetectedSourcesFolders = useAction(
     actions.settingsPage.mo2.detectSources.empty
@@ -103,6 +106,13 @@ const SettingsPage: React.FC = () => {
     [setGameFolder]
   )
 
+  const onChangeCompilerPath = useCallback(
+    (value: string) => {
+      setCompilerPath(value)
+    },
+    [setCompilerPath]
+  )
+
   const onChangeMo2Instance = useCallback(
     (value: string) => {
       if (value === '') {
@@ -176,6 +186,7 @@ const SettingsPage: React.FC = () => {
             onClickRadio={onClickRadio}
             onChangeGameFolder={onChangeGameFolder}
             onClickRefreshInstallation={onClickRefreshInstallation}
+            onChangeCompilerPath={onChangeCompilerPath}
           />
 
           <SettingsMo2

src/renderer/translations/en.ts

@@ -48,6 +48,7 @@ export default {
       },
       game: 'Game',
       gameFolderInfo: '{{gameType}} folder (where {{exe}} is located)',
+      compilerPath: 'Where is the PapyrusCompiler.exe file located?',
       errors: {
         installationInvalid: 'Installation seems invalid:',
         installationInvalidInfo:

src/renderer/translations/fr.ts

@@ -49,6 +49,7 @@ export default {
       },
       game: 'Jeu',
       gameFolderInfo: 'Dossier de {{gameType}} (où {{exe}} se trouve)',
+      compilerPath: 'Où se trouve le fichier PapyrusCompiler.exe ?',
       errors: {
         installationInvalid: 'Le dossier semble invalide :',
         installationInvalidInfo: