From 7a6223bff8e962335a4839c3777eb603212670bb Mon Sep 17 00:00:00 2001
From: Robert Kossessa <github@kosro.de>
Date: Sat, 9 Mar 2024 00:44:02 +0100
Subject: [PATCH] ADD: Non-functional save/revert buttons

---
 .../src/components/navbar/MenubarButton.vue    |  2 +-
 src/renderer/src/components/navbar/Navbar.vue  | 18 +++++++++++++++++-
 .../components/ui/menubar/MenubarTrigger.vue   |  2 +-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/renderer/src/components/navbar/MenubarButton.vue b/src/renderer/src/components/navbar/MenubarButton.vue
index 52b37e3..eae38d1 100644
--- a/src/renderer/src/components/navbar/MenubarButton.vue
+++ b/src/renderer/src/components/navbar/MenubarButton.vue
@@ -1,6 +1,6 @@
 <template>
   <button
-    class="app-titlebar-button flex items-center rounded-sm px-3 py-1 text-sm font-medium text-muted-foreground hover:bg-accent hover:text-accent-foreground"
+    class="app-titlebar-button flex items-center rounded-lg px-3 py-1 text-sm font-medium text-muted-foreground hover:bg-accent hover:text-accent-foreground"
   >
     <slot />
   </button>
diff --git a/src/renderer/src/components/navbar/Navbar.vue b/src/renderer/src/components/navbar/Navbar.vue
index 08bd763..fddcacb 100644
--- a/src/renderer/src/components/navbar/Navbar.vue
+++ b/src/renderer/src/components/navbar/Navbar.vue
@@ -132,6 +132,20 @@
         </MenubarMenu>
       </div>
       <div class="grow" />
+      <div class="flex items-center gap-2 px-2">
+        <div v-if="numberOfChanges" class="text-sm">
+          <PenLine class="inline-block h-4" />{{ numberOfChanges }} Changes
+        </div>
+        <MenubarButton class="app-titlebar-button border-2"> Revert </MenubarButton>
+        <MenubarButton
+          :class="{
+            'bg-zinc-200 text-zinc-950 hover:bg-zinc-100 hover:text-zinc-950': numberOfChanges
+          }"
+          class="app-titlebar-button border-2"
+        >
+          Save
+        </MenubarButton>
+      </div>
       <MenubarButton
         v-if="showDisconnectButton"
         class="app-titlebar-button border-2"
@@ -176,7 +190,7 @@ import {
   MenubarTrigger
 } from '@renderer/components/ui/menubar'
 import ScrambleText from '@renderer/components/common/ScrambleText.vue'
-import { Minus, Square, Copy, X } from 'lucide-vue-next'
+import { Minus, Square, Copy, X, PenLine } from 'lucide-vue-next'
 import { onMounted, ref } from 'vue'
 import { Separator } from '@renderer/components/ui/separator'
 import { useStore } from '@renderer/store'
@@ -195,6 +209,8 @@ const { electronAPI } = window
 const isMacOS = electronAPI.platform === 'darwin'
 const zoomFactor = ref(1)
 
+const numberOfChanges = ref(27)
+
 const previewDeviceNames = ref({
   nanoOne: 'One',
   nanoZero: 'Zero'
diff --git a/src/renderer/src/components/ui/menubar/MenubarTrigger.vue b/src/renderer/src/components/ui/menubar/MenubarTrigger.vue
index 81905d5..63f1119 100644
--- a/src/renderer/src/components/ui/menubar/MenubarTrigger.vue
+++ b/src/renderer/src/components/ui/menubar/MenubarTrigger.vue
@@ -19,7 +19,7 @@ const forwardedProps = useForwardProps(delegatedProps)
     v-bind="forwardedProps"
     :class="
       cn(
-        'flex cursor-default select-none items-center rounded-sm px-3 py-1 text-sm font-medium outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
+        'flex cursor-default select-none items-center rounded-lg px-3 py-1 text-sm font-medium outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
         props.class
       )
     "