wip:1

package-lock.json

@@ -11,6 +11,7 @@
       "dependencies": {
         "@electron-toolkit/preload": "^3.0.0",
         "@electron-toolkit/utils": "^3.0.0",
+        "get-installed-apps": "^1.1.0",
         "serialport": "^12.0.0"
       },
       "devDependencies": {
@@ -4254,6 +4255,14 @@
         "node": "6.* || 8.* || >= 10.*"
       }
     },
+    "node_modules/get-installed-apps": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/get-installed-apps/-/get-installed-apps-1.1.0.tgz",
+      "integrity": "sha512-Utei9W3ZiNvT6F3e4/DczVejm+Gbw2/Pbtp9N5jrPf59zfuD9zwfl/BI7EgFl2JDAftz4fYTj4NK21HsrfF3vw==",
+      "dependencies": {
+        "iconv-lite": "^0.6.3"
+      }
+    },
     "node_modules/get-intrinsic": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
@@ -4595,7 +4604,6 @@
       "version": "0.6.3",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
       "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
-      "dev": true,
       "dependencies": {
         "safer-buffer": ">= 2.1.2 < 3.0.0"
       },
@@ -5799,8 +5807,7 @@
     "node_modules/safer-buffer": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
-      "dev": true
     },
     "node_modules/sanitize-filename": {
       "version": "1.6.3",

package.json

@@ -20,6 +20,7 @@
   "dependencies": {
     "@electron-toolkit/preload": "^3.0.0",
     "@electron-toolkit/utils": "^3.0.0",
+    "get-installed-apps": "^1.1.0",
     "serialport": "^12.0.0"
   },
   "devDependencies": {

src/main/index.js

@@ -3,6 +3,7 @@ import { join } from 'path'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
 import icon from '../../resources/icon.png?asset'
 import fs from 'node:fs/promises'
+import {getInstalledApps} from 'get-installed-apps'
 import { SerialPort } from 'serialport'
 import * as logTimestamp from 'log-timestamp'
 
@@ -21,6 +22,10 @@ async function getSerialPorts() {
   return await SerialPort.list()
 }
 
+async function getApps() {
+  return await getInstalledApps()
+}
+
 function createWindow() {
   // Create the browser window.
   const mainWindow = new BrowserWindow({
@@ -75,6 +80,7 @@ app.whenReady().then(() => {
   ipcMain.on('ping', () => console.log('pong'))
   ipcMain.handle('loadConfigurationYML', loadConfigurationYAML)
   ipcMain.handle('getSerialPorts', getSerialPorts)
+  ipcMain.handle('getInstalledApps', getApps)
 
   developmentConsole()
   createWindow()

src/renderer/src/App.vue

@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import Versions from './components/Versions.vue'
-import MovieCard from './components/MovieCard.vue'
 import COMselect from './components/COMselect.vue'
 import { onMounted } from 'vue'
 import { ref } from 'vue'
@@ -10,12 +8,13 @@ const movies = ref([])
 const apiKey = 'a0eb411ca9c81896004dce1d27a7245b'
 const configuration = ref('Loading....')
 const serialPorts = ref('Loading Serial ports.... ')
+const insatlledApps = ref({});
 
 const ipcHandle = () => window.electron.ipcRenderer.send('ping')
-const getConfigFileContents = async () => {
+// const getConfigFileContents = async () => {
-  const returnValue = await window.electron.ipcRenderer.invoke('loadConfigurationYML')
+//   const returnValue = await window.electron.ipcRenderer.invoke('loadConfigurationYML')
-  configuration.value = returnValue
+//   configuration.value = returnValue
-}
+// }
 
 const getSerialPorts = async () => {
   serialPorts.value = await window.electron.ipcRenderer.invoke('getSerialPorts')
@@ -30,9 +29,14 @@ const getTrendingMovies = (category) => {
     })
 }
 
+async function getInstalledApps() {
+  insatlledApps.value = await window.electron.ipcRenderer.invoke('getInstalledApps')
+}
+
 onMounted(() => {
   getTrendingMovies('day')
   getSerialPorts()
+  insatlledApps.value = getInstalledApps()
 })
 </script>
 
@@ -43,9 +47,12 @@ onMounted(() => {
 
   <Versions /> -->
 
-  <COMselect :serialports="serialPorts" />
+  <COMselect :serialports="serialPorts" :installedApps="insatlledApps" />
-  <button type="button" @click="ipcHandle">Send Ping</button>
+  <div class="row">
-  <button type="button" @click="getSerialPorts">Load config</button>
+    <button type="button" class="col-auto" @click="ipcHandle">Send Ping</button>
+    <button type="button" class="col-auto" @click="getSerialPorts">Load config</button>
+
+  </div>
   <div>{{ configuration }}</div>
   <!-- 
   <div class="container">

src/renderer/src/components/COMselect.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref } from 'vue'
 
-const props = defineProps(['serialports'])
+const props = defineProps(['serialports', 'installedApps'])
 const com_port = ref('')
 const iterator = ref(1)
 function optioniterator() { return iterator.value++};
@@ -10,10 +10,21 @@ function optioniterator() { return iterator.value++};
 function addNewProgram() {
   const programsContent = document.getElementById('programs')
   const programNode = document.createElement('div')
-  programNode.innerHTML = `<div class='row'><select class='form-select'> <option> ${optioniterator()} </option> </select></div>`
+  // programNode.innerHTML = `<div class='row'><select class='form-select' class='col-auto'> <option> ${optioniterator()} </option> </select></div>`
+  programNode.innerHTML = generateAppSelector()
   programsContent.appendChild(programNode.firstChild)
 }
 
+function generateAppSelector() {
+  let optionsString = ""
+  // foreach (app in props.installedApps)
+  // props.installedApps.array.forEach(element => {
+    for (let app in props.installedApps) {
+    optionsString += `<option value=${props.installedApps[app].path}> ${ props.installedApps[app].path } </option>`
+  }
+  return `<div class="row"><select class="form-select"> ${optionsString} </select></div>`
+}
+
 </script>
 <template>
   <p>Select COM port for device: {{ com_port }}</p>
@@ -34,16 +45,4 @@ function addNewProgram() {
   <div>
     <button class="form-button" @click="addNewProgram">Add program</button>
   </div>
-  <!-- <table>
-    <tr>
-      <td>Select COM Port for device</td>
-      <td>
-        <select v-model="com_port">
-          <option v-for="(serialport, i) in props.serialports" :key="i" :value="serialport.path">
-            {{ serialport.friendlyName }}
-          </option>
-        </select>
-      </td>
-    </tr>
-  </table> --->
 </template>