Version numbers

Reviewed-on: #1

.vscode/extensions.json

@@ -1,5 +1,5 @@
 {
-    "recommendations": [
-        "Webnative.webnative"
-    ]
-}
+  "recommendations": [
+    "Webnative.webnative"
+  ]
+}

android/.idea/.gitignore

@@ -1,3 +0,0 @@
-# Default ignored files
-/shelf/
-/workspace.xml

android/.idea/deploymentTargetSelector.xml

@@ -4,14 +4,6 @@
     <selectionStates>
       <SelectionState runConfigName="app">
         <option name="selectionMode" value="DROPDOWN" />
-        <DropdownSelection timestamp="2025-10-14T17:00:16.525383985Z">
-          <Target type="DEFAULT_BOOT">
-            <handle>
-              <DeviceId pluginId="LocalEmulator" identifier="path=/home/chptr/.android/avd/Medium_Phone.avd" />
-            </handle>
-          </Target>
-        </DropdownSelection>
-        <DialogSelection />
       </SelectionState>
     </selectionStates>
   </component>

android/.idea/deviceManager.xml

@@ -1,13 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="DeviceTable">
-    <option name="columnSorters">
-      <list>
-        <ColumnSorterState>
-          <option name="column" value="Name" />
-          <option name="order" value="ASCENDING" />
-        </ColumnSorterState>
-      </list>
-    </option>
-  </component>
-</project>

android/.idea/misc.xml

@@ -1,9 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="ExternalStorageConfigurationManager" enabled="true" />
-  <component name="ProjectRootManager" version="2" languageLevel="JDK_21" default="true" project-jdk-name="jbr-21" project-jdk-type="JavaSDK">
-    <output url="file://$PROJECT_DIR$/build/classes" />
-  </component>
-  <component name="ProjectType">
-    <option name="id" value="Android" />
-  </component>
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_21" default="true" project-jdk-name="jbr-21" project-jdk-type="JavaSDK" />
 </project>

android/app/capacitor.build.gradle

@@ -13,7 +13,7 @@ dependencies {
     implementation project(':capacitor-haptics')
     implementation project(':capacitor-keyboard')
     implementation project(':capacitor-status-bar')
-
+    implementation "androidx.annotation:annotation:*"
 }
 
 

android/app/src/main/AndroidManifest.xml

@@ -7,7 +7,9 @@
         android:label="@string/app_name"
         android:roundIcon="@mipmap/ic_launcher_round"
         android:supportsRtl="true"
-        android:theme="@style/AppTheme">
+        android:theme="@style/AppTheme"
+        android:networkSecurityConfig="@xml/network_security_config"
+        >
 
         <activity
             android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode|navigation"

android/app/src/main/res/xml/network_security_config.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<network-security-config>
+    <!-- Allow clear‑text only for the CORS proxy used by the library -->
+    <domain-config cleartextTrafficPermitted="true">
+        <domain includeSubdomains="true">cors.emaker.limited</domain>
+    </domain-config>
+
+    <!-- Optional: keep everything else blocked (default) -->
+</network-security-config>

android/build.gradle

@@ -7,7 +7,7 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:8.13.0'
+        classpath 'com.android.tools.build:gradle:8.7.2'
         classpath 'com.google.gms:google-services:4.4.2'
 
         // NOTE: Do not place your application dependencies here; they belong

android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.13-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.11.1-all.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

capacitor.config.ts

@@ -3,7 +3,21 @@ import type { CapacitorConfig } from '@capacitor/cli';
 const config: CapacitorConfig = {
   appId: 'io.ionic.starter',
   appName: 'UpdaterApp',
-  webDir: 'dist'
+  webDir: 'dist',
+  cordova: {
+    preferences: {
+      bluetooth_restore_state: "true",
+      accessBackgroundLocation: "true",
+    },
+  }, 
+  "server": {
+    "androidScheme": "http",
+  },
+  // plugins: {
+  //   CapacitorHttp: {
+  //     enabled: true,
+  //   },
+  // },
 };
 
 export default config;

package.json

@@ -1,11 +1,12 @@
 {
   "name": "UpdaterApp",
   "private": true,
-  "version": "0.0.1",
+  "version": "0.0.2",
   "type": "module",
   "scripts": {
     "dev": "ionic serve",
     "build": "vue-tsc && vite build && npx cap sync",
+    "android": "npm run build && npx cap run android",
     "preview": "vite preview",
     "test:e2e": "cypress run",
     "test:unit": "vitest",
@@ -20,14 +21,17 @@
     "@capacitor/status-bar": "7.0.3",
     "@ionic/vue": "^8.0.0",
     "@ionic/vue-router": "^8.0.0",
+    "cordova-plugin-ble-central": "^2.0.0",
     "ionicons": "^7.0.0",
+    "pinia": "^3.0.3",
+    "updaterweblibrary": "1.1.0",
     "vue": "^3.3.0",
     "vue-router": "^4.2.0"
   },
   "devDependencies": {
     "@capacitor/cli": "7.4.3",
     "@vitejs/plugin-legacy": "^5.0.0",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vitejs/plugin-vue": "^4.6.2",
     "@vue/eslint-config-typescript": "^12.0.0",
     "@vue/test-utils": "^2.3.0",
     "cypress": "^13.5.0",

src/App.vue

@@ -6,4 +6,7 @@
 
 <script setup lang="ts">
 import { IonApp, IonRouterOutlet } from '@ionic/vue';
+import updater from './utils/updater';
+
+updater.obj.bleObject = ble;
 </script>

src/components/ArchiveCard.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
-
+import useArchiveStore from "@/stores/archive";
+import { versionNotes } from "@/utils/types";
+import updater from "@/utils/updater";
 import {
   IonButton,
   IonCard,
@@ -13,8 +15,12 @@ IonLabel, IonItem,
     IonList
 } from "@ionic/vue";
 import {chevronForward} from "ionicons/icons";
+import { onBeforeMount, ref, watch } from "vue";
 
+const archive = useArchiveStore();
 const emit = defineEmits<{(e: "back"): void, (e: "disconnect"): void, (e: "details"):void}>();
+const versions = ref<versionNotes[]>([]);
+const version = ref<string>("");
 
 const back = () => {
   emit("back");
@@ -24,10 +30,16 @@ const disconnect = () => {
   emit("disconnect");
 };
 
-const details = () => {
+const details = (index: number) => {
+  archive.setShownI(index);
   emit("details");
 }
 
+watch(() => archive.getArchive, (newValue) => versions.value = newValue, {immediate: true});
+
+onBeforeMount(async () => {
+  version.value = await updater.obj.getBoardVersion();
+});
 </script>
 
 <template>
@@ -36,7 +48,7 @@ const details = () => {
       <div class="header-column">
         <ion-card-title>ARCHIVE</ion-card-title>
         <ion-card-title>Board</ion-card-title>
-        <ion-card-subtitle>v1.1.1</ion-card-subtitle>
+        <ion-card-subtitle>{{ version }}</ion-card-subtitle>
       </div>
       <div style="flex-grow: 1"></div>
       <div>
@@ -47,10 +59,10 @@ const details = () => {
     <ion-card-content>
       <ion-button @click="back">Back</ion-button>
       <ion-list lines="full" class="item-scroll">
-        <ion-item :button="true" v-for="i in 10" :key="i" @click="details">
+        <ion-item :button="true" v-for="(version, index) in versions" :key="index" @click="details(index)">
           <ion-label>
-            <strong>v{{i}}</strong> <br>
-            <ion-note>date</ion-note>
+            <strong>{{version.title}}</strong> <br>
+            <ion-note>{{ version.date }}</ion-note>
           </ion-label>
           <div slot="end" class="metadata-end-wrapper">
             <ion-icon color="medium" :icon="chevronForward"></ion-icon>

src/components/DetailsCard.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import useArchiveStore from "@/stores/archive";
 import {
   IonButton,
   IonCard,
@@ -7,8 +8,14 @@ import {
   IonCardSubtitle,
   IonCardTitle,
 } from "@ionic/vue";
+import { versionNotes } from "@/utils/types";
+import { onBeforeMount, ref } from "vue";
+import updater from "@/utils/updater";
 
+const archive = useArchiveStore();
 const emit = defineEmits<{(e:"back"):void, (e: "disconnect"): void, (e:"choose"): void}>();
+const record = ref<versionNotes>(archive.getArchive[archive.getShownI]);
+const version = ref<string>("");
 
 const back = () => {
   emit("back");
@@ -22,6 +29,12 @@ const choose = () => {
   emit("choose");
 };
 
+// TODO: remove
+// console.log(archive.getArchive)
+
+onBeforeMount(async () => {
+  version.value = await updater.obj.getBoardVersion();
+});
 </script>
 
 <template>
@@ -30,7 +43,7 @@ const choose = () => {
       <div>
         <ion-card-title>DETAILS</ion-card-title>
         <ion-card-title>Board</ion-card-title>
-        <ion-card-subtitle>v1.1.1</ion-card-subtitle>
+        <ion-card-subtitle>{{ version }}</ion-card-subtitle>
       </div>
       <div style="flex-grow: 1"></div>
       <div>
@@ -40,10 +53,11 @@ const choose = () => {
     <ion-card-content>
       <ion-card>
         <ion-card-header>
-          <ion-card-title>Update Name</ion-card-title>
+          <ion-card-title :href="record.link">{{ record.title }}</ion-card-title>
         </ion-card-header>
         <ion-card-content>
-          <p>Some blurb about the update</p>
+          <p>{{ record.date as Date }}</p>
+          <p v-html="record.html"></p> <br/>
           <ion-button @click="choose">Select</ion-button>
           <ion-button @click="back">Cancel</ion-button>
         </ion-card-content>

src/components/FlashCard.vue

@@ -1,12 +1,46 @@
 <script setup lang="ts">
 
+import useArchiveStore from "@/stores/archive";
+import updater from "@/utils/updater";
 import {IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle} from "@ionic/vue";
+import { onBeforeMount, ref } from "vue";
 
-const emit = defineEmits<{(e:"back"):void}>();
+const emit = defineEmits<{(e:"back"):void, (e: "home"):void}>();
+const archive = useArchiveStore();
+
+const view = ref<number>(0);
+const version = ref<string>("");
+const logValue = ref<string>("");
+const filesize = ref<number>(0);
 
 const back = () => {
   emit("back");
 }
+
+async function flash() {
+  view.value = 1;
+  logValue.value = "Downloading file";
+  await updater.obj.getFirmware( archive.getArchive[archive.getShownI]);
+  logValue.value = "File recieved";
+  filesize.value = updater.obj.getFileSize();
+  logValue.value = "Starting to flash (0%)";
+  await updater.obj.flashFirmware((message: string) => {
+    logValue.value = message;
+  }).catch((reason) => {
+    logValue.value = reason;
+  });
+  // await updater.obj.flashFirmware();
+  // logValue.value = "Flash complete!";
+  view.value = 2;
+}
+
+function home() {
+  emit("home");
+}
+
+onBeforeMount(async () => {
+  version.value = await updater.obj.getBoardVersion();
+});
 </script>
 
 <template>
@@ -15,7 +49,7 @@ const back = () => {
       <div class="header-column">
         <ion-card-title>FLASH</ion-card-title>
         <ion-card-title>Board</ion-card-title>
-        <ion-card-subtitle>v1.1.1</ion-card-subtitle>
+        <ion-card-subtitle>{{ version }}</ion-card-subtitle>
       </div>
 <!--      <div style="flex-grow: 1"></div>-->
 <!--      <div>-->
@@ -24,10 +58,24 @@ const back = () => {
     </ion-card-header>
 
     <ion-card-content>
-      <p>v1.1.1 -> v1.1.2</p> <br>
-      <ion-button>Flash</ion-button>
+      <p>{{ version }} -> {{ archive.getArchive[archive.getShownI].title }}</p> <br>
+      
+      <!-- BEFORE FLASHING -->
+
+      <ion-button @click="flash" v-if="view==0">Flash</ion-button>
+      <ion-button @click="back" v-if="view==0">Cancel</ion-button>
+    
+      <!-- DURING FLASHING -->
+
+      <p v-if="view!=0">Status info</p><br />
+      <p v-if="view!=0"><strong>DO NOT CLOSE WHILE THE UPDATE IS RUNNING</strong></p><br />
+      <p v-if="view!=0">Size: {{ filesize }}</p>
+      <p v-if="view!=0">{{ logValue }}</p>
+    
+      <!-- AFTER FLASHING -->
+
+      <ion-button @click="home" v-if="view==2">Finish</ion-button>
 
-      <ion-button @click="back">Cancel</ion-button>
     </ion-card-content>
   </ion-card>
 </template>

src/components/HomeCard.vue

@@ -4,7 +4,7 @@
       <div class="header-column">
         <ion-card-title>HOME</ion-card-title>
         <ion-card-title>Board</ion-card-title>
-        <ion-card-subtitle>v1.1.1</ion-card-subtitle>
+        <ion-card-subtitle>{{ version }}</ion-card-subtitle>
       </div>
       <div style="flex-grow: 1"></div>
       <div>
@@ -13,24 +13,33 @@
     </ion-card-header>
 
     <ion-card-content>
-      <ion-button @click="update">Update</ion-button>
+      <ion-button @click="update" v-if="showUpdater">Update</ion-button>
       <br>
-      <ion-button @click="archive">View older versions</ion-button>
+      <ion-button @click="openArchive">View older versions</ion-button>
       <br>
       <ion-button @click="settings">Settings</ion-button>
     </ion-card-content>
   </ion-card>
 </template>
 <script setup lang="ts">
+import useArchiveStore from "@/stores/archive";
+import updater from "@/utils/updater";
 import {IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle} from "@ionic/vue";
+import { onBeforeMount, ref } from "vue";
 
 const emit = defineEmits<{(e: 'update'): void, (e: 'archive'): void, (e: "disconnect"): void, (e: "settings"): void}>();
 
+const archive = useArchiveStore();
+const showUpdater = ref<boolean>(false);
+
+const version = ref<string>("");
+
 const update = () => {
+  archive.setShownI(0);
   emit("update");
 };
 
-const archive = () => {
+const openArchive = () => {
   emit("archive");
 };
 
@@ -42,6 +51,10 @@ const settings = () => {
   emit("settings")
 }
 
+onBeforeMount(async () => {
+  version.value = await updater.obj.getBoardVersion();
+  showUpdater.value = await updater.obj.checkForUpdate();
+});
 </script>
 
 <style scoped>

src/components/ScanCard.vue

@@ -1,13 +1,32 @@
+/// <reference types="cordova-plugin-ble-central" />
 <script setup lang="ts">
-import {IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonButton, IonIcon, IonNote,  IonLabel, IonItem, IonList
+import useBluetoothStore from '@/stores/bluetooth';
+import {
+  IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonButton, IonIcon, IonNote, IonLabel, IonItem, IonList
 } from '@ionic/vue';
 import { chevronForward } from 'ionicons/icons';
+import { onBeforeMount, ref, watch } from 'vue';
 
-const emit = defineEmits<{(e: "connect"):void}>();
+const emit = defineEmits<{ (e: "connect"): void }>();
+const bleStore = useBluetoothStore();
 
-const connect = () => {
+const devices = ref<BLECentralPlugin.PeripheralData[]>([]);
+
+const connect = (device: BLECentralPlugin.PeripheralData) => {
+  bleStore.connect(device);
   emit("connect");
 }
+
+const scan = () => {
+  bleStore.scan();
+}
+
+onBeforeMount(async () => {
+  bleStore.enableBLE();
+});
+
+watch(() => bleStore.devices, (newValue) => {devices.value = newValue}, {immediate: true});
+
 </script>
 
 <template>
@@ -20,29 +39,28 @@ const connect = () => {
       </div>
       <div style="flex-grow: 1"></div>
       <div>
-        <ion-button>Scan</ion-button>
+        <ion-button @click="scan">Scan</ion-button>
       </div>
     </ion-card-header>
 
     <ion-card-content class="item-scroll">
-    <ion-list lines="full" :inset="true">
-      <ion-item button v-for="i in 10" :key="i" @click="connect">
-        <ion-label>
-          <strong>Device {{i}}</strong> <br>
-          <ion-note>EA-EA-EA-EA-EA</ion-note>
-        </ion-label>
-        <div slot="end" class="metadata-end-wrapper">
-          <ion-note>{{(i*Math.random()).toFixed(2)}}dB</ion-note>
-          <ion-icon color="medium" :icon="chevronForward"></ion-icon>
-        </div>
-      </ion-item>
-    </ion-list>
+      <ion-list lines="full" :inset="true">
+        <ion-item button v-for="(device, index) in devices" :key="index" @click="connect(device)">
+          <ion-label>
+            <strong>Device: {{ device.name }}</strong> <br>
+            <ion-note>{{ device.id }}</ion-note>
+          </ion-label>
+          <div slot="end" class="metadata-end-wrapper">
+            <ion-note>{{ device.rssi }} dB</ion-note>
+            <ion-icon color="medium" :icon="chevronForward"></ion-icon>
+          </div>
+        </ion-item>
+      </ion-list>
     </ion-card-content>
   </ion-card>
 </template>
 
 <style scoped>
-
 .two-column {
   display: flex;
   flex-direction: row;

src/components/SettingsCard.vue

@@ -1,8 +1,12 @@
 <script setup lang="ts">
 
-import {IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonInput, IonToggle} from "@ionic/vue";
+import {IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonInput} from "@ionic/vue";
+import useArchiveStore from "@/stores/archive";
+import {ref} from "vue";
 
 const emit = defineEmits<{(e: "disconnect"): void, (e: "back"): void}>();
+const archive = useArchiveStore();
+const url = ref<string>(archive.getUrl);
 
 const disconnect = () => {
   emit("disconnect")
@@ -11,6 +15,12 @@ const disconnect = () => {
 const back = () => {
   emit("back")
 }
+
+const setSource = () => {
+  console.log(url.value)
+  archive.setUrl(url.value);
+}
+
 </script>
 
 <template>
@@ -28,12 +38,8 @@ const back = () => {
     </ion-card-header>
 
     <ion-card-content>
-      <ion-input label="Source" placeholder="https://git.example.com/user/repo/releases.rss"></ion-input>
-      <ion-button>Set source</ion-button>
-      <br>
-      <br>
-      <ion-toggle>Allow pre-release versions</ion-toggle>
-      <br>
+      <ion-input label="Source" placeholder="https://git.example.com/user/repo/releases" v-model="url"></ion-input>
+      <ion-button @click="setSource">Set source</ion-button>
       <br>
       <ion-button @click="back">Back</ion-button>
     </ion-card-content>

src/main.ts

@@ -1,8 +1,8 @@
-import { createApp } from 'vue'
+import {createApp} from 'vue'
 import App from './App.vue'
 import router from './router';
 
-import { IonicVue } from '@ionic/vue';
+import {IonicVue} from '@ionic/vue';
 
 /* Core CSS required for Ionic components to work properly */
 import '@ionic/vue/css/core.css';
@@ -33,11 +33,13 @@ import '@ionic/vue/css/palettes/dark.system.css';
 
 /* Theme variables */
 import './theme/variables.css';
+import {createPinia} from "pinia";
 
 const app = createApp(App)
-  .use(IonicVue)
-  .use(router);
+    .use(IonicVue)
+    .use(router)
+    .use(createPinia());
 
 router.isReady().then(() => {
-  app.mount('#app');
+    app.mount('#app');
 });

src/stores/archive.ts

@@ -0,0 +1,37 @@
+import { defineStore } from "pinia";
+import type { versionNotes } from "@/utils/types";
+import updater from "@/utils/updater";
+
+const useArchiveStore = defineStore("archive", {
+    state: () => (
+        { archive: <versionNotes[]>[], shownI: 0}
+    ),
+    getters: {
+        getUrl(): string {
+            if (updater.obj.archiveURL == "/")
+                return ""
+            else 
+                return updater.obj.archiveURL;
+        },
+        getArchive(): versionNotes[] {
+            console.log(this.archive)
+            return this.archive;
+        },
+        getShownI(): number {
+            return this.shownI;
+        }
+    },
+    actions: {
+        async setUrl(value: string): Promise<void> {
+            // updater.obj = new Updater(value, "atom");
+            updater.obj.archiveURL = value;
+            updater.obj.feedType = "atom";
+            this.archive = await updater.obj.getArchive()
+        },
+        setShownI(value: number): void {
+            this.shownI = value;
+        }
+    }
+});
+
+export default useArchiveStore;

src/stores/bluetooth.ts

@@ -0,0 +1,66 @@
+/// <reference types="cordova-plugin-ble-central" />
+import { defineStore } from "pinia";
+import updater from "@/utils/updater";
+
+const useBluetoothStore = defineStore('bluetooth', {
+    state: () => (
+        { devices: <BLECentralPlugin.PeripheralData[]>[], device: <BLECentralPlugin.PeripheralData | undefined>{}}
+    ),
+    actions: {
+        async enableBLE(): Promise<boolean> {
+            return new Promise((resolve, reject) => {
+                ble.enable(
+                    () => {
+                    },
+                    () => {
+                        reject("Failed to enable");
+                    }
+                );
+                ble.isEnabled(
+                    () => {
+                        resolve(true);
+                    },
+                    () => {
+                        reject("Failed to enable");
+                    });
+            })
+        },
+        scan(): void {
+            this.devices = [];
+            ble.scan([], 5, (device: BLECentralPlugin.PeripheralData) => {
+                console.log(device);
+                this.devices.push(device);
+            }, (e) => {
+                console.log(e)
+            })
+        },
+        async connect(device: BLECentralPlugin.PeripheralData): Promise<boolean> {
+            return new Promise( (resolve, reject) => {
+                ble.connect(device.id,
+                    (data: BLECentralPlugin.PeripheralDataExtended) => {
+                        console.log(`Connected: ${data}`);
+                        updater.obj.setDeviceId(device.id);
+                        this.device = device;
+                        resolve(true); 
+                    },
+                    (error: string | BLECentralPlugin.BLEError) => {
+                        console.error(`Connection error: ${error}`);
+                        reject(false);
+                    }
+                );
+            });
+        },
+        async disconnect(): Promise<boolean> {
+            return new Promise((resolve, reject) => {
+                ble.disconnect(this.device?.id as string, () => {
+                    this.device = undefined;
+                    resolve(true);
+                }, (err: string | BLECentralPlugin.BLEError) => {
+                    reject(err);
+                })
+            })
+        }
+    }
+});
+
+export default useBluetoothStore;

src/utils/types.ts

@@ -0,0 +1,6 @@
+export type versionNotes = {
+    title: string;
+    date: Date | string;
+    link: string;
+    html: string;
+}

src/utils/updater.ts

@@ -0,0 +1,5 @@
+import Updater from "updaterweblibrary";
+
+const updater = {obj: new Updater()}
+
+export default updater;

src/views/HomePage.vue

@@ -13,12 +13,12 @@
         </ion-toolbar>
       </ion-header>
 
-      <home-card v-if="shownCard == 1" @archive="showArchive" @disconnect="showScan" @update="showDetails" @settings="showSettings"></home-card>
+      <home-card v-if="shownCard == 1" @archive="showArchive" @disconnect="disconnect" @update="showDetails" @settings="showSettings"></home-card>
       <scan-card v-else-if="shownCard == 0" @connect="goHome"></scan-card>
-      <details-card v-else-if="shownCard == 2" @back="goBack" @choose="showFlash"></details-card>
-      <archive-card v-else-if="shownCard == 3" @back="goBack" @details="showDetails"></archive-card>
-      <flash-card v-else-if="shownCard == 4" @back="goBack"></flash-card>
-      <settings-card v-else-if="shownCard == 5" @back="goBack"></settings-card>
+      <details-card v-else-if="shownCard == 2" @back="goBack" @choose="showFlash" @disconnect="disconnect"></details-card>
+      <archive-card v-else-if="shownCard == 3" @back="goBack" @details="showDetails" @disconnect="disconnect"></archive-card>
+      <flash-card v-else-if="shownCard == 4" @back="goBack" @home="goHome"></flash-card>
+      <settings-card v-else-if="shownCard == 5" @back="goBack" @disconnect="disconnect"></settings-card>
     </ion-content>
   </ion-page>
 </template>
@@ -32,10 +32,13 @@ import ArchiveCard from "@/components/ArchiveCard.vue";
 import FlashCard from "@/components/FlashCard.vue";
 import {ref} from "vue";
 import SettingsCard from "@/components/SettingsCard.vue";
+import useBluetoothStore from '@/stores/bluetooth';
 
 let prevCard = 0;
 const shownCard = ref<number>(0);
 
+const bleStore = useBluetoothStore();
+
 const showArchive = () => {
   prevCard = shownCard.value;
   shownCard.value = 3;
@@ -70,6 +73,11 @@ const showSettings = () => {
   prevCard = shownCard.value;
   shownCard.value = 5;
 }
+
+async function disconnect() {
+  await bleStore.disconnect();
+  showScan();
+}
 </script>
 
 <style scoped>

vite.config.js

@@ -0,0 +1,13 @@
+import vue from '@vitejs/plugin-vue'
+import path from "path";
+
+export default {
+  plugins: [
+     vue()
+  ],
+  resolve: {
+    alias: {
+        "@": path.resolve(__dirname, "./src")
+    }
+  }
+}

vite.config.ts

@@ -1,23 +0,0 @@
-/// <reference types="vitest" />
-
-import legacy from '@vitejs/plugin-legacy'
-import vue from '@vitejs/plugin-vue'
-import path from 'path'
-import { defineConfig } from 'vite'
-
-// https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [
-    vue(),
-    legacy()
-  ],
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src'),
-    },
-  },
-  test: {
-    globals: true,
-    environment: 'jsdom'
-  }
-})