Added UI block for unsupported connection methods (#39)

* Initial commit

* Removed annoying space

* Updated unneeded imports

src/components/NewDevice.tsx

@@ -1,4 +1,4 @@
-import type React from "react";
+import React, { useState } from "react";
 
 import { FiBluetooth, FiTerminal, FiWifi } from "react-icons/fi";
 
@@ -8,23 +8,26 @@ import { HTTP } from "./PageComponents/Connect/HTTP.js";
 import { Serial } from "./PageComponents/Connect/Serial.js";
 
 export const NewDevice = () => {
-  const tabs: TabType[] = [
+  const [tabs, _setTabs] = useState<TabType[]>([
     {
       name: "BLE",
       icon: <FiBluetooth className="h-4" />,
       element: BLE,
+      disabled: !navigator.bluetooth
     },
     {
       name: "HTTP",
       icon: <FiWifi className="h-4" />,
       element: HTTP,
+      disabled: false
     },
     {
       name: "Serial",
       icon: <FiTerminal className="h-4" />,
       element: Serial,
-    },
-  ];
+      disabled: !navigator.serial
+    }
+  ]);
 
   return (
     <div className="m-auto h-96 w-96">