Merge pull request #202 from mackenziesalinas/Adding-to-Manager-Butto…

…n-Features

Updated Issue #181: Updated Manager Button Features

src/pages/manager/components/bootLoader.tsx

@@ -1,5 +1,9 @@
 import React, { ReactElement } from 'react';
-import { sendCommandString, readGetNone } from '../controls/mainControls';
+import {
+  sendCommandString,
+  readGetNone,
+  MainControls,
+} from '../controls/mainControls';
 
 async function bootLoader() {
   //Sends the bootloader command to the charachorder via the serial API
@@ -9,13 +13,24 @@ async function bootLoader() {
   await readGetNone();
 }
 
+function successfulBootLoader() {
+  if (MainControls.serialPort != null) {
+    alert(
+      'Your CharaChorder will now appear as an external storage device on your computer’s file explorer or Finder app. It might be named one of the following: “Arduino”, “Seeduino”, “TinyUSB” or “CharaChorder X.',
+    );
+  } else {
+    alert('There is no serial connection to bootload at this moment.');
+  }
+}
+
 export function BootLoaderButton(): ReactElement {
   return (
     <React.Fragment>
       <button
         className="sc-bYwzuL text-white rounded p-2 mb-4 inline-block ml-2 bg-[#333] hover:bg-[#3b3b3b] active:bg-[#222]"
         color="pink"
         onClick={() => bootLoader()}
+        onClickCapture={() => successfulBootLoader()}
       >
         BootLoader{' '}
       </button>

src/pages/manager/components/disconnect.tsx

@@ -33,6 +33,14 @@ export async function disconnectSerialConnection() {
   }
 }
 
+function successfulDisconnect() {
+  if (MainControls.serialPort != null) {
+    alert('Successfully disconnected from serial port!');
+  } else {
+    alert('There is no serial connection to disconnect from at this moment.');
+  }
+}
+
 export function DisconnectButton(): ReactElement {
   return (
     <React.Fragment>
@@ -44,6 +52,7 @@ export function DisconnectButton(): ReactElement {
         className="sc-bYwzuL text-white rounded p-2 mb-4 inline-block ml-2 bg-[#333] hover:bg-[#3b3b3b] active:bg-[#222] position-absolute"
         color="pink"
         onClick={() => disconnectSerialConnection()}
+        onClickCapture={() => successfulDisconnect()}
       >
         Disconnect{' '}
       </button>