Console Improvements (#767)

frontend/src/components/Terminal.vue

@@ -201,7 +201,6 @@ export default {
                 } else {
                     this.cursorPosition++;
                     this.terminalInputBuffer += e.key;
-                    console.log(this.terminalInputBuffer);
                     this.terminal.write(e.key);
                 }
             });

frontend/src/mixins/socket.ts

@@ -279,7 +279,6 @@ export default defineComponent({
             });
 
             socket.on("agentList", (res) => {
-                console.log(res);
                 if (res.ok) {
                     this.agentList = res.agentList;
                 }

frontend/src/pages/Console.vue

@@ -1,35 +1,36 @@
 <template>
     <transition name="slide-fade" appear>
-        <div>
+        <div v-if="!processing">
             <h1 class="mb-3">Console</h1>
 
-            <div>
-                <p>
-                    {{ $t("Allowed commands:") }}
-                    <template v-for="(command, index) in allowedCommandList" :key="command">
-                        <code>{{ command }}</code>
+            <Terminal v-if="enableConsole" class="terminal" :rows="20" mode="mainTerminal" name="console" :endpoint="endpoint"></Terminal>
 
-                        <!-- No comma at the end -->
-                        <span v-if="index !== allowedCommandList.length - 1">, </span>
-                    </template>
+            <div v-else class="alert alert-warning shadow-box" role="alert">
+                <h4 class="alert-heading">Console is not enabled</h4>
+                <p>
+                    Console is a powerful tool that allows you to execute any commands such as <code>docker</code>, <code>rm</code> within the Dockge's container in this Web UI.
+                </p>
+
+                <p>
+                    It might be dangerous since this Dockge container is connecting to the host's Docker daemon. Also Dockge could be possibly taken down by commands like <code>rm -rf</code>.
+                </p>
+
+                <p>
+                    If you understand the risk, you can enable it by setting <code>DOCKGE_ENABLE_CONSOLE=true</code> in the environment variables.
                 </p>
             </div>
-
-            <Terminal class="terminal" :rows="20" mode="mainTerminal" name="console" :endpoint="endpoint"></Terminal>
         </div>
     </transition>
 </template>
 
 <script>
-
-import { allowedCommandList } from "../../../common/util-common";
-
 export default {
     components: {
     },
     data() {
         return {
-            allowedCommandList,
+            processing: true,
+            enableConsole: false,
         };
     },
     computed: {
@@ -38,7 +39,10 @@ export default {
         },
     },
     mounted() {
-
+        this.$root.emitAgent(this.endpoint, "checkMainTerminal", (res) => {
+            this.enableConsole = res.ok;
+            this.processing = false;
+        });
     },
     methods: {