save "create sync group" table in database

internal/site/templates/page_bodies/accounts/{acctID}/inventory.html.tmpl

@@ -1,19 +1,55 @@
 {{- .Auth.ByMatchingAccountID 2 }}
 
+{{- $acctID := .Identity.Account.AccountID }}
+{{- $stores := .Accounts.GetShops $acctID -}}
+
+
 {{- define "title" }} Inventory++ {{ end }}
 
 <h1 class="text-center mb-[0.5em]">Inventory</h1>
 
-<h2 class="text-center mb-[0.5em]">Sync Stores</h2>
-
-{{ $acctID := .Identity.Account.AccountID }}
-{{ $stores := .Accounts.GetShops $acctID }}
+<h2 class="text-center mb-[0.5em]">Synced Listings</h2>
 
 <section class="w-full flex flex-col items-center">
 	<h3>
-		Draft 2
+		Create a Sync Group
 	</h3>
+	<h4>
+		(Draft 2)
+	</h4>
 	{{ componentBody "accounts/{acctID}/inventory/sync-table-v2" "dot" . }}
+
+	<div>
+		{{ componentBody "button-dev"
+			"HXPost" (printf "/accounts/%d/inventory/sync-groups/draft/listings" $acctID)
+			"HXTarget" "previous table > tbody"
+			"HXSwap" "beforeend"
+			"Class" "mt-[1em] mb-[1em]"
+			"Text" "Add Listing"
+			"_" `
+				on click
+					send rowUpdated to the first <tbody/> in #inventory-table-2
+			`
+		}}
+
+		{{/* TODO: enable the button when all listings are filled and there are at least two listings */}}
+		{{/* TODO: save the listings as a sync group on click */}}
+		{{ componentBody "button-dev"
+			"ID" "create-sync-group-button"
+			"HXPost" (printf "/accounts/%d/sync-groups" $acctID)
+			"Class" "mt-[1em] mb-[1em]"
+			"Text" "Save Sync Group"
+			"Disabled" true
+			"_" `
+				on setDisabled(disabled)
+					if disabled then
+						add @disabled to me
+					else
+						remove @disabled from me
+					end
+			`
+		}}
+	</div>
 </section>
 
 <section class="w-full flex flex-col items-center">
@@ -28,12 +64,11 @@
 </section>
 
 <section class="w-full flex justify-center mt-[1em]">
-	<button
-		class="border-thin bg-card rounded-sm p-[0.5em] font-semibold cursor-pointer hover:underline hover:bg-accent"
-		hx-get="/accounts/{{$acctID}}/inventory/sync-table/new-row"
-		hx-target="#inventory-table > tbody"
-		hx-swap="beforeend"
-	>
-		Add Row
-	</button>
+	{{ componentBody "button-dev"
+		"HXGet" (printf "/accounts/%d/inventory/sync-table/new-row" $acctID)
+		"HXTarget" "#inventory-table > tbody"
+		"HXSwap" "beforeend"
+		"Class" "mt-[1em] mb-[1em]"
+		"Text" "Add Row"
+	}}
 </section>