enable checkbox UI

apps/remix-ide/src/app/tabs/compile-tab.js

@@ -90,6 +90,12 @@ class CompileTab extends ViewPlugin {
    */
 
   listenToEvents () {
+    this.on('filePanel', 'setWorkspace', (workspace) => {
+      this.compileTabLogic.isHardhatProject().then((result) => {
+        if (result) this.compilerContainer.hardhatCompilation.style.display = 'flex'
+      })
+    })
+
     this.data.eventHandlers.onContentChanged = () => {
       this.emit('statusChanged', { key: 'edited', title: 'the content has changed, needs recompilation', type: 'info' })
     }

apps/remix-ide/src/app/tabs/compileTab/compileTab.js

@@ -78,11 +78,16 @@ class CompileTab {
     })
   }
 
+  async isHardhatProject () {
+    if (this.fileManager.mode === 'localhost') {
+      return await this.fileManager.exists('hardhat.config.js')
+    } else return false
+  }
+
   runCompiler () {
     try {
       console.log('mode is - ', this.fileManager.mode)
       if (this.fileManager.mode === 'localhost') {
-        console.log('calling compilehardhat')
         const { currentVersion, optimize, runs } = this.compiler.state
         const fileContent = `module.exports = {
           solidity: '${currentVersion.substring(0, currentVersion.indexOf('+commit'))}',

apps/remix-ide/src/app/tabs/compileTab/compilerContainer.js

@@ -183,6 +183,10 @@ class CompilerContainer {
       }
     })
 
+    this.hardhatCompilation = yo`<div class="mt-2 ${css.compilerConfig} custom-control custom-checkbox" style="display:none">
+        <input class="${css.autocompile} custom-control-input" id="enableHardhat" type="checkbox" title="Enable Hardhat Compilation">
+        <label class="form-check-label custom-control-label" for="enableHardhat">Enable Hardhat Compilation</label>
+      </div>`
     this._view.warnCompilationSlow = yo`<i title="Compilation Slow" style="visibility:hidden" class="${css.warnCompilationSlow} fas fa-exclamation-triangle" aria-hidden="true"></i>`
     this._view.compileIcon = yo`<i class="fas fa-sync ${css.icon}" aria-hidden="true"></i>`
     this._view.autoCompile = yo`<input class="${css.autocompile} custom-control-input" onchange=${() => this.updateAutoCompile()} data-id="compilerContainerAutoCompile" id="autoCompile" type="checkbox" title="Auto compile">`
@@ -299,6 +303,7 @@ class CompilerContainer {
                 <label class="form-check-label custom-control-label" for="hideWarningsBox">Hide warnings</label>
               </div>
             </div>
+            ${this.hardhatCompilation}
             ${this._view.compilationButton}
           </header>
         </article>