settings

apps/remix-ide/src/app/plugins/parser/services/code-parser-compiler.ts

@@ -39,7 +39,8 @@ export default class CodeParserCompiler {
 
                     allErrors.push({ error, lineColumn })
                 }
-                await this.plugin.call('editor', 'addErrorMarker', allErrors)
+                const displayErrors = await this.plugin.call('config', 'getAppParameter', 'display-errors')
+                if(displayErrors) await this.plugin.call('editor', 'addErrorMarker', allErrors)
                 this.addDecorators(allErrors, sources)
             } else {
                 await this.plugin.call('editor', 'clearErrorMarkers', result.getSourceCode().sources)
@@ -115,6 +116,8 @@ export default class CodeParserCompiler {
     }
 
     async addDecorators(allErrors: any[], sources: any) {
+        const displayErrors = await this.plugin.call('config', 'getAppParameter', 'display-errors')
+        if(!displayErrors) return
         const errorsPerFiles = {}
         for (const error of allErrors) {
             if (!errorsPerFiles[error.error.sourceLocation.file]) {

apps/remix-ide/src/app/plugins/parser/services/code-parser-gas-service.ts

@@ -34,6 +34,11 @@ export default class CodeParserGasService {
 
 
     async showGasEstimates() {
+        const showGasConfig = await this.plugin.call('config', 'getAppParameter', 'show-gas')
+        if(!showGasConfig) {
+            await this.plugin.call('editor', 'discardLineTexts')
+            return
+        }
         this.plugin.currentFile = await this.plugin.call('fileManager', 'file')
         this.plugin.nodeIndex.nodesPerFile[this.plugin.currentFile] = await this.plugin._extractFileNodes(this.plugin.currentFile, this.plugin.compilerAbstract)
 

libs/remix-ui/editor/src/lib/actions/editor.ts

@@ -28,7 +28,6 @@ export const reducerActions = (models = initialState, action: Action) => {
 
       }
       models[uri].model = model
-      console.log('ADD_MODEL', models[uri].model)
       model.onDidChangeContent(() => action.payload.events.onDidChangeContent(uri))
       return models
     }

libs/remix-ui/editor/src/lib/providers/completionProvider.ts

@@ -19,6 +19,8 @@ export class RemixCompletionProvider implements languages.CompletionItemProvider
     triggerCharacters = ['.', '']
     async provideCompletionItems(model: editor.ITextModel, position: Position, context: monaco.languages.CompletionContext): Promise<monaco.languages.CompletionList | undefined> {
 
+        const completionSettings = await this.props.plugin.call('config', 'getAppParameter', 'settings/auto-completion')
+        if(!completionSettings) return
         const word = model.getWordUntilPosition(position);
         const range = {
             startLineNumber: position.lineNumber,

libs/remix-ui/settings/src/lib/constants.ts

@@ -15,6 +15,8 @@ export const ethereunVMText = 'Always use Remix VM at load'
 export const wordWrapText = 'Word wrap in editor'
 export const enablePersonalModeText = ' Enable Personal Mode for Remix Provider. Transaction sent over Web3 will use the web3.personal API.\n'
 export const useAutoCompleteText = 'Enable code completion in editor.'
+export const useShowGasInEditorText = 'Display gas estimates in editor.'
+export const displayErrorsText = 'Display errors in editor while typing.'
 export const matomoAnalytics = 'Enable Matomo Analytics. We do not collect personally identifiable information (PII). The info is used to improve the site’s UX & UI. See more about '
 export const swarmSettingsTitle = 'Swarm Settings'
 export const swarmSettingsText = 'Swarm Settings'

libs/remix-ui/settings/src/lib/remix-ui-settings.tsx

@@ -1,10 +1,10 @@
 import React, { useState, useReducer, useEffect, useCallback } from 'react' // eslint-disable-line
 import { CopyToClipboard } from '@remix-ui/clipboard' // eslint-disable-line
 
-import { enablePersonalModeText, ethereunVMText, labels, generateContractMetadataText, matomoAnalytics, textDark, textSecondary, warnText, wordWrapText, swarmSettingsTitle, ipfsSettingsText, useAutoCompleteText } from './constants'
+import { enablePersonalModeText, ethereunVMText, labels, generateContractMetadataText, matomoAnalytics, textDark, textSecondary, warnText, wordWrapText, swarmSettingsTitle, ipfsSettingsText, useAutoCompleteText, useShowGasInEditorText, displayErrorsText } from './constants'
 
 import './remix-ui-settings.css'
-import { ethereumVM, generateContractMetadat, personal, textWrapEventAction, useMatomoAnalytics, saveTokenToast, removeTokenToast, saveSwarmSettingsToast, saveIpfsSettingsToast, useAutoCompletion } from './settingsAction'
+import { ethereumVM, generateContractMetadat, personal, textWrapEventAction, useMatomoAnalytics, saveTokenToast, removeTokenToast, saveSwarmSettingsToast, saveIpfsSettingsToast, useAutoCompletion, useShowGasInEditor, useDisplayErrors } from './settingsAction'
 import { initialState, toastInitialState, toastReducer, settingReducer } from './settingsReducer'
 import { Toaster } from '@remix-ui/toaster'// eslint-disable-line
 import { RemixUiThemeModule, ThemeModule} from '@remix-ui/theme-module'
@@ -42,6 +42,12 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
 
     const useAutoComplete = props.config.get('settings/use-auto-complete')
     if (useAutoComplete === null || useAutoComplete === undefined) useAutoCompletion(props.config, true, dispatch)
+
+    const displayErrors = props.config.get('settings/display-errors')
+    if (displayErrors === null || displayErrors === undefined) useDisplayErrors(props.config, true, dispatch)
+  
+    const useShowGas = props.config.get('settings/show-gas')
+    if (useShowGas === null || useShowGas === undefined) useShowGasInEditor(props.config, true, dispatch)
   }
   useEffect(() => initValue(), [resetState, props.config])
   useEffect(() => initValue(), [])
@@ -120,6 +126,14 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
     useAutoCompletion(props.config, event.target.checked, dispatch)
   }
 
+  const onchangeShowGasInEditor = event => {
+    useShowGasInEditor(props.config, event.target.checked, dispatch)
+  }
+  const onchangeDisplayErrors = event => {
+    useDisplayErrors(props.config, event.target.checked, dispatch)
+  }
+
+
   const getTextClass = (key) => {
     if (props.config.get(key)) {
       return textDark
@@ -135,7 +149,8 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
     const isPersonalChecked = props.config.get('settings/personal-mode') || false
     const isMatomoChecked = props.config.get('settings/matomo-analytics') || false
     const isAutoCompleteChecked = props.config.get('settings/auto-completion') === null ? true:props.config.get('settings/auto-completion')
-
+    const isShowGasInEditorChecked = props.config.get('settings/show-gas') === null ? true:props.config.get('settings/show-gas')
+    const displayErrorsChecked = props.config.get('settings/display-errors') === null ? true:props.config.get('settings/display-errors')
     return (
       <div className="$border-top">
         <div title="Reset to Default settings." className='d-flex justify-content-end pr-4'>
@@ -177,6 +192,18 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
               <span>{useAutoCompleteText}</span>
             </label>
           </div>
+          <div className='custom-control custom-checkbox mb-1'>
+            <input onChange={onchangeShowGasInEditor} id="settingsUseShowGas" type="checkbox" className="custom-control-input" checked={isShowGasInEditorChecked} />
+            <label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/use-auto-complete')}`} htmlFor="settingsUseShowGas">
+              <span>{useShowGasInEditorText}</span>
+            </label>
+          </div>
+          <div className='custom-control custom-checkbox mb-1'>
+            <input onChange={onchangeDisplayErrors} id="settingsDisplayErrors" type="checkbox" className="custom-control-input" checked={displayErrorsChecked} />
+            <label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/use-auto-complete')}`} htmlFor="settingsDisplayErrors">
+              <span>{displayErrorsText}</span>
+            </label>
+          </div>
           <div className="custom-control custom-checkbox mb-1">
             <input onChange={onchangePersonal} id="personal" type="checkbox" className="custom-control-input" checked={isPersonalChecked} />
             <label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/personal-mode')}`} htmlFor="personal">

libs/remix-ui/settings/src/lib/settingsAction.ts

@@ -46,6 +46,16 @@ export const useAutoCompletion = (config, checked, dispatch) => {
   dispatch({ type: 'useAutoCompletion', payload: { isChecked: checked, textClass: checked ? textDark : textSecondary } })
 }
 
+export const useShowGasInEditor = (config, checked, dispatch) => {
+  config.set('settings/show-gas', checked)
+  dispatch({ type: 'useShowGasInEditor', payload: { isChecked: checked, textClass: checked ? textDark : textSecondary } })
+}
+
+export const useDisplayErrors = (config, checked, dispatch) => {
+  config.set('settings/display-errors', checked)
+  dispatch({ type: 'displayErrors', payload: { isChecked: checked, textClass: checked ? textDark : textSecondary } })
+}
+
 export const saveTokenToast = (config, dispatch, tokenValue, key) => {
   config.set('settings/' + key, tokenValue)
   dispatch({ type: 'save', payload: { message: 'GitHub credentials updated' } })

libs/remix-ui/settings/src/lib/settingsReducer.ts

@@ -31,6 +31,16 @@ export const initialState = {
       name: 'useAutoCompletion',
       isChecked: true,
       textClass: textSecondary
+    },
+    {
+      name: 'useShowGasInEditor',
+      isChecked: true,
+      textClass: textSecondary
+    },
+    {
+      name: 'displayErrors',
+      isChecked: true,
+      textClass: textSecondary
     }
   ]
 }
@@ -87,6 +97,7 @@ export const settingReducer = (state, action) => {
       return {
         ...state
       }
+    
     case 'useAutoCompletion':
       state.elementState.map(element => {
         if (element.name === 'useAutoCompletion') {
@@ -97,9 +108,30 @@ export const settingReducer = (state, action) => {
       return {
         ...state
       }
+      case 'displayErrors':
+        state.elementState.map(element => {
+          if (element.name === 'displayErrors') {
+            element.isChecked = action.payload.isChecked
+            element.textClass = action.payload.textClass
+          }
+        })
+        return {
+          ...state
+        }
+    case 'useShowGasInEditor':
+      state.elementState.map(element => {
+        if (element.name === 'useShowGasInEditor') {
+          element.isChecked = action.payload.isChecked
+          element.textClass = action.payload.textClass
+        }
+      })
+      return {
+        ...state
+      }
     default:
       return initialState
   }
+  
 }
 
 export const toastInitialState = {