UserCard - allow changing nick

irchad-web/src/components/Chat.vue

@@ -1,21 +1,17 @@
 <script setup>
-import { ref, onMounted } from "vue";
+import { onMounted } from "vue";
 import { useIRCStore } from "@/stores/irc";
 
 const store = useIRCStore();
-const inputBuffer = ref();
 
 onMounted(store.connect);
-
-function send() {
-  store.sendActiveBuffer(inputBuffer.value);
-  inputBuffer.value = "";
-}
 </script>
 
 <template>
   <div class="d-flex flex-row" style="height: 100vh">
     <v-sheet border class="buffers">
+      <UserCard />
+      <v-divider />
       <BufferList />
     </v-sheet>
     <div class="messages d-flex flex-column">
@@ -30,14 +26,16 @@ function send() {
         :me="store.clientInfo.nick"
       />
       <v-sheet>
-        <v-text-field
-          variant="outlined"
-          :placeholder="`Message ${store.activeBufferName}`"
-          v-model="inputBuffer"
-          hide-details
-          class="ma-2"
-          @keydown.enter.exact.prevent="send"
-        />
+        <!-- <v-text-field -->
+        <!--   variant="outlined" -->
+        <!--   :placeholder="`Message ${store.activeBufferName}`" -->
+        <!--   v-model="inputBuffer" -->
+        <!--   hide-details -->
+        <!--   class="ma-2" -->
+        <!--   @keydown.enter.exact.prevent="send" -->
+        <!-- /> -->
+
+        <InputBuffer @send="store.sendActiveBuffer" />
       </v-sheet>
     </div>
     <v-sheet class="user-list h-100" border>