From 68960d68c6a224220853e8babd2c0819f86700c4 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Mon, 8 Apr 2024 14:51:39 +0300
Subject: [PATCH] Refactored Terminal

---
 components/lib/terminal/Terminal.vue           | 18 +++++++++---------
 components/lib/terminal/style/TerminalStyle.js | 12 +++++++-----
 .../lib/themes/primeone/base/terminal/index.js |  6 +++---
 3 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/components/lib/terminal/Terminal.vue b/components/lib/terminal/Terminal.vue
index d9a3e1855..44f87069e 100755
--- a/components/lib/terminal/Terminal.vue
+++ b/components/lib/terminal/Terminal.vue
@@ -1,16 +1,16 @@
 <template>
     <div :class="cx('root')" @click="onClick" v-bind="ptmi('root')">
-        <div v-if="welcomeMessage" v-bind="ptm('welcomeMessage')">{{ welcomeMessage }}</div>
-        <div :class="cx('content')" v-bind="ptm('content')">
-            <div v-for="(command, i) of commands" :key="command.text + i.toString()" v-bind="ptm('commands')">
-                <span :class="cx('prompt')" v-bind="ptm('prompt')">{{ prompt }}</span>
-                <span :class="cx('command')" v-bind="ptm('command')">{{ command.text }}</span>
-                <div :class="cx('response')" aria-live="polite" v-bind="ptm('response')">{{ command.response }}</div>
+        <div v-if="welcomeMessage" :class="cx('welcomeMessage')" v-bind="ptm('welcomeMessage')">{{ welcomeMessage }}</div>
+        <div :class="cx('commandList')" v-bind="ptm('content')">
+            <div v-for="(command, i) of commands" :key="command.text + i.toString()" :class="cx('command')" v-bind="ptm('commands')">
+                <span :class="cx('promptLabel')" v-bind="ptm('prompt')">{{ prompt }}</span>
+                <span :class="cx('commandValue')" v-bind="ptm('command')">{{ command.text }}</span>
+                <div :class="cx('commandResponse')" aria-live="polite" v-bind="ptm('response')">{{ command.response }}</div>
             </div>
         </div>
-        <div :class="cx('container')" v-bind="ptm('container')">
-            <span :class="cx('prompt')" v-bind="ptm('prompt')">{{ prompt }}</span>
-            <input ref="input" v-model="commandText" type="text" :class="cx('commandText')" autocomplete="off" @keydown="onKeydown" v-bind="ptm('commandText')" />
+        <div :class="cx('prompt')" v-bind="ptm('container')">
+            <span :class="cx('promptLabel')" v-bind="ptm('prompt')">{{ prompt }}</span>
+            <input ref="input" v-model="commandText" :class="cx('promptValue')" type="text" autocomplete="off" @keydown="onKeydown" v-bind="ptm('commandText')" />
         </div>
     </div>
 </template>
diff --git a/components/lib/terminal/style/TerminalStyle.js b/components/lib/terminal/style/TerminalStyle.js
index 966054bea..71e2132f1 100644
--- a/components/lib/terminal/style/TerminalStyle.js
+++ b/components/lib/terminal/style/TerminalStyle.js
@@ -2,12 +2,14 @@ import BaseStyle from 'primevue/base/style';
 
 const classes = {
     root: 'p-terminal p-component',
-    content: 'p-terminal-commands-container',
+    welcomeMessage: 'p-terminal-welcome-message',
+    commandList: 'p-terminal-command-list',
+    command: 'p-terminal-command',
+    commandValue: 'p-terminal-command-value',
+    commandResponse: 'p-terminal-command-response',
     prompt: 'p-terminal-prompt',
-    command: 'p-terminal-command-value',
-    response: 'p-terminal-command-response',
-    container: 'p-terminal-prompt-container',
-    commandText: 'p-terminal-input'
+    promptLabel: 'p-terminal-prompt-label',
+    promptValue: 'p-terminal-prompt-value'
 };
 
 export default BaseStyle.extend({
diff --git a/components/lib/themes/primeone/base/terminal/index.js b/components/lib/themes/primeone/base/terminal/index.js
index 3f5402180..ecafe73ef 100644
--- a/components/lib/themes/primeone/base/terminal/index.js
+++ b/components/lib/themes/primeone/base/terminal/index.js
@@ -10,12 +10,12 @@ export default {
     border-radius: ${dt('rounded.base')};
 }
 
-.p-terminal-prompt-container {
+.p-terminal-prompt {
     display: flex;
     align-items: center;
 }
 
-.p-terminal-input {
+.p-terminal-prompt-value {
     flex: 1 1 auto;
     border: 0 none;
     background-color: transparent;
@@ -27,7 +27,7 @@ export default {
     font-size: 1rem;
 }
 
-.p-terminal-prompt {
+.p-terminal-prompt-label {
     margin-right: 0.25rem;
 }