fix: updates to make dashboard work

.air.toml

@@ -4,8 +4,8 @@ tmp_dir = "tmp"
 
 [build]
   args_bin = []
-  bin = "./tmp/main"
-  cmd = "go build -o ./tmp/main ./cmd/main.go"
+  bin = "./tmp/main.exe"
+  cmd = "go build -o ./tmp/main.exe ./cmd/main.go"
   delay = 1000
   exclude_dir = ["assets", "tmp", "vendor", "testdata"]
   exclude_file = []
@@ -21,7 +21,7 @@ tmp_dir = "tmp"
   poll = false
   poll_interval = 0
   post_cmd = []
-  pre_cmd = []
+  pre_cmd = ["tailwindcss.exe -i ./cmd/css/input.css -o ./cmd/css/output.css"]
   rerun = false
   rerun_delay = 500
   send_interrupt = false

README.md

@@ -15,6 +15,11 @@ Running the Console application will automatically launch the UI in the default
 
 ### Prequisites
 - [Golang](https://go.dev/dl/)
+- [Air](https://github.com/cosmtrek/air)
+``` bash
+# With go 1.22 or higher:
+go install github.com/cosmtrek/air@latest
+```
 - [Tailwind](https://tailwindcss.com/)
 ``` bash
 # Example for win x64

cmd/main.go

@@ -6,9 +6,7 @@ import (
 	"log"
 	"net/http"
 	"os"
-	"os/exec"
 	"os/signal"
-	"runtime"
 	"syscall"
 	"time"
 
@@ -61,13 +59,15 @@ func main() {
 	middleware := internal.Tracing(nextRequestID)(internal.Logging(logger)(router))
 	port := gotoolbox.GetEnvWithDefault("PORT", "8080")
 	logger.Println("listening on http://localhost:" + port)
-	url := "http://localhost:" + port + "/devices"
+
+	// TODO: Setup development mode to not launch a new browser on changes
+	// url := "http://localhost:" + port + "/devices"
 	// Since ListenAndServe is blocking launching browser before the server is up.  Potential race condition that should be fixed.
-	browserError := openBrowser(url)
+	// browserError := openBrowser(url)
 
-	if browserError != nil {
-		panic(browserError)
-	}
+	// if browserError != nil {
+	// 	panic(browserError)
+	// }
 	if err := http.ListenAndServe("localhost:"+port, middleware); err != nil {
 		logger.Println("http.ListenAndServe():", err)
 		os.Exit(1)
@@ -84,21 +84,22 @@ func handleSigTerms() {
 	}()
 }
 
-func openBrowser(url string) error {
-	var cmd string
-	var args []string
-
-	switch runtime.GOOS {
-	case "darwin":
-		cmd = "open"
-		args = []string{url}
-	case "windows":
-		cmd = "cmd"
-		args = []string{"/c", "start", url}
-	default:
-		cmd = "xdg-open"
-		args = []string{url}
-	}
+// TODO enable for production
+// func openBrowser(url string) error {
+// 	var cmd string
+// 	var args []string
 
-	return exec.Command(cmd, args...).Start()
-}
+// 	switch runtime.GOOS {
+// 	case "darwin":
+// 		cmd = "open"
+// 		args = []string{url}
+// 	case "windows":
+// 		cmd = "cmd"
+// 		args = []string{"/c", "start", url}
+// 	default:
+// 		cmd = "xdg-open"
+// 		args = []string{url}
+// 	}
+
+// 	return exec.Command(cmd, args...).Start()
+// }

internal/dashboard/routes.go

@@ -5,8 +5,6 @@ import (
 	"net/http"
 
 	"github.com/jritsema/go-htmx-starter/internal"
-	"github.com/jritsema/go-htmx-starter/internal/devices"
-	"github.com/jritsema/go-htmx-starter/internal/profiles"
 	"github.com/jritsema/go-htmx-starter/pkg/templates"
 	"github.com/jritsema/go-htmx-starter/pkg/webtools"
 	"github.com/jritsema/gotoolbox/web"
@@ -35,16 +33,9 @@ func NewDashboard(router *http.ServeMux) DashboardPages {
 	return dp
 }
 
-type DashboardContent struct {
-	devices  []devices.Device
-	profiles []profiles.Profile
-}
+type DashboardContent struct{}
 
 func (dp DashboardPages) Index(r *http.Request) *web.Response {
 	dc := DashboardContent{}
-	dt := devices.DeviceThing{}
-	dc.devices = dt.GetDevices()
-	pt := profiles.ProfileThing{}
-	dc.profiles = pt.GetProfiles()
 	return webtools.HTML(r, http.StatusOK, dp.html, "dashboard/index.html", dc, nil)
 }

internal/devices/routes.go

@@ -30,8 +30,8 @@ func NewDevices(db *bbolt.DB, router *http.ServeMux) DeviceThing {
 	var err error
 
 	funcMap := template.FuncMap{
-		"ProvisioningModeLookup":  ProvisioningModeLookup,
-		"ProvisioningStateLookup": ProvisioningStateLookup,
+		"ProvisioningModeLookup":  amt.ProvisioningModeLookup,
+		"ProvisioningStateLookup": amt.ProvisioningStateLookup,
 	}
 	html, err := templates.TemplateParseFSRecursive(internal.TemplateFS, "/devices", ".html", true, funcMap)
 	if err != nil {

internal/templates/dashboard/index.html

@@ -1,21 +1,35 @@
-<div class="flex justify-between">
+<div class="p-4">
+  <h1 class="text-3xl font-semibold mb-4">Welcome to Console!</h1>
+  <h3 class="text-lg font-semibold mb-4 text-gray-500">Your centralized platform for managing Intel® Active Management Technology (AMT) devices within enterprise environments.</h3>
+
+  <!-- <div class="flex flex-row">
     <div class="w-1/3 p-4">
       <div class="bg-gray-200 p-6 rounded-lg">
         <h2 class="text-lg font-semibold mb-4">Devices</h2>
-        <!-- Content for devices box -->
-      </div>
     </div>
     <div class="w-1/3 p-4">
       <div class="bg-gray-200 p-6 rounded-lg">
         <h2 class="text-lg font-semibold mb-4">Profiles</h2>
-        <!-- Content for profiles box -->
       </div>
     </div>
     <div class="w-1/3 p-4">
       <div class="bg-gray-200 p-6 rounded-lg">
         <h2 class="text-lg font-semibold mb-4">Certificates</h2>
-        <!-- Content for certificates box -->
       </div>
     </div>
+  </div> -->
+
+  <div class="flex bg-gray-200 p-6 rounded-lg w-full">
+    Our console is expertly designed to streamline the administration of AMT-equipped devices, offering a comprehensive suite of out-of-band management features directly over your local network.
+  </br></br>
+    With the AMT Console, you gain unparalleled control and visibility over your devices. Explore detailed device information at a glance, initiate secure connections via Keyboard, Video, Mouse (KVM) for real-time interaction, and leverage a range of out-of-band management capabilities to ensure your devices are always performing at their peak, regardless of their power state or operating system status.
+  </br></br>
+    This console is specifically tailored for IT professionals and system administrators in enterprise settings, facilitating direct connections to AMT devices without the need for internet-based interactions. It's the perfect tool for enhancing your operational efficiency, ensuring security, and managing your devices more effectively.
+  <!-- </br></br>
+    If your management needs extend beyond local network boundaries and require cloud-based solutions for connecting to devices over the internet, we recommend exploring the Open AMT Cloud Toolkit on GitHub at <a href="https://github.com/open-amt-cloud-toolkit">Open AMT Cloud Toolkit</a>. This toolkit complements our AMT Console by offering flexible, cloud-based management options for a truly comprehensive AMT device management ecosystem.
+  </br></br>
+    Dive into the AMT Console today and discover how our robust, secure, and user-friendly platform can transform your enterprise device management strategy.-->
+  </div> 
+
   </div>
 

internal/templates/devices/device.html

@@ -1,4 +1,4 @@
-<nav class="bg-gray-400 px-8">
+<nav class="bg-gray-400 -m-4 px-4">
     <div class="flex h-16 items-center">
         <div class="w-1/2 flex justify-start">
             <h1 class="text-3xl">{{.Name}}</h1>

internal/templates/devices/devices.html

@@ -1,7 +1,5 @@
-<div id="devices">
-  <div class="flex flex-col">
-    <div class="overflow-x-auto sm:-mx-6 lg:-mx-8">
-      <div class="inline-block min-w-full sm:px-6 lg:px-8">
+  <div class="flex flex-col w-full">
+
         <div class="overflow-hidden">
 
           <div id="errors">
@@ -21,7 +19,6 @@
             </tbody>
           </table>
         </div>
-      </div>
-    </div>
+
   </div>
-</div>
+

internal/templates/devices/index.html

@@ -1,4 +1,5 @@
-<div class="flex flex-row w-full">
+<div class="flex flex-row w-full flex-wrap">
+
     <div class="flex justify-start w-1/2">
         <h1 class="text-3xl">Devices</h1>
     </div>
@@ -8,6 +9,10 @@ <h1 class="text-3xl">Devices</h1>
             Add Device
         </button>
     </div>
+
+    <div class="flex w-full">
+        {{ template "devices/devices.html" . }}
+    </div>
 </div>
-<br />
-<div>{{ template "devices/devices.html" . }}</div>
+
+

internal/templates/devices/row-add.html

@@ -1,29 +1,29 @@
 <tr id="datarow-add" class="border-b dark:border-neutral-500">
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
       data-include-add="" name="name" placeholder="Device Name" value="" />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
       data-include-add="" name="address" placeholder="IP Address or FQDN" value="" />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
       data-include-add="" name="username" placeholder="Username" value="" />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
       data-include-add="" name="password" placeholder="Password" value="" />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input type="checkbox" data-include-add="" name="usetls" title="UseTLS" />
     Use TLS
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input type="checkbox" data-include-add="" name="selfsignedallowed" title="SelfSignedAllowed" />
     Self-Signed OK
   </td>

internal/templates/devices/row-edit.html

@@ -1,5 +1,5 @@
 <tr id="datarow-{{.Id}}" class="border-b dark:border-neutral-500">
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input
       type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
@@ -9,7 +9,7 @@
       value="{{.Name}}"
     />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input
       type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
@@ -19,7 +19,7 @@
       value="{{.Address}}"
     />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input
       type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
@@ -29,7 +29,7 @@
       value=""
     />
   </td>
-  <td class="whitespace-nowrap px-6 py-4 static">
+  <td class="whitespace-nowrap px-1 py-4 static">
     <input
       type="text"
       class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
@@ -39,7 +39,7 @@
       value=""
     />
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input
       type="checkbox"
       data-include-edit="{{.Id}}"
@@ -49,7 +49,7 @@
     />
     Use TLS
   </td>
-  <td class="whitespace-nowrap px-6 py-4">
+  <td class="whitespace-nowrap px-1 py-4">
     <input
       type="checkbox"
       data-include-edit="{{.Id}}"

internal/templates/devices/row.html

@@ -1,6 +1,6 @@
 <tr id="datarow-{{.Id}}" class="border-b dark:border-neutral-500">
-  <td class="whitespace-nowrap px-6 py-4">{{.Name}}</td>
-  <td class="whitespace-nowrap px-6 py-4">{{.Address}}</td>
+  <td class="whitespace-nowrap py-4">{{.Name}}</td>
+  <td class="whitespace-nowrap py-4">{{.Address}}</td>
   <td class="whitespace-nowrap px-1 py-1">
     <a
       hx-get="/device/connect/{{.Id}}"

internal/templates/devices/wsman-explorer/class-select.html

@@ -1,5 +1,5 @@
 <label for="class-selector" class="w-1/2">WSMAN Class:</label>
-<select id="class-selector" class="w-1/2" data-include-add="" name="class-selector" title="class-selector" hx-get="device/ws-methods/" hx-trigger="change" hx-target="#wsman-explorer-method">
+<select id="class-selector" class="w-1/2" data-include-add="" name="class-selector" title="class-selector" hx-get="/device/ws-methods/" hx-trigger="change" hx-target="#wsman-explorer-method">
     <option value="" selected disabled>Select an option</option>
     {{range .}}
     <option>{{.Name}}</option>