Macro recorder update, Macro service added (for the panels)

be/app/macro.go

@@ -48,17 +48,21 @@ func ListMacros(w http.ResponseWriter, r *http.Request) {
 		log.Println(err)
 	}
 
-	var fileNames []string
+	var macroList []structs.MacroInfo
 
 	for _, file := range files {
 		filename := filepath.Base(file.Name())
-		filename = strings.TrimSuffix(filename, filepath.Ext(filename))
+		macroname := strings.TrimSuffix(filename, filepath.Ext(filename))
-		filename = strings.Replace(filename, "_", " ", -1)
+		nicename := strings.Replace(macroname, "_", " ", -1)
 
-		fileNames = append(fileNames, filename)
+		log.Println(macroname, nicename)
+		macroList = append(macroList, structs.MacroInfo{
+			Name:      nicename,
+			Macroname: macroname,
+		})
 	}
 
-	json.NewEncoder(w).Encode(fileNames)
+	json.NewEncoder(w).Encode(macroList)
 }
 
 func DeleteMacro(w http.ResponseWriter, r *http.Request) {}

be/app/structs/macro-struct.go

@@ -17,3 +17,8 @@ type NewMacro struct {
 	Name  string `json:"name"`
 	Steps []Step `json:"steps"`
 }
+
+type MacroInfo struct {
+	Name      string `json:"name"`
+	Macroname string `json:"macroname"`
+}

fe/src/components/macros/MacroOverview.vue

@@ -3,8 +3,8 @@
     <h4 class="border-b-2 border-transparent">Saved Macros</h4>
     <div class="macro-overview__list">
       <div class="macro-item" v-for="(macro, i) in macros.list" :key="i">
-        <ButtonComp variant="dark" class="w-full" size="sm" @click.prevent="runMacro(macro)">
+        <ButtonComp variant="dark" class="w-full" size="sm">
-          <IconKeyboard /> {{ macro }}
+          <IconKeyboard /> {{ macro.name }}
         </ButtonComp>
       </div>
     </div>
@@ -12,30 +12,26 @@
 </template>
 
 <script setup>
+// TODO
+// - load macro on click
+// - delete macro
+
 import { IconKeyboard } from '@tabler/icons-vue'
 import ButtonComp from '../base/ButtonComp.vue'
 import { onMounted, reactive } from 'vue'
 import axios from 'axios'
 import { appUrl, isLocal } from '@/services/ApiService'
 import { AuthCall } from '@/services/EncryptService'
+import { GetMacroList, RunMacro } from '@/services/MacroService'
 
 const macros = reactive({
   list: [],
 })
 
-onMounted(() => {
+onMounted(async () => {
-  axios.post(appUrl() + '/macro/list').then((data) => {
+  const list = await GetMacroList()
-    if (data.data.length > 0) macros.list = data.data
+  macros.list = list
 })
-})
-
-function runMacro(macro) {
-  const data = isLocal() ? { macro: macro } : AuthCall({ macro: macro })
-
-  axios.post(appUrl() + '/macro/play', data).then((data) => {
-    console.log(data)
-  })
-}
 </script>
 
 <style scoped>

fe/src/components/macros/parts/RecorderHeader.vue

@@ -14,7 +14,6 @@
         <ButtonComp
           v-if="!macroRecorder.state.record"
           variant="primary"
-          size="sm"
           @click="macroRecorder.state.record = true"
         >
           <IconPlayerRecordFilled class="text-red-500" />Record
@@ -22,7 +21,6 @@
         <ButtonComp
           v-if="macroRecorder.state.record"
           variant="danger"
-          size="sm"
           @click="macroRecorder.state.record = false"
         >
           <IconPlayerStopFilled class="text-white" />Stop
@@ -37,7 +35,6 @@
         <ButtonComp
           v-if="!macroRecorder.state.edit"
           variant="secondary"
-          size="sm"
           @click="macroRecorder.state.edit = true"
         >
           <IconPencil />Edit
@@ -45,7 +42,6 @@
         <ButtonComp
           v-if="macroRecorder.state.edit"
           variant="danger"
-          size="sm"
           @click="macroRecorder.resetEdit()"
         >
           <IconPlayerStopFilled />Stop

fe/src/services/MacroService.js

@@ -0,0 +1,24 @@
+import axios from 'axios'
+import { appUrl, isLocal } from './ApiService'
+import { AuthCall } from './EncryptService'
+
+export const GetMacroList = async () => {
+  const request = await axios.post(appUrl() + '/macro/list')
+  return sortMacroList(request.data)
+}
+
+const sortMacroList = (list) => {
+  return [...list].sort((a, b) => a.name.localeCompare(b.name))
+}
+
+export const RunMacro = async (macro) => {
+  const data = isLocal() ? { macro: macro } : AuthCall({ macro: macro })
+  const request = await axios.post(appUrl() + '/macro/play', data)
+  return request.data
+}
+
+export const CheckMacroListChange = (oldList, newList) => {
+  console.log(oldList, JSON.stringify(newList))
+
+  return oldList !== JSON.stringify(newList)
+}

fe/src/stores/macrorecorder.js

@@ -130,7 +130,6 @@ export const useMacroRecorderStore = defineStore('macrorecorder', () => {
 
   const changeName = (name) => {
     macroName.value = name
-    console.log(macroName.value)
   }
 
   const changeDelay = (fixed) => {