From 64cce1ec154801e95bf71ffcd6e49afc3c7dfdf8 Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Tue, 29 Aug 2023 14:01:06 +0200
Subject: [PATCH 01/22] checkboxes styles for SUT

---
 .../src/lib/solidity-unit-testing.tsx         |  87 ++++++-----
 .../terminal/src/lib/remix-ui-terminal.tsx    | 141 +++++++++---------
 2 files changed, 119 insertions(+), 109 deletions(-)

diff --git a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
index 6129df0a91..c90bcf4bd6 100644
--- a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
+++ b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
@@ -1,14 +1,14 @@
-import React, {useState, useRef, useEffect, ReactElement} from 'react' // eslint-disable-line
-import {FormattedMessage, useIntl} from 'react-intl'
+import React, { useState, useRef, useEffect, ReactElement } from 'react' // eslint-disable-line
+import { FormattedMessage, useIntl } from 'react-intl'
 import * as semver from 'semver'
-import {eachOfSeries} from 'async' // eslint-disable-line
+import { eachOfSeries } from 'async' // eslint-disable-line
 import type Web3 from 'web3'
-import {canUseWorker, urlFromVersion} from '@remix-project/remix-solidity'
-import {Renderer} from '@remix-ui/renderer' // eslint-disable-line
-import {Toaster} from '@remix-ui/toaster' // eslint-disable-line
-import {format} from 'util'
+import { canUseWorker, urlFromVersion } from '@remix-project/remix-solidity'
+import { Renderer } from '@remix-ui/renderer' // eslint-disable-line
+import { Toaster } from '@remix-ui/toaster' // eslint-disable-line
+import { format } from 'util'
 import './css/style.css'
-import {CustomTooltip} from '@remix-ui/helper'
+import { CustomTooltip } from '@remix-ui/helper'
 
 const _paq = ((window as any)._paq = (window as any)._paq || []) // eslint-disable-line @typescript-eslint/no-explicit-any
 
@@ -44,8 +44,8 @@ interface FinalResult {
 export const SolidityUnitTesting = (props: Record<string, any>) => {
   // eslint-disable-line @typescript-eslint/no-explicit-any
 
-  const {helper, testTab, initialPath} = props
-  const {testTabLogic} = testTab
+  const { helper, testTab, initialPath } = props
+  const { testTabLogic } = testTab
 
   const intl = useIntl()
 
@@ -55,8 +55,8 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
   const [disableGenerateButton, setDisableGenerateButton] = useState<boolean>(false)
   const [disableStopButton, setDisableStopButton] = useState<boolean>(true)
   const [disableRunButton, setDisableRunButton] = useState<boolean>(false)
-  const [runButtonTitle, setRunButtonTitle] = useState<string>(intl.formatMessage({id: 'solidityUnitTesting.runButtonTitle1'}))
-  const [stopButtonLabel, setStopButtonLabel] = useState<string>(intl.formatMessage({id: 'solidityUnitTesting.stopButtonLabel1'}))
+  const [runButtonTitle, setRunButtonTitle] = useState<string>(intl.formatMessage({ id: 'solidityUnitTesting.runButtonTitle1' }))
+  const [stopButtonLabel, setStopButtonLabel] = useState<string>(intl.formatMessage({ id: 'solidityUnitTesting.stopButtonLabel1' }))
 
   const [checkSelectAll, setCheckSelectAll] = useState<boolean>(true)
   const [testsOutput, setTestsOutput] = useState<ReactElement[]>([])
@@ -179,11 +179,11 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
       await updateForNewCurrent(file)
     })
     testTab.on('solidity', 'compilerLoaded', async (version: string, license: string) => {
-      const {currentVersion} = testTab.compileTab.getCurrentCompilerConfig()
+      const { currentVersion } = testTab.compileTab.getCurrentCompilerConfig()
 
       if (!semver.gt(truncateVersion(currentVersion), '0.4.12')) {
         setDisableRunButton(true)
-        setRunButtonTitle(intl.formatMessage({id: 'solidityUnitTesting.runButtonTitle2'}))
+        setRunButtonTitle(intl.formatMessage({ id: 'solidityUnitTesting.runButtonTitle2' }))
       }
     })
   }, []) // eslint-disable-line
@@ -272,7 +272,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
       finalLogs = finalLogs + '&emsp;' + formattedLog + '\n'
     }
     _paq.push(['trackEvent', 'solidityUnitTesting', 'hardhat', 'console.log'])
-    testTab.call('terminal', 'logHtml', {type: 'log', value: finalLogs})
+    testTab.call('terminal', 'logHtml', { type: 'log', value: finalLogs })
   }
 
   const discardHighlight = async () => {
@@ -285,11 +285,11 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
       const file = split[2]
       const parsedLocation = {
         start: parseInt(split[0]),
-        length: parseInt(split[1])
+        length: parseInt(split[1]),
       }
       const locationToHighlight = testTab.offsetToLineColumnConverter.offsetToLineColumnWithContent(parsedLocation, parseInt(file), filesContent[fileName].content)
       await testTab.call('editor', 'discardHighlight')
-      await testTab.call('editor', 'highlight', locationToHighlight, fileName, '', {focus: true})
+      await testTab.call('editor', 'highlight', locationToHighlight, fileName, '', { focus: true })
     }
   }
 
@@ -346,9 +346,9 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
       if (!test.rendered) {
         let debugBtn
         if (test.debugTxHash) {
-          const {web3, debugTxHash} = test
+          const { web3, debugTxHash } = test
           debugBtn = (
-            <div id={test.value.replaceAll(' ', '_')} className="btn border btn btn-sm ml-1" style={{cursor: 'pointer'}} onClick={() => startDebug(debugTxHash, web3)}>
+            <div id={test.value.replaceAll(' ', '_')} className="btn border btn btn-sm ml-1" style={{ cursor: 'pointer' }} onClick={() => startDebug(debugTxHash, web3)}>
               <CustomTooltip placement={'top-start'} tooltipClasses="text-nowrap" tooltipId="info-recorder" tooltipText="Start debugging">
                 <i className="fas fa-bug"></i>
               </CustomTooltip>
@@ -465,17 +465,17 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
           if (errors && errors.errors) {
             errors.errors.forEach((err: any) => {
               // eslint-disable-line @typescript-eslint/no-explicit-any
-              const errorCard: ReactElement = <Renderer message={err.formattedMessage || err.message} plugin={testTab} opt={{type: err.severity, errorType: err.type}} />
+              const errorCard: ReactElement = <Renderer message={err.formattedMessage || err.message} plugin={testTab} opt={{ type: err.severity, errorType: err.type }} />
               setTestsOutput((prevCards) => [...prevCards, errorCard])
             })
           } else if (errors && Array.isArray(errors) && (errors[0].message || errors[0].formattedMessage)) {
             errors.forEach((err) => {
-              const errorCard: ReactElement = <Renderer message={err.formattedMessage || err.message} plugin={testTab} opt={{type: err.severity, errorType: err.type}} />
+              const errorCard: ReactElement = <Renderer message={err.formattedMessage || err.message} plugin={testTab} opt={{ type: err.severity, errorType: err.type }} />
               setTestsOutput((prevCards) => [...prevCards, errorCard])
             })
           } else if (errors && !errors.errors && !Array.isArray(errors)) {
             // To track error like this: https://github.com/ethereum/remix/pull/1438
-            const errorCard: ReactElement = <Renderer message={errors.formattedMessage || errors.message} plugin={testTab} opt={{type: 'error'}} />
+            const errorCard: ReactElement = <Renderer message={errors.formattedMessage || errors.message} plugin={testTab} opt={{ type: 'error' }} />
             setTestsOutput((prevCards) => [...prevCards, errorCard])
           }
         }
@@ -549,7 +549,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
         passed: result.totalPassing,
         failed: result.totalFailing,
         timeTaken: totalTime,
-        rendered: false
+        rendered: false,
       }
       testsResultByFilename[filename]['summary'] = testsSummary
       showTestsResult()
@@ -569,7 +569,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
     if (_errors || hasBeenStopped.current || readyTestsNumber === runningTestsNumber) {
       // All tests are ready or the operation has been canceled or there was a compilation error in one of the test files.
       setDisableStopButton(true)
-      setStopButtonLabel(intl.formatMessage({id: 'solidityUnitTesting.stopButtonLabel1'}))
+      setStopButtonLabel(intl.formatMessage({ id: 'solidityUnitTesting.stopButtonLabel1' }))
       if (selectedTests.current?.length !== 0) {
         setDisableRunButton(false)
       }
@@ -588,16 +588,16 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
       .readFile(testFilePath)
       .then(async (content: string) => {
         const runningTests: Record<string, Record<string, string>> = {}
-        runningTests[testFilePath] = {content}
-        filesContent[testFilePath] = {content}
-        const {currentVersion, evmVersion, optimize, runs, isUrl} = testTab.compileTab.getCurrentCompilerConfig()
+        runningTests[testFilePath] = { content }
+        filesContent[testFilePath] = { content }
+        const { currentVersion, evmVersion, optimize, runs, isUrl } = testTab.compileTab.getCurrentCompilerConfig()
         const currentCompilerUrl = isUrl ? currentVersion : urlFromVersion(currentVersion)
         const compilerConfig = {
           currentCompilerUrl,
           evmVersion,
           optimize,
           usingWorker: canUseWorker(currentVersion),
-          runs
+          runs,
         }
         const deployCb = async (file: string, contractAddress: string) => {
           const compilerData = await testTab.call('compilerArtefacts', 'getCompilerAbstract', file)
@@ -624,7 +624,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
               .then((result: any) => cb(null, result))
               .catch((error: Error) => cb(error.message)) // eslint-disable-line @typescript-eslint/no-explicit-any
           },
-          {testFilePath: testFilePath}
+          { testFilePath: testFilePath }
         )
       })
       .catch((error: Error) => {
@@ -660,16 +660,16 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
     if (!isSolidityActive || !selectedTests.current.length) {
       setDisableRunButton(true)
       if (!currentFile || (currentFile && currentFile.split('.').pop().toLowerCase() !== 'sol')) {
-        setRunButtonTitle(intl.formatMessage({id: 'solidityUnitTesting.runButtonTitle3'}))
+        setRunButtonTitle(intl.formatMessage({ id: 'solidityUnitTesting.runButtonTitle3' }))
       } else {
-        setRunButtonTitle(intl.formatMessage({id: 'solidityUnitTesting.runButtonTitle4'}))
+        setRunButtonTitle(intl.formatMessage({ id: 'solidityUnitTesting.runButtonTitle4' }))
       }
     } else setDisableRunButton(false)
   }
 
   const stopTests = () => {
     hasBeenStopped.current = true
-    setStopButtonLabel(intl.formatMessage({id: 'solidityUnitTesting.stopButtonLabel2'}))
+    setStopButtonLabel(intl.formatMessage({ id: 'solidityUnitTesting.stopButtonLabel2' }))
     setDisableStopButton(true)
     setDisableRunButton(true)
   }
@@ -687,12 +687,12 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
       setCheckSelectAll(true)
       setDisableRunButton(false)
       if ((readyTestsNumber === runningTestsNumber || hasBeenStopped.current) && stopButtonLabel.trim() === 'Stop') {
-        setRunButtonTitle(intl.formatMessage({id: 'solidityUnitTesting.runButtonTitle1'}))
+        setRunButtonTitle(intl.formatMessage({ id: 'solidityUnitTesting.runButtonTitle1' }))
       }
     } else if (!selectedTests.current.length) {
       setCheckSelectAll(false)
       setDisableRunButton(true)
-      setRunButtonTitle(intl.formatMessage({id: 'solidityUnitTesting.runButtonTitle5'}))
+      setRunButtonTitle(intl.formatMessage({ id: 'solidityUnitTesting.runButtonTitle5' }))
     } else setCheckSelectAll(false)
   }
 
@@ -713,7 +713,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
   const updateTestFileList = () => {
     if (allTests.current?.length) {
       testFiles = allTests.current.map((testFile: string) => {
-        return {fileName: testFile, checked: true}
+        return { fileName: testFile, checked: true }
       })
       setCheckSelectAll(true)
     } else testFiles = []
@@ -755,7 +755,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
                 data-id="uiPathInput"
                 name="utPath"
                 value={inputPathValue}
-                style={{backgroundImage: 'var(--primary)'}}
+                style={{ backgroundImage: 'var(--primary)' }}
                 onKeyDown={() => {
                   if (inputPathValue === '/') setInputPathValue('')
                 }}
@@ -841,13 +841,14 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
         <div className="d-flex align-items-center mx-3 pb-2 mt-2 border-bottom">
           <input
             id="checkAllTests"
+            className="custom-control-input"
             type="checkbox"
             data-id="testTabCheckAllTests"
             onClick={checkAll}
             checked={checkSelectAll}
             onChange={() => {}} // eslint-disable-line
           />
-          <label className="text-nowrap pl-2 mb-0" htmlFor="checkAllTests">
+          <label htmlFor="checkAllTests" className="form-check-label mb-0 ml-4 custom-control-label text-nowrap" style={{ paddingTop: '0.125rem' }}>
             {' '}
             <FormattedMessage id="solidityUnitTesting.selectAll" />{' '}
           </label>
@@ -857,16 +858,20 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
             ? testFiles.map((testFileObj: TestObject, index) => {
               const elemId = `singleTest${testFileObj.fileName}`
               return (
-                <div className="d-flex align-items-center py-1" key={index}>
+                <div className="d-flex align-items-center pl-0 custom-control custom-checkbox" key={index}>
                   <input
                     data-id="singleTest"
-                    className="singleTest"
+                    className="singleTest custom-control-input"
                     id={elemId}
                     onChange={(e) => toggleCheckbox(e.target.checked, index)}
                     type="checkbox"
                     checked={testFileObj.checked}
                   />
-                  <label className="singleTestLabel text-nowrap pl-2 mb-0" htmlFor={elemId}>
+                  <label
+                    className="singleTestLabel text-nowrap mb-0 form-check-label mb-0 ml-4 custom-control-label text-nowrap"
+                    htmlFor={elemId}
+                    style={{ paddingTop: '0.125rem' }}
+                  >
                     {testFileObj.fileName}
                   </label>
                 </div>
@@ -876,7 +881,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
         </div>
         <div className="align-items-start flex-column mt-2 mx-3 mb-0">
           <span className="text-info h6" hidden={progressBarHidden}>
-            <FormattedMessage id="solidityUnitTesting.progress" values={{readyTestsNumber, runningTestsNumber}} />
+            <FormattedMessage id="solidityUnitTesting.progress" values={{ readyTestsNumber, runningTestsNumber }} />
           </span>
           <label className="text-warning h6" data-id="testTabTestsExecutionStopped" hidden={testsExecutionStoppedHidden}>
             <FormattedMessage id="solidityUnitTesting.testTabTestsExecutionStopped" />
diff --git a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
index a5e1e95ab1..db3c012714 100644
--- a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
+++ b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import React, {useState, useEffect, useReducer, useRef, SyntheticEvent, MouseEvent} from 'react' // eslint-disable-line
-import {FormattedMessage, useIntl} from 'react-intl'
+import React, { useState, useEffect, useReducer, useRef, SyntheticEvent, MouseEvent } from 'react' // eslint-disable-line
+import { FormattedMessage, useIntl } from 'react-intl'
 import {
   registerCommandAction,
   registerLogScriptRunnerAction,
@@ -8,15 +8,15 @@ import {
   registerErrorScriptRunnerAction,
   registerWarnScriptRunnerAction,
   listenOnNetworkAction,
-  initListeningOnNetwork
+  initListeningOnNetwork,
 } from './actions/terminalAction'
-import {initialState, registerCommandReducer, addCommandHistoryReducer, registerScriptRunnerReducer} from './reducers/terminalReducer'
-import {getKeyOf, getValueOf, Objectfilter, matched} from './utils/utils'
-import {allCommands, allPrograms} from './commands' // eslint-disable-line
+import { initialState, registerCommandReducer, addCommandHistoryReducer, registerScriptRunnerReducer } from './reducers/terminalReducer'
+import { getKeyOf, getValueOf, Objectfilter, matched } from './utils/utils'
+import { allCommands, allPrograms } from './commands' // eslint-disable-line
 import TerminalWelcomeMessage from './terminalWelcome' // eslint-disable-line
-import {Toaster} from '@remix-ui/toaster' // eslint-disable-line
-import {ModalDialog} from '@remix-ui/modal-dialog' // eslint-disable-line
-import {CustomTooltip} from '@remix-ui/helper'
+import { Toaster } from '@remix-ui/toaster' // eslint-disable-line
+import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line
+import { CustomTooltip } from '@remix-ui/helper'
 
 import './remix-ui-terminal.css'
 import vm from 'vm'
@@ -26,8 +26,8 @@ import RenderUnKnownTransactions from './components/RenderUnknownTransactions' /
 import RenderCall from './components/RenderCall' // eslint-disable-line
 import RenderKnownTransactions from './components/RenderKnownTransactions' // eslint-disable-line
 import parse from 'html-react-parser'
-import {EMPTY_BLOCK, KNOWN_TRANSACTION, RemixUiTerminalProps, UNKNOWN_TRANSACTION} from './types/terminalTypes'
-import {wrapScript} from './utils/wrapScript'
+import { EMPTY_BLOCK, KNOWN_TRANSACTION, RemixUiTerminalProps, UNKNOWN_TRANSACTION } from './types/terminalTypes'
+import { wrapScript } from './utils/wrapScript'
 
 /* eslint-disable-next-line */
 export interface ClipboardEvent<T = Element> extends SyntheticEvent<T, any> {
@@ -35,7 +35,7 @@ export interface ClipboardEvent<T = Element> extends SyntheticEvent<T, any> {
 }
 
 export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
-  const {call, _deps, on, config, event, version} = props.plugin
+  const { call, _deps, on, config, event, version } = props.plugin
   const [_cmdIndex, setCmdIndex] = useState(-1)
   const [_cmdTemp, setCmdTemp] = useState('')
   const [isOpen, setIsOpen] = useState<boolean>(true)
@@ -45,7 +45,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   const [toaster, setToaster] = useState(false)
   const [toastProvider, setToastProvider] = useState({
     show: false,
-    fileName: ''
+    fileName: '',
   })
   const [modalState, setModalState] = useState({
     message: '',
@@ -54,7 +54,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     cancelLabel: '',
     hide: true,
     cancelFn: () => {},
-    handleHide: () => {}
+    handleHide: () => {},
   })
 
   const [clearConsole, setClearConsole] = useState(false)
@@ -63,7 +63,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   const [autoCompletState, setAutoCompleteState] = useState({
     activeSuggestion: 0,
     data: {
-      _options: []
+      _options: [],
     },
     _startingElement: 0,
     autoCompleteSelectedItem: {},
@@ -75,7 +75,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     text: '',
     userInput: '',
     extraCommands: [],
-    commandHistoryIndex: 0
+    commandHistoryIndex: 0,
   })
 
   const [searchInput, setSearchInput] = useState('')
@@ -92,7 +92,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   const intl = useIntl()
 
   const scrollToBottom = () => {
-    messagesEndRef.current.scrollIntoView({behavior: 'smooth'})
+    messagesEndRef.current.scrollIntoView({ behavior: 'smooth' })
   }
 
   useEffect(() => {
@@ -101,8 +101,8 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
         scriptRunnerDispatch({
           type: 'html',
           payload: {
-            message: [html ? (html.innerText ? html.innerText : html) : null]
-          }
+            message: [html ? (html.innerText ? html.innerText : html) : null],
+          },
         })
       },
 
@@ -110,14 +110,14 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
         if (typeof message === 'string') {
           message = {
             value: message,
-            type: 'log'
+            type: 'log',
           }
         }
         scriptRunnerDispatch({
           type: message.type ? message.type : 'log',
-          payload: {message: [message.value]}
+          payload: { message: [message.value] },
         })
-      }
+      },
     })
   }, [])
 
@@ -128,22 +128,22 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     registerInfoScriptRunnerAction(on, 'info', newstate.commands, scriptRunnerDispatch)
     registerWarnScriptRunnerAction(on, 'warn', newstate.commands, scriptRunnerDispatch)
     registerErrorScriptRunnerAction(on, 'error', newstate.commands, scriptRunnerDispatch)
-    registerCommandAction('html', _blocksRenderer('html'), {activate: true}, dispatch)
-    registerCommandAction('log', _blocksRenderer('log'), {activate: true}, dispatch)
-    registerCommandAction('info', _blocksRenderer('info'), {activate: true}, dispatch)
-    registerCommandAction('warn', _blocksRenderer('warn'), {activate: true}, dispatch)
-    registerCommandAction('error', _blocksRenderer('error'), {activate: true}, dispatch)
+    registerCommandAction('html', _blocksRenderer('html'), { activate: true }, dispatch)
+    registerCommandAction('log', _blocksRenderer('log'), { activate: true }, dispatch)
+    registerCommandAction('info', _blocksRenderer('info'), { activate: true }, dispatch)
+    registerCommandAction('warn', _blocksRenderer('warn'), { activate: true }, dispatch)
+    registerCommandAction('error', _blocksRenderer('error'), { activate: true }, dispatch)
 
     registerCommandAction(
       'script',
       function execute(args, scopedCommands) {
         const script = String(args[0])
         _shell(script, scopedCommands, function (error, output) {
-          if (error) scriptRunnerDispatch({type: 'error', payload: {message: error}})
-          if (output) scriptRunnerDispatch({type: 'script', payload: {message: '5'}})
+          if (error) scriptRunnerDispatch({ type: 'error', payload: { message: error } })
+          if (output) scriptRunnerDispatch({ type: 'script', payload: { message: '5' } })
         })
       },
-      {activate: true},
+      { activate: true },
       dispatch
     )
   }, [autoCompletState.text])
@@ -169,16 +169,16 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     }
 
     const provider = _deps.fileManager.fileProviderOf(file)
-    console.log({provider})
+    console.log({ provider })
 
     if (!provider) {
       // toolTip(`provider for path ${file} not found`)
-      setToastProvider({show: true, fileName: file})
+      setToastProvider({ show: true, fileName: file })
       if (cb) cb()
       return
     }
     provider.get(file, (error, content) => {
-      console.log({content})
+      console.log({ content })
       if (error) {
         // toolTip(error)
         // TODO: pop up
@@ -213,13 +213,13 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
           },
           execute: (fileName, callback) => {
             return execute(fileName, callback)
-          }
-        }
+          },
+        },
       }
       try {
         const cmds = vm.createContext(context)
         const result = vm.runInContext(script, cmds) // eslint-disable-line
-        console.log({result})
+        console.log({ result })
         return done(null, result)
       } catch (error) {
         return done(error.message)
@@ -247,7 +247,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       // backspace or any key that should remove the autocompletion
       setAutoCompleteState((prevState) => ({
         ...prevState,
-        showSuggestions: false
+        showSuggestions: false,
       }))
     }
     if (autoCompletState.showSuggestions && (event.which === 13 || event.which === 9)) {
@@ -256,7 +256,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
           ...prevState,
           activeSuggestion: 0,
           showSuggestions: false,
-          userInput: Object.keys(autoCompletState.data._options[0]).toString()
+          userInput: Object.keys(autoCompletState.data._options[0]).toString(),
         }))
       } else {
         if (autoCompletState.showSuggestions && (event.which === 13 || event.which === 9)) {
@@ -266,14 +266,14 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
             showSuggestions: false,
             userInput: autoCompletState.data._options[autoCompletState.activeSuggestion]
               ? Object.keys(autoCompletState.data._options[autoCompletState.activeSuggestion]).toString()
-              : inputEl.current.value
+              : inputEl.current.value,
           }))
         } else {
           setAutoCompleteState((prevState) => ({
             ...prevState,
             activeSuggestion: 0,
             showSuggestions: false,
-            userInput: autoCompletState.data._options.length === 1 ? Object.keys(autoCompletState.data._options[0]).toString() : inputEl.current.value
+            userInput: autoCompletState.data._options.length === 1 ? Object.keys(autoCompletState.data._options[0]).toString() : inputEl.current.value,
           }))
         }
       }
@@ -290,22 +290,22 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
         setCmdTemp('')
         const script = autoCompletState.userInput.trim() // inputEl.current.innerText.trim()
         if (script.length) {
-          cmdHistoryDispatch({type: 'cmdHistory', payload: {script}})
+          cmdHistoryDispatch({ type: 'cmdHistory', payload: { script } })
           newstate.commands.script(wrapScript(script))
         }
-        setAutoCompleteState((prevState) => ({...prevState, userInput: ''}))
+        setAutoCompleteState((prevState) => ({ ...prevState, userInput: '' }))
         inputEl.current.innerText = ''
         inputEl.current.focus()
         setAutoCompleteState((prevState) => ({
           ...prevState,
-          showSuggestions: false
+          showSuggestions: false,
         }))
       }
     } else if (newstate._commandHistory.length && event.which === 38 && !autoCompletState.showSuggestions && autoCompletState.userInput === '') {
       event.preventDefault()
       setAutoCompleteState((prevState) => ({
         ...prevState,
-        userInput: newstate._commandHistory[0]
+        userInput: newstate._commandHistory[0],
       }))
     } else if (event.which === 38 && autoCompletState.showSuggestions) {
       event.preventDefault()
@@ -315,7 +315,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       setAutoCompleteState((prevState) => ({
         ...prevState,
         activeSuggestion: suggestionCount - 1,
-        userInput: Object.keys(autoCompletState.data._options[autoCompletState.activeSuggestion]).toString()
+        userInput: Object.keys(autoCompletState.data._options[autoCompletState.activeSuggestion]).toString(),
       }))
     } else if (event.which === 38 && !autoCompletState.showSuggestions) {
       // <arrowUp>
@@ -332,7 +332,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       setAutoCompleteState((prevState) => ({
         ...prevState,
         activeSuggestion: suggestionCount + 1,
-        userInput: Object.keys(autoCompletState.data._options[autoCompletState.activeSuggestion + 1]).toString()
+        userInput: Object.keys(autoCompletState.data._options[autoCompletState.activeSuggestion + 1]).toString(),
       }))
     } else if (event.which === 40 && !autoCompletState.showSuggestions) {
       if (_cmdIndex > -1) {
@@ -359,7 +359,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       log: 'text-log',
       info: 'text-log',
       warn: 'text-warning',
-      error: 'text-danger'
+      error: 'text-danger',
     }[mode] // defaults
 
     if (mode) {
@@ -389,7 +389,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
 
   const handleClearConsole = () => {
     setClearConsole(true)
-    dispatch({type: 'clearconsole', payload: []})
+    dispatch({ type: 'clearconsole', payload: [] })
     inputEl.current.focus()
   }
   /* start of autoComplete */
@@ -408,42 +408,42 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
         setAutoCompleteState((prevState) => ({
           ...prevState,
           showSuggestions: false,
-          userInput: inputString
+          userInput: inputString,
         }))
       } else {
         setAutoCompleteState((prevState) => ({
           ...prevState,
           showSuggestions: true,
-          userInput: inputString
+          userInput: inputString,
         }))
       }
       const textList = inputString.split('.')
       if (textList.length === 1) {
         setAutoCompleteState((prevState) => ({
           ...prevState,
-          data: {_options: []}
+          data: { _options: [] },
         }))
         const result = Objectfilter(allPrograms, autoCompletState.userInput)
         setAutoCompleteState((prevState) => ({
           ...prevState,
-          data: {_options: result}
+          data: { _options: result },
         }))
       } else {
         setAutoCompleteState((prevState) => ({
           ...prevState,
-          data: {_options: []}
+          data: { _options: [] },
         }))
         const result = Objectfilter(allCommands, autoCompletState.userInput)
         setAutoCompleteState((prevState) => ({
           ...prevState,
-          data: {_options: result}
+          data: { _options: result },
         }))
       }
     } else {
       setAutoCompleteState((prevState) => ({
         ...prevState,
         showSuggestions: false,
-        userInput: inputString
+        userInput: inputString,
       }))
     }
   }
@@ -453,7 +453,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     setAutoCompleteState((prevState) => ({
       ...prevState,
       showSuggestions: false,
-      userInput: result
+      userInput: result,
     }))
     inputEl.current.focus()
   }
@@ -466,7 +466,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       }
       setAutoCompleteState((prevState) => ({
         ...prevState,
-        activeSuggestion: suggestionCount - 1
+        activeSuggestion: suggestionCount - 1,
       }))
     } else if (event.keyCode === 40) {
       if (autoCompletState.activeSuggestion - 1 === autoCompletState.data._options.length) {
@@ -474,7 +474,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       }
       setAutoCompleteState((prevState) => ({
         ...prevState,
-        activeSuggestion: suggestionCount + 1
+        activeSuggestion: suggestionCount + 1,
       }))
     }
   }
@@ -488,12 +488,12 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       okFn,
       cancelLabel,
       cancelFn,
-      hide
+      hide,
     }))
   }
 
   const handleHideModal = () => {
-    setModalState((prevState) => ({...prevState, hide: true}))
+    setModalState((prevState) => ({ ...prevState, hide: true }))
   }
 
   const txDetails = (event, tx) => {
@@ -515,7 +515,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
         display:
           autoCompletState.showSuggestions && autoCompletState.userInput !== '' && autoCompletState.userInput.length > 0 && autoCompletState.data._options.length > 0
             ? 'block'
-            : 'none'
+            : 'none',
       }}
     >
       <div>
@@ -545,7 +545,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     setAutoCompleteState((prevState) => ({
       ...prevState,
       activeSuggestion: 0,
-      showSuggestions: false
+      showSuggestions: false,
     }))
   }
 
@@ -572,7 +572,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   const classNameBlock = 'remix_ui_terminal_block px-4 py-1 text-break'
 
   return (
-    <div style={{flexGrow: 1}} className="remix_ui_terminal_panel" ref={panelRef}>
+    <div style={{ flexGrow: 1 }} className="remix_ui_terminal_panel" ref={panelRef}>
       <div className="remix_ui_terminal_bar d-flex">
         <div className="remix_ui_terminal_menu d-flex w-100 align-items-center position-relative border-top border-dark bg-light" ref={terminalMenu} data-id="terminalToggleMenu">
           <CustomTooltip placement="top" tooltipId="terminalToggle" tooltipClasses="text-nowrap" tooltipText={isOpen ? 'Hide Terminal' : 'Show Terminal'}>
@@ -590,12 +590,17 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
           <CustomTooltip placement="top" tooltipId="terminalClear" tooltipClasses="text-nowrap" tooltipText="Pending Transactions">
             <div className="mx-2">0</div>
           </CustomTooltip>
-          <div className="pt-1 h-80 mx-3 align-items-center remix_ui_terminal_listenOnNetwork custom-control custom-checkbox">
-            <CustomTooltip placement="top" tooltipId="terminalClear" tooltipClasses="text-nowrap" tooltipText={intl.formatMessage({id: 'terminal.listenTitle'})}>
+          <div className="h-80 mx-3 align-items-center remix_ui_terminal_listenOnNetwork custom-control custom-checkbox">
+            <CustomTooltip placement="top" tooltipId="terminalClear" tooltipClasses="text-nowrap" tooltipText={intl.formatMessage({ id: 'terminal.listenTitle' })}>
               <input className="custom-control-input" id="listenNetworkCheck" onChange={listenOnNetwork} type="checkbox" />
             </CustomTooltip>
-            <CustomTooltip placement="top" tooltipId="terminalClear" tooltipClasses="text-nowrap" tooltipText={intl.formatMessage({id: 'terminal.listenTitle'})}>
-              <label className="pt-1 form-check-label custom-control-label text-nowrap" htmlFor="listenNetworkCheck" data-id="listenNetworkCheckInput">
+            <CustomTooltip placement="top" tooltipId="terminalClear" tooltipClasses="text-nowrap" tooltipText={intl.formatMessage({ id: 'terminal.listenTitle' })}>
+              <label
+                className="form-check-label custom-control-label text-nowrap"
+                style={{ paddingTop: '0.125rem' }}
+                htmlFor="listenNetworkCheck"
+                data-id="listenNetworkCheckInput"
+              >
                 <FormattedMessage id="terminal.listen" />
               </label>
             </CustomTooltip>
@@ -607,7 +612,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
               type="text"
               className="remix_ui_terminal_filter border form-control"
               id="searchInput"
-              placeholder={intl.formatMessage({id: 'terminal.search'})}
+              placeholder={intl.formatMessage({ id: 'terminal.search' })}
               data-id="terminalInputSearch"
             />
           </div>

From ecbfa86eeb8f14599924e7ad1d674abbed1c9ae7 Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Tue, 29 Aug 2023 14:04:27 +0200
Subject: [PATCH 02/22] typo

---
 .../solidity-unit-testing/src/lib/solidity-unit-testing.tsx | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
index c90bcf4bd6..61afd6eeff 100644
--- a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
+++ b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
@@ -867,11 +867,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
                     type="checkbox"
                     checked={testFileObj.checked}
                   />
-                  <label
-                    className="singleTestLabel text-nowrap mb-0 form-check-label mb-0 ml-4 custom-control-label text-nowrap"
-                    htmlFor={elemId}
-                    style={{ paddingTop: '0.125rem' }}
-                  >
+                  <label className="singleTestLabel text-nowrap mb-0 form-check-label ml-4 custom-control-label text-nowrap" htmlFor={elemId} style={{ paddingTop: '0.125rem' }}>
                     {testFileObj.fileName}
                   </label>
                 </div>

From 2127cb2771e7cadb3dfb75933839da07a32f681b Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Tue, 29 Aug 2023 20:14:49 +0200
Subject: [PATCH 03/22] fixing border highlight

---
 .../solidity-unit-testing/src/lib/solidity-unit-testing.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
index 61afd6eeff..94d07962b2 100644
--- a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
+++ b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
@@ -838,7 +838,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
             </button>
           </CustomTooltip>
         </div>
-        <div className="d-flex align-items-center mx-3 pb-2 mt-2 border-bottom">
+        <div className="d-flex align-items-center ml-1 mr-3 pl-1  pb-2 mt-2 border-bottom">
           <input
             id="checkAllTests"
             className="custom-control-input"
@@ -853,12 +853,12 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
             <FormattedMessage id="solidityUnitTesting.selectAll" />{' '}
           </label>
         </div>
-        <div className="testList py-2 mt-0 border-bottom">
+        <div className="testList ml-1 pr-2 mt-0 border-bottom py-2">
           {testFiles.length
             ? testFiles.map((testFileObj: TestObject, index) => {
               const elemId = `singleTest${testFileObj.fileName}`
               return (
-                <div className="d-flex align-items-center pl-0 custom-control custom-checkbox" key={index}>
+                <div className="d-flex align-items-center pl-1 custom-control custom-checkbox" key={index}>
                   <input
                     data-id="singleTest"
                     className="singleTest custom-control-input"

From 2c1b9e94827e393cd01a3450c164693633086588 Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Wed, 6 Sep 2023 17:33:54 +0200
Subject: [PATCH 04/22] fixing checkall

---
 .../solidity-unit-testing/src/lib/solidity-unit-testing.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
index 94d07962b2..168fb0f345 100644
--- a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
+++ b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
@@ -838,7 +838,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
             </button>
           </CustomTooltip>
         </div>
-        <div className="d-flex align-items-center ml-1 mr-3 pl-1  pb-2 mt-2 border-bottom">
+        <div className="d-flex align-items-center ml-1 mr-3 pl-1  pb-2 mt-2 border-bottom custom-control custom-checkbox">
           <input
             id="checkAllTests"
             className="custom-control-input"

From 079093b3a26cbba2548e7c060d52c771450f766e Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Wed, 6 Sep 2023 19:50:07 +0200
Subject: [PATCH 05/22] e2e

---
 .../src/lib/solidity-unit-testing.tsx            | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
index 168fb0f345..2c61f1fc8a 100644
--- a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
+++ b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
@@ -843,12 +843,16 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
             id="checkAllTests"
             className="custom-control-input"
             type="checkbox"
-            data-id="testTabCheckAllTests"
             onClick={checkAll}
             checked={checkSelectAll}
             onChange={() => {}} // eslint-disable-line
           />
-          <label htmlFor="checkAllTests" className="form-check-label mb-0 ml-4 custom-control-label text-nowrap" style={{ paddingTop: '0.125rem' }}>
+          <label 
+            data-id="testTabCheckAllTests"
+            htmlFor="checkAllTests"
+            className="form-check-label mb-0 ml-4 custom-control-label text-nowrap"
+            style={{ paddingTop: '0.125rem' }}
+          >
             {' '}
             <FormattedMessage id="solidityUnitTesting.selectAll" />{' '}
           </label>
@@ -860,14 +864,18 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
               return (
                 <div className="d-flex align-items-center pl-1 custom-control custom-checkbox" key={index}>
                   <input
-                    data-id="singleTest"
                     className="singleTest custom-control-input"
                     id={elemId}
                     onChange={(e) => toggleCheckbox(e.target.checked, index)}
                     type="checkbox"
                     checked={testFileObj.checked}
                   />
-                  <label className="singleTestLabel text-nowrap mb-0 form-check-label ml-4 custom-control-label text-nowrap" htmlFor={elemId} style={{ paddingTop: '0.125rem' }}>
+                  <label
+                    data-id="singleTest"
+                    className="singleTestLabel text-nowrap mb-0 form-check-label ml-4 custom-control-label text-nowrap"
+                    htmlFor={elemId}
+                    style={{ paddingTop: '0.125rem' }}
+                  >
                     {testFileObj.fileName}
                   </label>
                 </div>

From dd67c07fbc629b9de3657352bce5723ab559b6e5 Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Thu, 7 Sep 2023 10:38:06 +0200
Subject: [PATCH 06/22] e2e

---
 .../src/tests/solidityUnittests.test.ts              | 12 ++++++------
 .../src/lib/solidity-unit-testing.tsx                |  1 +
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/apps/remix-ide-e2e/src/tests/solidityUnittests.test.ts b/apps/remix-ide-e2e/src/tests/solidityUnittests.test.ts
index 18295838cd..fc3253614d 100644
--- a/apps/remix-ide-e2e/src/tests/solidityUnittests.test.ts
+++ b/apps/remix-ide-e2e/src/tests/solidityUnittests.test.ts
@@ -238,8 +238,8 @@ module.exports = {
       })
       .addFile('tests/hhLogs_test.sol', sources[0]['tests/hhLogs_test.sol'])
       .clickLaunchIcon('solidityUnitTesting')
-      .waitForElementVisible('*[id="singleTesttests/Ballot_test.sol"]', 60000)
-      .click('*[id="singleTesttests/Ballot_test.sol"]')
+      .waitForElementVisible('*[id="idsingleTesttests/Ballot_test.sol"]', 60000)
+      .click('*[id="idsingleTesttests/Ballot_test.sol"]')
       .click('#runTestsTabRunAction')
       .pause(2000)
       .waitForElementVisible('*[data-id="testTabSolidityUnitTestsOutputheader"]', 120000)
@@ -261,8 +261,8 @@ module.exports = {
       .waitForElementPresent('*[data-id="verticalIconsKindfilePanel"]')
       .addFile('tests/ballotFailedLog_test.sol', sources[0]['tests/ballotFailedLog_test.sol'])
       .clickLaunchIcon('solidityUnitTesting')
-      .waitForElementVisible('*[id="singleTesttests/Ballot_test.sol"]', 60000)
-      .click('*[id="singleTesttests/Ballot_test.sol"]')
+      .waitForElementVisible('*[id="idsingleTesttests/Ballot_test.sol"]', 60000)
+      .click('*[id="idsingleTesttests/Ballot_test.sol"]')
       .click('#runTestsTabRunAction')
       .pause(2000)
       .waitForElementVisible('*[data-id="testTabSolidityUnitTestsOutputheader"]', 120000)
@@ -278,8 +278,8 @@ module.exports = {
       .waitForElementPresent('*[data-id="verticalIconsKindfilePanel"]')
       .addFile('tests/ballotFailedDebug_test.sol', sources[0]['tests/ballotFailedDebug_test.sol'])
       .clickLaunchIcon('solidityUnitTesting')
-      .waitForElementVisible('*[id="singleTesttests/Ballot_test.sol"]', 60000)
-      .click('*[id="singleTesttests/Ballot_test.sol"]')
+      .waitForElementVisible('*[id="idsingleTesttests/Ballot_test.sol"]', 60000)
+      .click('*[id="idsingleTesttests/Ballot_test.sol"]')
       .click('#runTestsTabRunAction')
       .waitForElementVisible('*[data-id="testTabSolidityUnitTestsOutputheader"]', 120000)
       .waitForElementContainsText('#solidityUnittestsOutput', 'tests/ballotFailedDebug_test.sol', 60000)
diff --git a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
index 2c61f1fc8a..18da0366ba 100644
--- a/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
+++ b/libs/remix-ui/solidity-unit-testing/src/lib/solidity-unit-testing.tsx
@@ -872,6 +872,7 @@ export const SolidityUnitTesting = (props: Record<string, any>) => {
                   />
                   <label
                     data-id="singleTest"
+                    id={"id" + elemId}
                     className="singleTestLabel text-nowrap mb-0 form-check-label ml-4 custom-control-label text-nowrap"
                     htmlFor={elemId}
                     style={{ paddingTop: '0.125rem' }}

From 04ee680b8c5c95c1ab65a114632af9431aeeb2a9 Mon Sep 17 00:00:00 2001
From: filip mertens <filip.mertens@ethereum.org>
Date: Fri, 8 Sep 2023 13:29:59 +0200
Subject: [PATCH 07/22] improve definitionAtPosition

---
 .../src/app/plugins/parser/code-parser.tsx    | 61 +++++++++++++------
 1 file changed, 42 insertions(+), 19 deletions(-)

diff --git a/apps/remix-ide/src/app/plugins/parser/code-parser.tsx b/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
index 2a38f35bf1..9f69ffc1ac 100644
--- a/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
+++ b/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
@@ -477,40 +477,63 @@ export class CodeParser extends Plugin {
    */
   async definitionAtPosition(position: number) {
     const nodes = await this.nodesAtPosition(position)
-    let nodeDefinition: any
+    let nodeDefinition = {
+      'ast': null,
+      'parser': null
+    }
     let node: genericASTNode
     if (nodes && nodes.length && !this.errorState) {
       node = nodes[nodes.length - 1]
-      nodeDefinition = node
+      let astNodeDefinition = node
       if (!isNodeDefinition(node)) {
-        nodeDefinition = (await this.declarationOf(node)) || node
+        astNodeDefinition = (await this.declarationOf(node)) || node
       }
       if (node.nodeType === 'ImportDirective') {
         for (const key in this.nodeIndex.flatReferences) {
           if (this.nodeIndex.flatReferences[key].id === node.sourceUnit) {
-            nodeDefinition = this.nodeIndex.flatReferences[key]
+            astNodeDefinition = this.nodeIndex.flatReferences[key]
           }
         }
       }
-      return nodeDefinition
-    } else {
-      const astNodes = await this.antlrService.listAstNodes()
-      if (astNodes && astNodes.length) {
-        for (const node of astNodes) {
-          if (node.range[0] <= position && node.range[1] >= position) {
-            if (nodeDefinition && nodeDefinition.range[0] < node.range[0]) {
-              nodeDefinition = node
-            }
-            if (!nodeDefinition) nodeDefinition = node
+
+      nodeDefinition.ast = astNodeDefinition
+    }
+    const astNodes = await this.antlrService.listAstNodes()
+    let parserNodeDefinition = null
+    if (astNodes && astNodes.length) {
+      for (const node of astNodes) {
+        if (node.range[0] <= position && node.range[1] >= position) {
+          if (parserNodeDefinition && parserNodeDefinition.range[0] < node.range[0]) {
+            parserNodeDefinition = node
           }
+          if (!parserNodeDefinition) parserNodeDefinition = node
         }
-        if (nodeDefinition && nodeDefinition.type && nodeDefinition.type === 'Identifier') {
-          const nodeForIdentifier = await this.findIdentifier(nodeDefinition)
-          if (nodeForIdentifier) nodeDefinition = nodeForIdentifier
-        }
-        return nodeDefinition
       }
+      if (parserNodeDefinition && parserNodeDefinition.type && parserNodeDefinition.type === 'Identifier') {
+        const nodeForIdentifier = await this.findIdentifier(parserNodeDefinition)
+        if (nodeForIdentifier) parserNodeDefinition = nodeForIdentifier
+      }
+      nodeDefinition.parser = parserNodeDefinition
     }
+
+    /* if the AST node name & type is the same as the parser node name & type, 
+    / then we can assume that the AST node is the definition, 
+    / because the parser will always return most nodes it can find even with an error in the code
+    */
+
+    if (nodeDefinition.ast && nodeDefinition.parser) {
+      if (nodeDefinition.ast.name === nodeDefinition.parser.name && nodeDefinition.ast.nodeType === nodeDefinition.parser.type) {
+        return nodeDefinition.ast
+      }
+    }
+
+    if (nodeDefinition.ast && !nodeDefinition.parser) {
+        return nodeDefinition.ast
+    }
+
+
+    return nodeDefinition.parser
+
   }
 
   async getContractNodes(contractName: string) {

From b38655f0eb438a4dccdcd719c6afeec3cbe1649f Mon Sep 17 00:00:00 2001
From: filip mertens <filip.mertens@ethereum.org>
Date: Sat, 9 Sep 2023 11:12:16 +0200
Subject: [PATCH 08/22] lint

---
 apps/remix-ide/src/app/plugins/parser/code-parser.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/remix-ide/src/app/plugins/parser/code-parser.tsx b/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
index 9f69ffc1ac..14a1de8400 100644
--- a/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
+++ b/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
@@ -477,7 +477,7 @@ export class CodeParser extends Plugin {
    */
   async definitionAtPosition(position: number) {
     const nodes = await this.nodesAtPosition(position)
-    let nodeDefinition = {
+    const nodeDefinition = {
       'ast': null,
       'parser': null
     }
@@ -528,7 +528,7 @@ export class CodeParser extends Plugin {
     }
 
     if (nodeDefinition.ast && !nodeDefinition.parser) {
-        return nodeDefinition.ast
+      return nodeDefinition.ast
     }
 
 

From 0bb8765057edbcda05b234e60489ae1458efc03f Mon Sep 17 00:00:00 2001
From: filip mertens <filip.mertens@ethereum.org>
Date: Sat, 9 Sep 2023 11:26:06 +0200
Subject: [PATCH 09/22] fix

---
 apps/remix-ide/src/app/plugins/parser/code-parser.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/apps/remix-ide/src/app/plugins/parser/code-parser.tsx b/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
index 14a1de8400..c95cb9efca 100644
--- a/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
+++ b/apps/remix-ide/src/app/plugins/parser/code-parser.tsx
@@ -482,7 +482,7 @@ export class CodeParser extends Plugin {
       'parser': null
     }
     let node: genericASTNode
-    if (nodes && nodes.length && !this.errorState) {
+    if (nodes && nodes.length) {
       node = nodes[nodes.length - 1]
       let astNodeDefinition = node
       if (!isNodeDefinition(node)) {
@@ -524,6 +524,11 @@ export class CodeParser extends Plugin {
     if (nodeDefinition.ast && nodeDefinition.parser) {
       if (nodeDefinition.ast.name === nodeDefinition.parser.name && nodeDefinition.ast.nodeType === nodeDefinition.parser.type) {
         return nodeDefinition.ast
+      }else{
+        // if there is a difference and the compiler has compiled correctly assume the ast node is the definition
+        if(this.compilerService.errorState === false){
+          return nodeDefinition.ast
+        }
       }
     }
 

From 4d7a1a618386967e308e61bf060aa6f70e6d37c5 Mon Sep 17 00:00:00 2001
From: filip mertens <filip.mertens@ethereum.org>
Date: Sat, 9 Sep 2023 11:58:37 +0200
Subject: [PATCH 10/22] add globals

---
 .../lib/providers/completion/completionGlobals.ts  | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/libs/remix-ui/editor/src/lib/providers/completion/completionGlobals.ts b/libs/remix-ui/editor/src/lib/providers/completion/completionGlobals.ts
index 21436a1998..c3b1db62a3 100644
--- a/libs/remix-ui/editor/src/lib/providers/completion/completionGlobals.ts
+++ b/libs/remix-ui/editor/src/lib/providers/completion/completionGlobals.ts
@@ -521,6 +521,20 @@ export function GetGlobalVariable(range: monacoTypes.IRange, monaco): monacoType
 
 export function GetGlobalFunctions(range: monacoTypes.IRange, monaco): monacoTypes.languages.CompletionItem[] {
   return [
+    {
+      label: 'fallback',
+      kind: monaco.languages.CompletionItemKind.Function,
+      insertText: 'fallback() ${1:external} ${2:payable} { }',
+      insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+      range
+    },
+    {
+      label: 'receive',
+      kind: monaco.languages.CompletionItemKind.Function,
+      insertText: 'receive() ${1:external} ${2:payable} { }',
+      insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+      range
+    },
     {
       detail: 'assert(bool condition): throws if the condition is not met - to be used for internal errors.',
       insertText: 'assert(${1:condition});',

From 8f38d41916f59751e37fc826dc84fdd52d80233a Mon Sep 17 00:00:00 2001
From: aniket-engg <aniketengg.225@gmail.com>
Date: Thu, 7 Sep 2023 13:24:53 +0530
Subject: [PATCH 11/22] quickfixes for payable and receive

---
 .../editor/src/lib/providers/quickfixes.ts       | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/libs/remix-ui/editor/src/lib/providers/quickfixes.ts b/libs/remix-ui/editor/src/lib/providers/quickfixes.ts
index 93f289de08..89958ed041 100644
--- a/libs/remix-ui/editor/src/lib/providers/quickfixes.ts
+++ b/libs/remix-ui/editor/src/lib/providers/quickfixes.ts
@@ -170,5 +170,21 @@ export default {
       title: "Add 'calldata' to param",
       message: ' calldata '
     }
+  ],
+  'SyntaxError: No visibility specified. Did you intend to add "external': [
+    {
+      id: 12,
+      title: "Add visibility 'external'",
+      message: 'external ',
+      nodeType: 'FunctionDefinition'
+    }
+  ],
+  'DeclarationError: Receive ether function must be payable, but is "nonpayable".': [
+    {
+      id: 13,
+      title: "Make function 'payable'",
+      message: 'payable ',
+      nodeType: 'FunctionDefinition'
+    }
   ]
 }

From b81d0b24eab9fbe9e063cac7714f1712ffbccb72 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Thu, 24 Aug 2023 15:09:52 +0200
Subject: [PATCH 12/22] Update mainnet node for debugging data

---
 libs/remix-debug/src/init.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/libs/remix-debug/src/init.ts b/libs/remix-debug/src/init.ts
index 700c9f5822..fab25c5039 100644
--- a/libs/remix-debug/src/init.ts
+++ b/libs/remix-debug/src/init.ts
@@ -19,7 +19,7 @@ export function setProvider (web3, url) {
 
 export function web3DebugNode (network) {
   const web3DebugNodes = {
-    Main: 'https://rpc.archivenode.io/e50zmkroshle2e2e50zm0044i7ao04ym',
+    Main: 'https://eth.getblock.io/68069907-1d3c-466e-a533-a943afd935c6/mainnet',
     Rinkeby: 'https://remix-rinkeby.ethdevops.io',
     Ropsten: 'https://remix-ropsten.ethdevops.io',
     Goerli: 'https://remix-goerli.ethdevops.io',

From 2387a622e1d6565b12254dfe3c18c9360261b3b5 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Tue, 20 Jun 2023 12:01:01 +0200
Subject: [PATCH 13/22] basic gpt impl

---
 apps/remix-ide/src/app.js                    |  9 +++--
 apps/remix-ide/src/app/plugins/openaigpt.tsx | 37 ++++++++++++++++++++
 libs/remix-ui/renderer/src/lib/renderer.tsx  | 16 +++++++++
 package.json                                 |  1 +
 yarn.lock                                    |  8 +++++
 5 files changed, 69 insertions(+), 2 deletions(-)
 create mode 100644 apps/remix-ide/src/app/plugins/openaigpt.tsx

diff --git a/apps/remix-ide/src/app.js b/apps/remix-ide/src/app.js
index b06efcf956..cbcd019abc 100644
--- a/apps/remix-ide/src/app.js
+++ b/apps/remix-ide/src/app.js
@@ -46,6 +46,7 @@ import {FileDecorator} from './app/plugins/file-decorator'
 import {CodeFormat} from './app/plugins/code-format'
 import {SolidityUmlGen} from './app/plugins/solidity-umlgen'
 import {ContractFlattener} from './app/plugins/contractFlattener'
+import {OpenAIGpt} from './app/plugins/openaigpt'
 
 const isElectron = require('is-electron')
 
@@ -180,6 +181,9 @@ class AppComponent {
     // ----------------- ContractFlattener ----------------------------
     const contractFlattener = new ContractFlattener()
 
+    // ----------------- Open AI --------------------------------------
+    const openaigpt = new OpenAIGpt()
+
     // ----------------- import content service ------------------------
     const contentImport = new CompilerImports()
 
@@ -297,7 +301,8 @@ class AppComponent {
       search,
       solidityumlgen,
       contractFlattener,
-      solidityScript
+      solidityScript,
+      openaigpt
     ])
 
     // LAYOUT & SYSTEM VIEWS
@@ -410,7 +415,7 @@ class AppComponent {
     ])
     await this.appManager.activatePlugin(['settings'])
     await this.appManager.activatePlugin(['walkthrough', 'storage', 'search', 'compileAndRun', 'recorder'])
-    await this.appManager.activatePlugin(['solidity-script'])
+    await this.appManager.activatePlugin(['solidity-script', 'openaigpt'])
 
     this.appManager.on('filePanel', 'workspaceInitializationCompleted', async () => {
       // for e2e tests
diff --git a/apps/remix-ide/src/app/plugins/openaigpt.tsx b/apps/remix-ide/src/app/plugins/openaigpt.tsx
new file mode 100644
index 0000000000..c2c51e88a6
--- /dev/null
+++ b/apps/remix-ide/src/app/plugins/openaigpt.tsx
@@ -0,0 +1,37 @@
+import { Plugin } from '@remixproject/engine'
+import { OpenAIApi, CreateChatCompletionResponse } from 'openai'
+
+const _paq = window._paq = window._paq || []
+
+const profile = {
+  name: 'openaigpt',
+  displayName: 'openaigpt',
+  description: 'openaigpt',
+  methods: ['message'],
+  events: [],
+  maintainedBy: 'Remix',
+}
+
+export class OpenAIGpt extends Plugin {
+  openai: OpenAIApi
+
+  constructor() {
+    super(profile)
+  }
+
+  async message(prompt): Promise<CreateChatCompletionResponse> {
+    this.call('terminal', 'log', 'Waiting for GPT answer...')
+    const result = await (await fetch('https://openai-gpt.remixproject.org', {
+      method: 'POST',
+      headers: {
+        'Accept': 'application/json',
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({prompt})
+    })).json()
+    
+    console.log(result)
+    this.call('terminal', 'log', { type: 'typewriterlog', value: result.choices[0].message.content })
+    return result.data
+  }
+}
\ No newline at end of file
diff --git a/libs/remix-ui/renderer/src/lib/renderer.tsx b/libs/remix-ui/renderer/src/lib/renderer.tsx
index 41d860bc18..fd1f410026 100644
--- a/libs/remix-ui/renderer/src/lib/renderer.tsx
+++ b/libs/remix-ui/renderer/src/lib/renderer.tsx
@@ -67,6 +67,21 @@ export const Renderer = ({message, opt = {}, plugin}: RendererProps) => {
     }
   }
 
+  const askGtp = async () => {
+    try {
+      const content = await plugin.call('fileManager', 'readFile', editorOptions.errFile)
+      const message = `
+      solidity file: ${content}
+      error message: ${messageText}
+      explain which line the error occured, the reason and how to fix it.
+      `
+      await plugin.call('openaigpt', 'message', message)      
+    } catch (err) {
+      console.error('unable to askGtp')
+      console.error(err)
+    }
+  }
+
   return (
     <>
       {messageText && !close && (
@@ -82,6 +97,7 @@ export const Renderer = ({message, opt = {}, plugin}: RendererProps) => {
             <i className="fas fa-times"></i>
           </div>
           <CopyToClipboard content={messageText} className={` p-0 m-0 far fa-copy ${classList}`} direction={'top'} />
+          <span onClick={() => { askGtp() }}>ASK GPT</span>
         </div>
       )}
     </>
diff --git a/package.json b/package.json
index a435925994..48bff5484a 100644
--- a/package.json
+++ b/package.json
@@ -178,6 +178,7 @@
     "latest-version": "^5.1.0",
     "merge": "^2.1.1",
     "npm-install-version": "^6.0.2",
+    "openai": "^3.3.0",
     "path-browserify": "^1.0.1",
     "prettier": "^2.8.4",
     "prettier-plugin-solidity": "^1.0.0-beta.24",
diff --git a/yarn.lock b/yarn.lock
index 0fbc819922..ffcbd9053a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -21152,6 +21152,14 @@ open@^8.0.9, open@^8.4.0:
     is-docker "^2.1.1"
     is-wsl "^2.2.0"
 
+openai@^3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/openai/-/openai-3.3.0.tgz#a6408016ad0945738e1febf43f2fccca83a3f532"
+  integrity sha512-uqxI/Au+aPRnsaQRe8CojU0eCR7I0mBiKjD3sNMzY6DaC1ZVrc85u98mtJW6voDug8fgGN+DIZmTDxTthxb7dQ==
+  dependencies:
+    axios "^0.26.0"
+    form-data "^4.0.0"
+
 opener@^1.5.1, opener@^1.5.2:
   version "1.5.2"
   resolved "https://registry.yarnpkg.com/opener/-/opener-1.5.2.tgz#5d37e1f35077b9dcac4301372271afdeb2a13598"

From b3eef9cf58b7f381ad772e36a33dff0c2faf3269 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Tue, 20 Jun 2023 13:02:23 +0200
Subject: [PATCH 14/22] better message

---
 libs/remix-ui/renderer/src/lib/renderer.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/libs/remix-ui/renderer/src/lib/renderer.tsx b/libs/remix-ui/renderer/src/lib/renderer.tsx
index fd1f410026..ac491b28d8 100644
--- a/libs/remix-ui/renderer/src/lib/renderer.tsx
+++ b/libs/remix-ui/renderer/src/lib/renderer.tsx
@@ -71,11 +71,11 @@ export const Renderer = ({message, opt = {}, plugin}: RendererProps) => {
     try {
       const content = await plugin.call('fileManager', 'readFile', editorOptions.errFile)
       const message = `
-      solidity file: ${content}
+      solidity code: ${content}
       error message: ${messageText}
-      explain which line the error occured, the reason and how to fix it.
+      explain why the error occurred and how to fix it.
       `
-      await plugin.call('openaigpt', 'message', message)      
+      await plugin.call('openaigpt', 'message', message)
     } catch (err) {
       console.error('unable to askGtp')
       console.error(err)

From 1a24f77a67fe27f2024972ba19876d89d5e13034 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Tue, 20 Jun 2023 13:02:45 +0200
Subject: [PATCH 15/22] add right click menu action for documentation and
 explanation

---
 .../editor/src/lib/remix-ui-editor.tsx        | 60 ++++++++++++++++++-
 1 file changed, 58 insertions(+), 2 deletions(-)

diff --git a/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx b/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
index 55d5c4025c..080284f0be 100644
--- a/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
+++ b/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
@@ -152,6 +152,7 @@ export const EditorUI = (props: EditorUIProps) => {
   const pasteCodeRef = useRef(false)
   const editorRef = useRef(null)
   const monacoRef = useRef<Monaco>(null)
+  const currentFunction = useRef('')
   const currentFileRef = useRef('')
   const currentUrlRef = useRef('')
   // const currentDecorations = useRef({ sourceAnnotationsPerFile: {}, markerPerFile: {} }) // decorations that are currently in use by the editor
@@ -683,7 +684,43 @@ export const EditorUI = (props: EditorUIProps) => {
       }
     }
 
-    const freeFunctionCondition = editor.createContextKey('freeFunctionCondition', false)
+    let gptGenerateDocumentationAction
+    const executeGptGenerateDocumentationAction = {
+      id: "generateDocumentation",
+      label: "Generate documentation for this function",
+      contextMenuOrder: 0, // choose the order
+      contextMenuGroupId: "gtp", // create a new grouping
+      keybindings: [],
+      run: async () => {
+        const file = await props.plugin.call('fileManager', 'getCurrentFile')
+        const content = await props.plugin.call('fileManager', 'readFile', file)
+        const message = `
+        solidity code: ${content}
+        Generate the documentation for the function ${currentFunction.current} using the Doxygen style syntax
+        `
+        await props.plugin.call('openaigpt', 'message', message)
+      },
+    }
+
+    let gptExplainFunctionAction
+    const executegptExplainFunctionAction = {
+      id: "generateDocumentation",
+      label: "Explain this function",
+      contextMenuOrder: 0, // choose the order
+      contextMenuGroupId: "gtp", // create a new grouping
+      keybindings: [],
+      run: async () => {
+        const file = await props.plugin.call('fileManager', 'getCurrentFile')
+        const content = await props.plugin.call('fileManager', 'readFile', file)
+        const message = `
+        solidity code: ${content}
+        Explain the function ${currentFunction.current}
+        `
+        await props.plugin.call('openaigpt', 'message', message)
+      },
+    }
+
+    const freeFunctionCondition = editor.createContextKey('freeFunctionCondition', false);
     let freeFunctionAction
     const executeFreeFunctionAction = {
       id: 'executeFreeFunction',
@@ -695,7 +732,7 @@ export const EditorUI = (props: EditorUIProps) => {
         // eslint-disable-next-line no-bitwise
         monacoRef.current.KeyMod.Shift | monacoRef.current.KeyMod.Alt | monacoRef.current.KeyCode.KeyR
       ],
-      run: async () => {
+      run: async () => { 
         const {nodesAtPosition} = await retrieveNodesAtPosition(props.editorAPI, props.plugin)
         // find the contract and get the nodes of the contract and the base contracts and imports
         if (nodesAtPosition && isArray(nodesAtPosition) && nodesAtPosition.length) {
@@ -715,6 +752,8 @@ export const EditorUI = (props: EditorUIProps) => {
     editor.addAction(zoomOutAction)
     editor.addAction(zoominAction)
     freeFunctionAction = editor.addAction(executeFreeFunctionAction)
+    gptGenerateDocumentationAction = editor.addAction(executeGptGenerateDocumentationAction)
+    gptExplainFunctionAction = editor.addAction(executegptExplainFunctionAction)
 
     // we have to add the command because the menu action isn't always available (see onContextMenuHandlerForFreeFunction)
     editor.addCommand(monacoRef.current.KeyMod.Shift | monacoRef.current.KeyMod.Alt | monacoRef.current.KeyCode.KeyR, () => executeFreeFunctionAction.run())
@@ -726,6 +765,15 @@ export const EditorUI = (props: EditorUIProps) => {
         freeFunctionAction.dispose()
         freeFunctionAction = null
       }
+      if (gptGenerateDocumentationAction) {
+        gptGenerateDocumentationAction.dispose()
+        gptGenerateDocumentationAction = null
+      }
+      if (gptExplainFunctionAction) {
+        gptExplainFunctionAction.dispose()
+        gptExplainFunctionAction = null
+      }
+
       const file = await props.plugin.call('fileManager', 'getCurrentFile')
       if (!file.endsWith('.sol')) {
         freeFunctionCondition.set(false)
@@ -737,6 +785,14 @@ export const EditorUI = (props: EditorUIProps) => {
         executeFreeFunctionAction.label = `Run the free function "${freeFunctionNode.name}" in the Remix VM`
         freeFunctionAction = editor.addAction(executeFreeFunctionAction)
       }
+      const functionImpl = nodesAtPosition.find((node) => node.kind === 'function')      
+      if (functionImpl) {
+        currentFunction.current = functionImpl.name
+        executeGptGenerateDocumentationAction.label = `Generate documentation for the function "${functionImpl.name}"`
+        gptGenerateDocumentationAction = editor.addAction(executeGptGenerateDocumentationAction)
+        executegptExplainFunctionAction.label = `Explain the function "${functionImpl.name}"`
+        gptExplainFunctionAction = editor.addAction(executegptExplainFunctionAction)
+      }
       freeFunctionCondition.set(!!freeFunctionNode)
     }
     contextmenu._onContextMenu = (...args) => {

From 7fe12b92ede367c296ceb8fc59348e7480efca53 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Tue, 20 Jun 2023 17:20:27 +0200
Subject: [PATCH 16/22] type writer

---
 apps/remix-ide/src/app/plugins/openaigpt.tsx  |  2 +-
 .../src/lib/reducers/terminalReducer.ts       |  7 ++-
 .../terminal/src/lib/remix-ui-terminal.tsx    | 50 +++++++++++++++----
 .../terminal/src/lib/types/terminalTypes.ts   |  1 +
 4 files changed, 47 insertions(+), 13 deletions(-)

diff --git a/apps/remix-ide/src/app/plugins/openaigpt.tsx b/apps/remix-ide/src/app/plugins/openaigpt.tsx
index c2c51e88a6..e7fe7ecc85 100644
--- a/apps/remix-ide/src/app/plugins/openaigpt.tsx
+++ b/apps/remix-ide/src/app/plugins/openaigpt.tsx
@@ -31,7 +31,7 @@ export class OpenAIGpt extends Plugin {
     })).json()
     
     console.log(result)
-    this.call('terminal', 'log', { type: 'typewriterlog', value: result.choices[0].message.content })
+    this.call('terminal', 'log', { type: 'typewritersuccess', value: result.choices[0].message.content })
     return result.data
   }
 }
\ No newline at end of file
diff --git a/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts b/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
index 61ba9d85fc..38f860fb84 100644
--- a/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
+++ b/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
@@ -1,4 +1,4 @@
-import { CLEAR_CONSOLE, CMD_HISTORY, EMPTY_BLOCK, ERROR, HTML, INFO, KNOWN_TRANSACTION, LISTEN_ON_NETWORK, LOG, NEW_TRANSACTION, SCRIPT, UNKNOWN_TRANSACTION, WARN } from '../types/terminalTypes'
+import { CLEAR_CONSOLE, CMD_HISTORY, EMPTY_BLOCK, ERROR, HTML, INFO, KNOWN_TRANSACTION, LISTEN_ON_NETWORK, LOG, TYPEWRITERLOG, NEW_TRANSACTION, SCRIPT, UNKNOWN_TRANSACTION, WARN } from '../types/terminalTypes'
 
 export const initialState = {
   journalBlocks: [
@@ -151,6 +151,11 @@ export const registerScriptRunnerReducer = (state, action) => {
       ...state,
       journalBlocks: initialState.journalBlocks.push({ message: action.payload.message, style: 'text-log', provider: action.payload.provider })
     }
+  case TYPEWRITERLOG:
+    return {
+      ...state,
+      journalBlocks: initialState.journalBlocks.push({ message: action.payload.message, typewriter: true, style: 'text-log', provider: action.payload.provider })
+    }
   case INFO:
     return {
       ...state,
diff --git a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
index db3c012714..7a6cdb002f 100644
--- a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
+++ b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
@@ -84,6 +84,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   // terminal inputRef
   const inputEl = useRef(null)
   const messagesEndRef = useRef(null)
+  const typeWriterIndexes = useRef([])
 
   // terminal dragable
   const panelRef = useRef(null)
@@ -389,6 +390,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
 
   const handleClearConsole = () => {
     setClearConsole(true)
+    typeWriterIndexes.current = []
     dispatch({ type: 'clearconsole', payload: [] })
     inputEl.current.focus()
   }
@@ -723,21 +725,36 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
                         </div>
                       )
                     } else {
-                      return (
-                        <div className={classNameBlock} data-id="block" key={i}>
-                          <span className={x.style}>{msg ? msg.toString() : null}</span>
-                        </div>
-                      )
+                      // typeWriterIndexes: we don't want to rerender using typewriter when the react component updates
+                      if (x.typewriter && !typeWriterIndexes.current.includes(index)) {
+                        typeWriterIndexes.current.push(index)
+                        return (
+                          <div className={classNameBlock} data-id="block" key={index}> <span ref={(element) => {
+                            typewrite(element, msg ? msg.toString() : null)
+                          }} className={x.style}></span></div>
+                        )
+                    } else {
+                        return (
+                          <div className={classNameBlock} data-id="block" key={i}><span className={x.style}>{msg ? msg.toString() : null}</span></div>
+                        )
+                      }
                     }
                   })
                 } else {
-                  if (typeof x.message !== 'function') {
+                  // typeWriterIndexes: we don't want to rerender using typewriter when the react component updates
+                  if (x.typewriter && !typeWriterIndexes.current.includes(index)) {
+                    typeWriterIndexes.current.push(index)
                     return (
-                      <div className={classNameBlock} data-id="block" key={index}>
-                        {' '}
-                        <span className={x.style}> {x.message}</span>
-                      </div>
+                      <div className={classNameBlock} data-id="block" key={index}> <span ref={(element) => {
+                        typewrite(element, x.message)
+                      }} className={x.style}></span></div>
                     )
+                  } else {
+                    if (typeof x.message !== 'function') {
+                      return (
+                        <div className={classNameBlock} data-id="block" key={index}> <span className={x.style}> {x.message}</span></div>
+                      )
+                    }
                   }
                 }
               })}
@@ -778,7 +795,18 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   )
 }
 
-function isHtml(value) {
+const typewrite = (elementsRef, message) => {  
+  (() => {
+    let count = 0
+    const id = setInterval(() => {
+      count++
+      elementsRef.innerText = message.substr(0, count)
+      if (message === count) clearInterval(id)  
+    }, 5)
+  })()
+}
+
+function isHtml (value) {
   if (!value.indexOf) return false
   return value.indexOf('<div') !== -1 || value.indexOf('<span') !== -1 || value.indexOf('<p') !== -1 || value.indexOf('<label') !== -1 || value.indexOf('<b') !== -1
 }
diff --git a/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts b/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts
index 7a77b11dab..bb18074479 100644
--- a/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts
+++ b/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts
@@ -15,6 +15,7 @@ export const NEW_CALL = 'newCall'
 
 export const HTML = 'html'
 export const LOG = 'log'
+export const TYPEWRITERLOG = 'typewriterlog'
 export const INFO = 'info'
 export const WARN = 'warn'
 export const ERROR = 'error'

From c1770f92ef73681a5d157f7ada171d35db8c0191 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Mon, 26 Jun 2023 12:18:48 +0200
Subject: [PATCH 17/22] add different types of typewriter

---
 .../terminal/src/lib/reducers/terminalReducer.ts     | 12 +++++++++++-
 .../remix-ui/terminal/src/lib/types/terminalTypes.ts |  2 ++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts b/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
index 38f860fb84..c451abfbb8 100644
--- a/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
+++ b/libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
@@ -1,4 +1,4 @@
-import { CLEAR_CONSOLE, CMD_HISTORY, EMPTY_BLOCK, ERROR, HTML, INFO, KNOWN_TRANSACTION, LISTEN_ON_NETWORK, LOG, TYPEWRITERLOG, NEW_TRANSACTION, SCRIPT, UNKNOWN_TRANSACTION, WARN } from '../types/terminalTypes'
+import { CLEAR_CONSOLE, CMD_HISTORY, EMPTY_BLOCK, ERROR, HTML, INFO, KNOWN_TRANSACTION, LISTEN_ON_NETWORK, LOG, TYPEWRITERLOG, TYPEWRITERWARNING, TYPEWRITERSUCCESS, NEW_TRANSACTION, SCRIPT, UNKNOWN_TRANSACTION, WARN } from '../types/terminalTypes'
 
 export const initialState = {
   journalBlocks: [
@@ -156,6 +156,16 @@ export const registerScriptRunnerReducer = (state, action) => {
       ...state,
       journalBlocks: initialState.journalBlocks.push({ message: action.payload.message, typewriter: true, style: 'text-log', provider: action.payload.provider })
     }
+  case TYPEWRITERWARNING:
+    return {
+      ...state,
+      journalBlocks: initialState.journalBlocks.push({ message: action.payload.message, typewriter: true, style: 'text-warning', provider: action.payload.provider })
+    }
+  case TYPEWRITERSUCCESS:
+    return {
+      ...state,
+      journalBlocks: initialState.journalBlocks.push({ message: action.payload.message, typewriter: true, style: 'text-success', provider: action.payload.provider })
+    }
   case INFO:
     return {
       ...state,
diff --git a/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts b/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts
index bb18074479..d9537fcfd4 100644
--- a/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts
+++ b/libs/remix-ui/terminal/src/lib/types/terminalTypes.ts
@@ -16,6 +16,8 @@ export const NEW_CALL = 'newCall'
 export const HTML = 'html'
 export const LOG = 'log'
 export const TYPEWRITERLOG = 'typewriterlog'
+export const TYPEWRITERWARNING = 'typewriterwarning'
+export const TYPEWRITERSUCCESS = 'typewritersuccess'
 export const INFO = 'info'
 export const WARN = 'warn'
 export const ERROR = 'error'

From 77f9d6d535d3deae3ee5da88a11ffbde51893ba1 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Mon, 28 Aug 2023 16:26:14 +0200
Subject: [PATCH 18/22] update ordering

---
 libs/remix-ui/editor/src/lib/remix-ui-editor.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx b/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
index 080284f0be..b494b58f45 100644
--- a/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
+++ b/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
@@ -706,7 +706,7 @@ export const EditorUI = (props: EditorUIProps) => {
     const executegptExplainFunctionAction = {
       id: "generateDocumentation",
       label: "Explain this function",
-      contextMenuOrder: 0, // choose the order
+      contextMenuOrder: 1, // choose the order
       contextMenuGroupId: "gtp", // create a new grouping
       keybindings: [],
       run: async () => {

From fde9c403dd9b256f5f61d59fbd725065955de634 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Tue, 29 Aug 2023 15:45:41 +0200
Subject: [PATCH 19/22] fix call to openai

---
 apps/remix-ide/src/app/plugins/openaigpt.tsx  |  28 +-
 .../editor/src/lib/remix-ui-editor.tsx        | 265 +++++++++---------
 yarn.lock                                     |   7 +
 3 files changed, 154 insertions(+), 146 deletions(-)

diff --git a/apps/remix-ide/src/app/plugins/openaigpt.tsx b/apps/remix-ide/src/app/plugins/openaigpt.tsx
index e7fe7ecc85..6d0a52667f 100644
--- a/apps/remix-ide/src/app/plugins/openaigpt.tsx
+++ b/apps/remix-ide/src/app/plugins/openaigpt.tsx
@@ -1,7 +1,7 @@
 import { Plugin } from '@remixproject/engine'
-import { OpenAIApi, CreateChatCompletionResponse } from 'openai'
+import { CreateChatCompletionResponse } from 'openai'
 
-const _paq = window._paq = window._paq || []
+const _paq = (window._paq = window._paq || [])
 
 const profile = {
   name: 'openaigpt',
@@ -13,25 +13,25 @@ const profile = {
 }
 
 export class OpenAIGpt extends Plugin {
-  openai: OpenAIApi
-
   constructor() {
     super(profile)
   }
 
   async message(prompt): Promise<CreateChatCompletionResponse> {
     this.call('terminal', 'log', 'Waiting for GPT answer...')
-    const result = await (await fetch('https://openai-gpt.remixproject.org', {
-      method: 'POST',
-      headers: {
-        'Accept': 'application/json',
-        'Content-Type': 'application/json'
-      },
-      body: JSON.stringify({prompt})
-    })).json()
-    
+    const result = await (
+      await fetch('https://openai-gpt.remixproject.org', {
+        method: 'POST',
+        headers: {
+          Accept: 'application/json',
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ prompt }),
+      })
+    ).json()
+
     console.log(result)
     this.call('terminal', 'log', { type: 'typewritersuccess', value: result.choices[0].message.content })
     return result.data
   }
-}
\ No newline at end of file
+}
diff --git a/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx b/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
index b494b58f45..691c8955e9 100644
--- a/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
+++ b/libs/remix-ui/editor/src/lib/remix-ui-editor.tsx
@@ -1,30 +1,30 @@
-import React, {useState, useRef, useEffect, useReducer} from 'react' // eslint-disable-line
-import {isArray} from 'lodash'
-import Editor, {loader, Monaco} from '@monaco-editor/react'
-import {AlertModal} from '@remix-ui/app'
-import {reducerActions, reducerListener, initialState} from './actions/editor'
-import {solidityTokensProvider, solidityLanguageConfig} from './syntaxes/solidity'
-import {cairoTokensProvider, cairoLanguageConfig} from './syntaxes/cairo'
-import {zokratesTokensProvider, zokratesLanguageConfig} from './syntaxes/zokrates'
-import {moveTokenProvider, moveLanguageConfig} from './syntaxes/move'
-import {monacoTypes} from '@remix-ui/editor'
-import {loadTypes} from './web-types'
-import {retrieveNodesAtPosition} from './helpers/retrieveNodesAtPosition'
-import {RemixHoverProvider} from './providers/hoverProvider'
-import {RemixReferenceProvider} from './providers/referenceProvider'
-import {RemixCompletionProvider} from './providers/completionProvider'
-import {RemixHighLightProvider} from './providers/highlightProvider'
-import {RemixDefinitionProvider} from './providers/definitionProvider'
-import {RemixCodeActionProvider} from './providers/codeActionProvider'
+import React, { useState, useRef, useEffect, useReducer } from 'react' // eslint-disable-line
+import { isArray } from 'lodash'
+import Editor, { loader, Monaco } from '@monaco-editor/react'
+import { AlertModal } from '@remix-ui/app'
+import { reducerActions, reducerListener, initialState } from './actions/editor'
+import { solidityTokensProvider, solidityLanguageConfig } from './syntaxes/solidity'
+import { cairoTokensProvider, cairoLanguageConfig } from './syntaxes/cairo'
+import { zokratesTokensProvider, zokratesLanguageConfig } from './syntaxes/zokrates'
+import { moveTokenProvider, moveLanguageConfig } from './syntaxes/move'
+import { monacoTypes } from '@remix-ui/editor'
+import { loadTypes } from './web-types'
+import { retrieveNodesAtPosition } from './helpers/retrieveNodesAtPosition'
+import { RemixHoverProvider } from './providers/hoverProvider'
+import { RemixReferenceProvider } from './providers/referenceProvider'
+import { RemixCompletionProvider } from './providers/completionProvider'
+import { RemixHighLightProvider } from './providers/highlightProvider'
+import { RemixDefinitionProvider } from './providers/definitionProvider'
+import { RemixCodeActionProvider } from './providers/codeActionProvider'
 import './remix-ui-editor.css'
-import {circomLanguageConfig, circomTokensProvider} from './syntaxes/circom'
-import {IPosition} from 'monaco-editor'
+import { circomLanguageConfig, circomTokensProvider } from './syntaxes/circom'
+import { IPosition } from 'monaco-editor'
 
 enum MarkerSeverity {
   Hint = 1,
   Info = 2,
   Warning = 4,
-  Error = 8
+  Error = 8,
 }
 
 type sourceAnnotation = {
@@ -86,7 +86,7 @@ type errorMarker = {
   file: string
 }
 
-loader.config({paths: {vs: 'assets/js/monaco-editor/min/vs'}})
+loader.config({ paths: { vs: 'assets/js/monaco-editor/min/vs' } })
 
 export type DecorationsReturn = {
   currentDecorations: Array<string>
@@ -108,7 +108,8 @@ export type EditorAPIType = {
   clearDecorationsByPlugin: (filePath: string, plugin: string, typeOfDecoration: string, registeredDecorations: any, currentDecorations: any) => DecorationsReturn
   keepDecorationsFor: (filePath: string, plugin: string, typeOfDecoration: string, registeredDecorations: any, currentDecorations: any) => DecorationsReturn
   addErrorMarker: (errors: errorMarker[], from: string) => void
-  clearErrorMarkers: (sources: string[] | {[fileName: string]: any}, from: string) => void
+  clearErrorMarkers: (sources: string[] | { [fileName: string]: any }, from: string) => void
+  getPositionAt: (offset: number) => monacoTypes.IPosition
 }
 
 /* eslint-disable-next-line */
@@ -195,88 +196,88 @@ export const EditorUI = (props: EditorUIProps) => {
       base: themeType,
       inherit: true, // can also be false to completely replace the builtin rules
       rules: [
-        {background: darkColor.replace('#', '')},
-        {foreground: textColor.replace('#', '')},
+        { background: darkColor.replace('#', '') },
+        { foreground: textColor.replace('#', '') },
 
         // global variables
-        {token: 'keyword.abi', foreground: blueColor},
-        {token: 'keyword.block', foreground: blueColor},
-        {token: 'keyword.bytes', foreground: blueColor},
-        {token: 'keyword.msg', foreground: blueColor},
-        {token: 'keyword.tx', foreground: blueColor},
+        { token: 'keyword.abi', foreground: blueColor },
+        { token: 'keyword.block', foreground: blueColor },
+        { token: 'keyword.bytes', foreground: blueColor },
+        { token: 'keyword.msg', foreground: blueColor },
+        { token: 'keyword.tx', foreground: blueColor },
 
         // global functions
-        {token: 'keyword.assert', foreground: blueColor},
-        {token: 'keyword.require', foreground: blueColor},
-        {token: 'keyword.revert', foreground: blueColor},
-        {token: 'keyword.blockhash', foreground: blueColor},
-        {token: 'keyword.keccak256', foreground: blueColor},
-        {token: 'keyword.sha256', foreground: blueColor},
-        {token: 'keyword.ripemd160', foreground: blueColor},
-        {token: 'keyword.ecrecover', foreground: blueColor},
-        {token: 'keyword.addmod', foreground: blueColor},
-        {token: 'keyword.mulmod', foreground: blueColor},
-        {token: 'keyword.selfdestruct', foreground: blueColor},
-        {token: 'keyword.type ', foreground: blueColor},
-        {token: 'keyword.gasleft', foreground: blueColor},
+        { token: 'keyword.assert', foreground: blueColor },
+        { token: 'keyword.require', foreground: blueColor },
+        { token: 'keyword.revert', foreground: blueColor },
+        { token: 'keyword.blockhash', foreground: blueColor },
+        { token: 'keyword.keccak256', foreground: blueColor },
+        { token: 'keyword.sha256', foreground: blueColor },
+        { token: 'keyword.ripemd160', foreground: blueColor },
+        { token: 'keyword.ecrecover', foreground: blueColor },
+        { token: 'keyword.addmod', foreground: blueColor },
+        { token: 'keyword.mulmod', foreground: blueColor },
+        { token: 'keyword.selfdestruct', foreground: blueColor },
+        { token: 'keyword.type ', foreground: blueColor },
+        { token: 'keyword.gasleft', foreground: blueColor },
 
         // specials
-        {token: 'keyword.super', foreground: infoColor},
-        {token: 'keyword.this', foreground: infoColor},
-        {token: 'keyword.virtual', foreground: infoColor},
+        { token: 'keyword.super', foreground: infoColor },
+        { token: 'keyword.this', foreground: infoColor },
+        { token: 'keyword.virtual', foreground: infoColor },
 
         // for state variables
-        {token: 'keyword.constants', foreground: grayColor},
-        {token: 'keyword.override', foreground: grayColor},
-        {token: 'keyword.immutable', foreground: grayColor},
+        { token: 'keyword.constants', foreground: grayColor },
+        { token: 'keyword.override', foreground: grayColor },
+        { token: 'keyword.immutable', foreground: grayColor },
 
         // data location
-        {token: 'keyword.memory', foreground: locationColor},
-        {token: 'keyword.storage', foreground: locationColor},
-        {token: 'keyword.calldata', foreground: locationColor},
+        { token: 'keyword.memory', foreground: locationColor },
+        { token: 'keyword.storage', foreground: locationColor },
+        { token: 'keyword.calldata', foreground: locationColor },
 
         // for Events
-        {token: 'keyword.indexed', foreground: yellowColor},
-        {token: 'keyword.anonymous', foreground: yellowColor},
+        { token: 'keyword.indexed', foreground: yellowColor },
+        { token: 'keyword.anonymous', foreground: yellowColor },
 
         // for functions
-        {token: 'keyword.external', foreground: successColor},
-        {token: 'keyword.internal', foreground: successColor},
-        {token: 'keyword.private', foreground: successColor},
-        {token: 'keyword.public', foreground: successColor},
-        {token: 'keyword.view', foreground: successColor},
-        {token: 'keyword.pure', foreground: successColor},
-        {token: 'keyword.payable', foreground: successColor},
-        {token: 'keyword.nonpayable', foreground: successColor},
+        { token: 'keyword.external', foreground: successColor },
+        { token: 'keyword.internal', foreground: successColor },
+        { token: 'keyword.private', foreground: successColor },
+        { token: 'keyword.public', foreground: successColor },
+        { token: 'keyword.view', foreground: successColor },
+        { token: 'keyword.pure', foreground: successColor },
+        { token: 'keyword.payable', foreground: successColor },
+        { token: 'keyword.nonpayable', foreground: successColor },
 
         // Errors
-        {token: 'keyword.Error', foreground: dangerColor},
-        {token: 'keyword.Panic', foreground: dangerColor},
+        { token: 'keyword.Error', foreground: dangerColor },
+        { token: 'keyword.Panic', foreground: dangerColor },
 
         // special functions
-        {token: 'keyword.fallback', foreground: pinkColor},
-        {token: 'keyword.receive', foreground: pinkColor},
-        {token: 'keyword.constructor', foreground: pinkColor},
+        { token: 'keyword.fallback', foreground: pinkColor },
+        { token: 'keyword.receive', foreground: pinkColor },
+        { token: 'keyword.constructor', foreground: pinkColor },
 
         // identifiers
-        {token: 'keyword.identifier', foreground: warningColor},
-        {token: 'keyword.for', foreground: warningColor},
-        {token: 'keyword.break', foreground: warningColor},
-        {token: 'keyword.continue', foreground: warningColor},
-        {token: 'keyword.while', foreground: warningColor},
-        {token: 'keyword.do', foreground: warningColor},
-        {token: 'keyword.delete', foreground: warningColor},
+        { token: 'keyword.identifier', foreground: warningColor },
+        { token: 'keyword.for', foreground: warningColor },
+        { token: 'keyword.break', foreground: warningColor },
+        { token: 'keyword.continue', foreground: warningColor },
+        { token: 'keyword.while', foreground: warningColor },
+        { token: 'keyword.do', foreground: warningColor },
+        { token: 'keyword.delete', foreground: warningColor },
 
-        {token: 'keyword.if', foreground: yellowColor},
-        {token: 'keyword.else', foreground: yellowColor},
+        { token: 'keyword.if', foreground: yellowColor },
+        { token: 'keyword.else', foreground: yellowColor },
 
-        {token: 'keyword.throw', foreground: orangeColor},
-        {token: 'keyword.catch', foreground: orangeColor},
-        {token: 'keyword.try', foreground: orangeColor},
+        { token: 'keyword.throw', foreground: orangeColor },
+        { token: 'keyword.catch', foreground: orangeColor },
+        { token: 'keyword.try', foreground: orangeColor },
 
         // returns
-        {token: 'keyword.returns', foreground: greenColor},
-        {token: 'keyword.return', foreground: greenColor}
+        { token: 'keyword.returns', foreground: greenColor },
+        { token: 'keyword.return', foreground: greenColor },
       ],
       colors: {
         // see https://code.visualstudio.com/api/references/theme-color for more settings
@@ -295,8 +296,8 @@ export const EditorUI = (props: EditorUIProps) => {
         'menu.background': textbackground,
         'menu.selectionBackground': secondaryColor,
         'menu.selectionForeground': textColor,
-        'menu.selectionBorder': secondaryColor
-      }
+        'menu.selectionBorder': secondaryColor,
+      },
     })
     monacoRef.current.editor.setTheme(themeName)
   }
@@ -314,7 +315,7 @@ export const EditorUI = (props: EditorUIProps) => {
     const file = editorModelsState[props.currentFile]
     editorRef.current.setModel(file.model)
     editorRef.current.updateOptions({
-      readOnly: editorModelsState[props.currentFile].readOnly
+      readOnly: editorModelsState[props.currentFile].readOnly,
     })
     if (file.language === 'sol') {
       monacoRef.current.editor.setModelLanguage(file.model, 'remix-solidity')
@@ -338,10 +339,10 @@ export const EditorUI = (props: EditorUIProps) => {
         options: {
           isWholeLine: false,
           glyphMarginHoverMessage: {
-            value: (decoration.from ? `from ${decoration.from}:\n` : '') + decoration.text
+            value: (decoration.from ? `from ${decoration.from}:\n` : '') + decoration.text,
           },
-          glyphMarginClassName: `fal fa-exclamation-square text-${decoration.type === 'error' ? 'danger' : decoration.type === 'warning' ? 'warning' : 'info'}`
-        }
+          glyphMarginClassName: `fal fa-exclamation-square text-${decoration.type === 'error' ? 'danger' : decoration.type === 'warning' ? 'warning' : 'info'}`,
+        },
       }
     }
     if (typeOfDecoration === 'markerPerFile') {
@@ -364,8 +365,8 @@ export const EditorUI = (props: EditorUIProps) => {
         ),
         options: {
           isWholeLine,
-          inlineClassName: `${isWholeLine ? 'alert-info' : 'inline-class'}  border-0 highlightLine${decoration.position.start.line + 1}`
-        }
+          inlineClassName: `${isWholeLine ? 'alert-info' : 'inline-class'}  border-0 highlightLine${decoration.position.start.line + 1}`,
+        },
       }
     }
     if (typeOfDecoration === 'lineTextPerFile') {
@@ -381,11 +382,11 @@ export const EditorUI = (props: EditorUIProps) => {
         options: {
           after: {
             content: ` ${lineTextDecoration.content}`,
-            inlineClassName: `${lineTextDecoration.className}`
+            inlineClassName: `${lineTextDecoration.className}`,
           },
           afterContentClassName: `${lineTextDecoration.afterContentClassName}`,
-          hoverMessage: lineTextDecoration.hoverMessage
-        }
+          hoverMessage: lineTextDecoration.hoverMessage,
+        },
       }
     }
     if (typeOfDecoration === 'lineTextPerFile') {
@@ -401,11 +402,11 @@ export const EditorUI = (props: EditorUIProps) => {
         options: {
           after: {
             content: ` ${lineTextDecoration.content}`,
-            inlineClassName: `${lineTextDecoration.className}`
+            inlineClassName: `${lineTextDecoration.className}`,
           },
           afterContentClassName: `${lineTextDecoration.afterContentClassName}`,
-          hoverMessage: lineTextDecoration.hoverMessage
-        }
+          hoverMessage: lineTextDecoration.hoverMessage,
+        },
       }
     }
   }
@@ -415,7 +416,7 @@ export const EditorUI = (props: EditorUIProps) => {
     if (!model)
       return {
         currentDecorations: [],
-        registeredDecorations: []
+        registeredDecorations: [],
       }
     const decorations = []
     const newRegisteredDecorations = []
@@ -429,7 +430,7 @@ export const EditorUI = (props: EditorUIProps) => {
     }
     return {
       currentDecorations: model.deltaDecorations(currentDecorations, decorations),
-      registeredDecorations: newRegisteredDecorations
+      registeredDecorations: newRegisteredDecorations,
     }
   }
 
@@ -437,7 +438,7 @@ export const EditorUI = (props: EditorUIProps) => {
     const model = editorModelsState[filePath]?.model
     if (!model)
       return {
-        currentDecorations: []
+        currentDecorations: [],
       }
     const decorations = []
     if (registeredDecorations) {
@@ -448,17 +449,17 @@ export const EditorUI = (props: EditorUIProps) => {
       }
     }
     return {
-      currentDecorations: model.deltaDecorations(currentDecorations, decorations)
+      currentDecorations: model.deltaDecorations(currentDecorations, decorations),
     }
   }
 
   const addDecoration = (decoration: sourceAnnotation | sourceMarker, filePath: string, typeOfDecoration: string) => {
     const model = editorModelsState[filePath]?.model
-    if (!model) return {currentDecorations: []}
+    if (!model) return { currentDecorations: [] }
     const monacoDecoration = convertToMonacoDecoration(decoration, typeOfDecoration)
     return {
       currentDecorations: model.deltaDecorations([], [monacoDecoration]),
-      registeredDecorations: [{value: decoration, type: typeOfDecoration}]
+      registeredDecorations: [{ value: decoration, type: typeOfDecoration }],
     }
   }
 
@@ -479,7 +480,7 @@ export const EditorUI = (props: EditorUIProps) => {
       const errorServerityMap = {
         error: MarkerSeverity.Error,
         warning: MarkerSeverity.Warning,
-        info: MarkerSeverity.Info
+        info: MarkerSeverity.Info,
       }
       if (model) {
         const markerData: monacoTypes.editor.IMarkerData = {
@@ -488,7 +489,7 @@ export const EditorUI = (props: EditorUIProps) => {
           startColumn: (error.position.start && error.position.start.column) || 0,
           endLineNumber: (error.position.end && error.position.end.line) || 0,
           endColumn: (error.position.end && error.position.end.column) || 0,
-          message: error.message
+          message: error.message,
         }
         if (!allMarkersPerfile[filePath]) {
           allMarkersPerfile[filePath] = []
@@ -504,7 +505,7 @@ export const EditorUI = (props: EditorUIProps) => {
     }
   }
 
-  props.editorAPI.clearErrorMarkers = async (sources: string[] | {[fileName: string]: any}, from: string) => {
+  props.editorAPI.clearErrorMarkers = async (sources: string[] | { [fileName: string]: any }, from: string) => {
     if (sources) {
       for (const source of Array.isArray(sources) ? sources : Object.keys(sources)) {
         const filePath = source
@@ -573,9 +574,9 @@ export const EditorUI = (props: EditorUIProps) => {
                 range: new monacoRef.current.Range(position.lineNumber, 1, position.lineNumber, 1),
                 options: {
                   isWholeLine: false,
-                  glyphMarginClassName: 'fas fa-circle text-info'
-                }
-              }
+                  glyphMarginClassName: 'fas fa-circle text-info',
+                },
+              },
             ]
           )
           prevState[currentFile][position.lineNumber] = decorationIds[0]
@@ -627,7 +628,7 @@ export const EditorUI = (props: EditorUIProps) => {
                 </div>
               </div>
             </div>
-          )
+          ),
         }
         props.plugin.call('notification', 'alert', modalContent)
         pasteCodeRef.current = true
@@ -650,7 +651,7 @@ export const EditorUI = (props: EditorUIProps) => {
       contextMenuGroupId: 'zooming', // create a new grouping
       keybindings: [
         // eslint-disable-next-line no-bitwise
-        monacoRef.current.KeyMod.CtrlCmd | monacoRef.current.KeyCode.Equal
+        monacoRef.current.KeyMod.CtrlCmd | monacoRef.current.KeyCode.Equal,
       ],
       run: () => {
         editor.updateOptions({fontSize: editor.getOption(51) + 1})
@@ -663,7 +664,7 @@ export const EditorUI = (props: EditorUIProps) => {
       contextMenuGroupId: 'zooming', // create a new grouping
       keybindings: [
         // eslint-disable-next-line no-bitwise
-        monacoRef.current.KeyMod.CtrlCmd | monacoRef.current.KeyCode.Minus
+        monacoRef.current.KeyMod.CtrlCmd | monacoRef.current.KeyCode.Minus,
       ],
       run: () => {
         editor.updateOptions({fontSize: editor.getOption(51) - 1})
@@ -676,20 +677,20 @@ export const EditorUI = (props: EditorUIProps) => {
       contextMenuGroupId: 'formatting', // create a new grouping
       keybindings: [
         // eslint-disable-next-line no-bitwise
-        monacoRef.current.KeyMod.Shift | monacoRef.current.KeyMod.Alt | monacoRef.current.KeyCode.KeyF
+        monacoRef.current.KeyMod.Shift | monacoRef.current.KeyMod.Alt | monacoRef.current.KeyCode.KeyF,
       ],
       run: async () => {
         const file = await props.plugin.call('fileManager', 'getCurrentFile')
         await props.plugin.call('codeFormatter', 'format', file)
-      }
+      },
     }
 
     let gptGenerateDocumentationAction
     const executeGptGenerateDocumentationAction = {
-      id: "generateDocumentation",
-      label: "Generate documentation for this function",
+      id: 'generateDocumentation',
+      label: 'Generate documentation for this function',
       contextMenuOrder: 0, // choose the order
-      contextMenuGroupId: "gtp", // create a new grouping
+      contextMenuGroupId: 'gtp', // create a new grouping
       keybindings: [],
       run: async () => {
         const file = await props.plugin.call('fileManager', 'getCurrentFile')
@@ -704,10 +705,10 @@ export const EditorUI = (props: EditorUIProps) => {
 
     let gptExplainFunctionAction
     const executegptExplainFunctionAction = {
-      id: "generateDocumentation",
-      label: "Explain this function",
+      id: 'explainFunction',
+      label: 'Explain this function',
       contextMenuOrder: 1, // choose the order
-      contextMenuGroupId: "gtp", // create a new grouping
+      contextMenuGroupId: 'gtp', // create a new grouping
       keybindings: [],
       run: async () => {
         const file = await props.plugin.call('fileManager', 'getCurrentFile')
@@ -720,7 +721,7 @@ export const EditorUI = (props: EditorUIProps) => {
       },
     }
 
-    const freeFunctionCondition = editor.createContextKey('freeFunctionCondition', false);
+    const freeFunctionCondition = editor.createContextKey('freeFunctionCondition', false)
     let freeFunctionAction
     const executeFreeFunctionAction = {
       id: 'executeFreeFunction',
@@ -730,10 +731,10 @@ export const EditorUI = (props: EditorUIProps) => {
       precondition: 'freeFunctionCondition',
       keybindings: [
         // eslint-disable-next-line no-bitwise
-        monacoRef.current.KeyMod.Shift | monacoRef.current.KeyMod.Alt | monacoRef.current.KeyCode.KeyR
+        monacoRef.current.KeyMod.Shift | monacoRef.current.KeyMod.Alt | monacoRef.current.KeyCode.KeyR,
       ],
-      run: async () => { 
-        const {nodesAtPosition} = await retrieveNodesAtPosition(props.editorAPI, props.plugin)
+      run: async () => {
+        const { nodesAtPosition } = await retrieveNodesAtPosition(props.editorAPI, props.plugin)
         // find the contract and get the nodes of the contract and the base contracts and imports
         if (nodesAtPosition && isArray(nodesAtPosition) && nodesAtPosition.length) {
           const freeFunctionNode = nodesAtPosition.find((node) => node.kind === 'freeFunction')
@@ -746,7 +747,7 @@ export const EditorUI = (props: EditorUIProps) => {
         } else {
           props.plugin.call('notification', 'toast', 'Please go to Remix settings and activate the code editor features or wait that the current editor context is loaded.')
         }
-      }
+      },
     }
     editor.addAction(formatAction)
     editor.addAction(zoomOutAction)
@@ -779,13 +780,13 @@ export const EditorUI = (props: EditorUIProps) => {
         freeFunctionCondition.set(false)
         return
       }
-      const {nodesAtPosition} = await retrieveNodesAtPosition(props.editorAPI, props.plugin)
+      const { nodesAtPosition } = await retrieveNodesAtPosition(props.editorAPI, props.plugin)
       const freeFunctionNode = nodesAtPosition.find((node) => node.kind === 'freeFunction')
       if (freeFunctionNode) {
         executeFreeFunctionAction.label = `Run the free function "${freeFunctionNode.name}" in the Remix VM`
         freeFunctionAction = editor.addAction(executeFreeFunctionAction)
       }
-      const functionImpl = nodesAtPosition.find((node) => node.kind === 'function')      
+      const functionImpl = nodesAtPosition.find((node) => node.kind === 'function')
       if (functionImpl) {
         currentFunction.current = functionImpl.name
         executeGptGenerateDocumentationAction.label = `Generate documentation for the function "${functionImpl.name}"`
@@ -813,7 +814,7 @@ export const EditorUI = (props: EditorUIProps) => {
             editor.revealRange(input.options.selection)
             editor.setPosition({
               column: input.options.selection.startColumn,
-              lineNumber: input.options.selection.startLineNumber
+              lineNumber: input.options.selection.startLineNumber,
             })
           }
         } catch (e) {
@@ -831,11 +832,11 @@ export const EditorUI = (props: EditorUIProps) => {
   function handleEditorWillMount(monaco) {
     monacoRef.current = monaco
     // Register a new language
-    monacoRef.current.languages.register({id: 'remix-solidity'})
-    monacoRef.current.languages.register({id: 'remix-cairo'})
-    monacoRef.current.languages.register({id: 'remix-zokrates'})
-    monacoRef.current.languages.register({id: 'remix-move'})
-    monacoRef.current.languages.register({id: 'remix-circom'})
+    monacoRef.current.languages.register({ id: 'remix-solidity' })
+    monacoRef.current.languages.register({ id: 'remix-cairo' })
+    monacoRef.current.languages.register({ id: 'remix-zokrates' })
+    monacoRef.current.languages.register({ id: 'remix-move' })
+    monacoRef.current.languages.register({ id: 'remix-circom' })
 
     // Register a tokens provider for the language
     monacoRef.current.languages.setMonarchTokensProvider('remix-solidity', solidityTokensProvider as any)
@@ -873,7 +874,7 @@ export const EditorUI = (props: EditorUIProps) => {
         beforeMount={handleEditorWillMount}
         options={{
           glyphMargin: true,
-          readOnly: (!editorRef.current || !props.currentFile) && editorModelsState[props.currentFile]?.readOnly
+          readOnly: (!editorRef.current || !props.currentFile) && editorModelsState[props.currentFile]?.readOnly,
         }}
         defaultValue={defaultEditorValue}
       />
diff --git a/yarn.lock b/yarn.lock
index ffcbd9053a..4fec0c5f48 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7812,6 +7812,13 @@ axios@^0.21.1:
   dependencies:
     follow-redirects "^1.14.0"
 
+axios@^0.26.0:
+  version "0.26.1"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.26.1.tgz#1ede41c51fcf51bbbd6fd43669caaa4f0495aaa9"
+  integrity sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==
+  dependencies:
+    follow-redirects "^1.14.8"
+
 axios@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/axios/-/axios-1.4.0.tgz#38a7bf1224cd308de271146038b551d725f0be1f"

From 142a1381fa3e7b8ea7274aa419ff811f3ecb03c7 Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Thu, 31 Aug 2023 15:08:32 +0200
Subject: [PATCH 20/22] linting

---
 libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
index 7a6cdb002f..67a439fd29 100644
--- a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
+++ b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
@@ -733,7 +733,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
                             typewrite(element, msg ? msg.toString() : null)
                           }} className={x.style}></span></div>
                         )
-                    } else {
+                      } else {
                         return (
                           <div className={classNameBlock} data-id="block" key={i}><span className={x.style}>{msg ? msg.toString() : null}</span></div>
                         )

From f7e0ae3ce247aa4166bd1bbce841ead043cce18e Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Thu, 31 Aug 2023 16:42:27 +0200
Subject: [PATCH 21/22] make the code safer

---
 apps/remix-ide/src/app/plugins/openaigpt.tsx | 35 ++++++++++++--------
 1 file changed, 22 insertions(+), 13 deletions(-)

diff --git a/apps/remix-ide/src/app/plugins/openaigpt.tsx b/apps/remix-ide/src/app/plugins/openaigpt.tsx
index 6d0a52667f..042c6da13b 100644
--- a/apps/remix-ide/src/app/plugins/openaigpt.tsx
+++ b/apps/remix-ide/src/app/plugins/openaigpt.tsx
@@ -19,19 +19,28 @@ export class OpenAIGpt extends Plugin {
 
   async message(prompt): Promise<CreateChatCompletionResponse> {
     this.call('terminal', 'log', 'Waiting for GPT answer...')
-    const result = await (
-      await fetch('https://openai-gpt.remixproject.org', {
-        method: 'POST',
-        headers: {
-          Accept: 'application/json',
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({ prompt }),
-      })
-    ).json()
-
-    console.log(result)
-    this.call('terminal', 'log', { type: 'typewritersuccess', value: result.choices[0].message.content })
+    let result
+    try {
+      result = await (
+        await fetch('https://openai-gpt.remixproject.org', {
+          method: 'POST',
+          headers: {
+            Accept: 'application/json',
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({ prompt }),
+        })
+      ).json()
+    } catch (e) {
+      this.call('terminal', 'log', { type: 'typewritererror', value: `Unable to get a response ${e.message}` })
+      return
+    }
+    
+    if (result && result.choices && result.choices.length) {
+      this.call('terminal', 'log', { type: 'typewritersuccess', value: result.choices[0].message.content })    
+    } else {
+      this.call('terminal', 'log', { type: 'typewritersuccess', value: 'No response...' })
+    }
     return result.data
   }
 }

From 94f695819355c6008104a09a4431043915a9b6fa Mon Sep 17 00:00:00 2001
From: yann300 <yann.levreau@gmail.com>
Date: Mon, 11 Sep 2023 14:18:08 +0200
Subject: [PATCH 22/22] show terminal

---
 apps/remix-ide/src/app/panels/layout.ts      | 8 +++++++-
 apps/remix-ide/src/app/plugins/openaigpt.tsx | 1 +
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/apps/remix-ide/src/app/panels/layout.ts b/apps/remix-ide/src/app/panels/layout.ts
index 3a44d1f83b..a152efc72e 100644
--- a/apps/remix-ide/src/app/panels/layout.ts
+++ b/apps/remix-ide/src/app/panels/layout.ts
@@ -6,7 +6,7 @@ import { QueryParams } from '@remix-project/remix-lib'
 const profile: Profile = {
   name: 'layout',
   description: 'layout',
-  methods: ['minimize', 'maximiseSidePanel', 'resetSidePanel']
+  methods: ['minimize', 'maximiseSidePanel', 'resetSidePanel', 'maximizeTerminal']
 }
 
 interface panelState {
@@ -109,6 +109,12 @@ export class Layout extends Plugin {
     this.maximised[current] = true
   }
 
+  async maximizeTerminal() {
+    this.panels.terminal.minimized = false
+    this.event.emit('change', this.panels)
+    this.emit('change', this.panels)
+  }
+
   async resetSidePanel () {
     this.event.emit('resetsidepanel')
     const current = await this.call('sidePanel', 'currentFocus')
diff --git a/apps/remix-ide/src/app/plugins/openaigpt.tsx b/apps/remix-ide/src/app/plugins/openaigpt.tsx
index 042c6da13b..e95babe00a 100644
--- a/apps/remix-ide/src/app/plugins/openaigpt.tsx
+++ b/apps/remix-ide/src/app/plugins/openaigpt.tsx
@@ -18,6 +18,7 @@ export class OpenAIGpt extends Plugin {
   }
 
   async message(prompt): Promise<CreateChatCompletionResponse> {
+    this.call('layout', 'maximizeTerminal')
     this.call('terminal', 'log', 'Waiting for GPT answer...')
     let result
     try {