From 04d929aae98f24d893ccabf7b39064fe484103cb Mon Sep 17 00:00:00 2001
From: Prad Nukala <prad@sonr.io>
Date: Tue, 10 Dec 2024 14:37:54 -0500
Subject: [PATCH] feat: implement passkey registration flow

---
 internal/database/sessions/models.go          | 23 ++++---------------
 internal/database/sessions/sqlite.go          |  1 -
 internal/gateway/handlers/index/views.templ   | 12 +++++-----
 .../gateway/handlers/index/views_templ.go     |  2 +-
 internal/gateway/handlers/register/data.go    | 20 +++++++++++++---
 .../gateway/handlers/register/forms.templ     |  5 ++--
 .../gateway/handlers/register/forms_templ.go  |  4 ++--
 7 files changed, 32 insertions(+), 35 deletions(-)

diff --git a/internal/database/sessions/models.go b/internal/database/sessions/models.go
index f92e1a629..4eeb7e235 100644
--- a/internal/database/sessions/models.go
+++ b/internal/database/sessions/models.go
@@ -16,27 +16,12 @@ var (
 	ErrUserNotFound      = echo.NewHTTPError(http.StatusNotFound, "User not found")
 )
 
-// Define the credential structure matching our frontend data
-type Credential struct {
-	ID                      string                 `json:"id"`
-	RawID                   string                 `json:"rawId"`
-	Type                    string                 `json:"type"`
-	AuthenticatorAttachment string                 `json:"authenticatorAttachment"`
-	Transports              []string               `json:"transports"`
-	ClientExtensionResults  map[string]interface{} `json:"clientExtensionResults"`
-	Response                struct {
-		AttestationObject string `json:"attestationObject"`
-		ClientDataJSON    string `json:"clientDataJSON"`
-	} `json:"response"`
-}
-
 type User struct {
 	gorm.Model
-	Address     string        `json:"address"`
-	Handle      string        `json:"handle"`
-	Name        string        `json:"name"`
-	CID         string        `json:"cid"`
-	Credentials []*Credential `json:"credentials"`
+	Address string `json:"address"`
+	Handle  string `json:"handle"`
+	Name    string `json:"name"`
+	CID     string `json:"cid"`
 }
 
 type Session struct {
diff --git a/internal/database/sessions/sqlite.go b/internal/database/sessions/sqlite.go
index 3a54def51..8bb73d528 100644
--- a/internal/database/sessions/sqlite.go
+++ b/internal/database/sessions/sqlite.go
@@ -20,7 +20,6 @@ func NewGormDB(env config.Env) (*gorm.DB, error) {
 	// Migrate the schema
 	db.AutoMigrate(&Session{})
 	db.AutoMigrate(&User{})
-
 	return db, nil
 }
 
diff --git a/internal/gateway/handlers/index/views.templ b/internal/gateway/handlers/index/views.templ
index 633808858..3f9fde21b 100644
--- a/internal/gateway/handlers/index/views.templ
+++ b/internal/gateway/handlers/index/views.templ
@@ -10,21 +10,21 @@ templ InitialView() {
 		@layout.Container() {
 			@text.Header("Sonr.ID", "The decentralized identity layer for the web.")
 			<div class="pt-1.5 mb-3 flex flex-col items-center justify-center h-full">
-				<sl-button hx-target="#container" hx-get="/register" hx-push-url="/register" type="button">
+				<sl-button size="large" hx-target="#container" hx-get="/register" hx-push-url="/register" type="button">
 					<sl-icon slot="prefix" library="sonr" name="sonr"></sl-icon>
 					Get Started
 					<sl-icon slot="suffix" library="sonr" name="arrow-right"></sl-icon>
 				</sl-button>
 			</div>
-			<div class="pt-5 flex flex-row items-center justify-center h-full gap-2">
-				<sl-button circle outline>
+			<div class="pt-4 flex flex-row items-center justify-center h-full gap-3">
+				<sl-button circle outline href="https://sonr.io">
 					<sl-icon name="home" library="sonr" label="Home"></sl-icon>
 				</sl-button>
-				<sl-button circle outline>
+				<sl-button circle outline href="https://onsonr.dev">
 					<sl-icon name="docs" library="sonr" label="Docs"></sl-icon>
 				</sl-button>
-				<sl-button circle outline>
-					<sl-icon name="question" label="About"></sl-icon>
+				<sl-button circle outline href="https://github.com/onsonr/sonr">
+					<sl-icon name="social-github" library="sonr" label="Open Source"></sl-icon>
 				</sl-button>
 			</div>
 		}
diff --git a/internal/gateway/handlers/index/views_templ.go b/internal/gateway/handlers/index/views_templ.go
index 0357b32b0..c8d1c5e9e 100644
--- a/internal/gateway/handlers/index/views_templ.go
+++ b/internal/gateway/handlers/index/views_templ.go
@@ -62,7 +62,7 @@ func InitialView() templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" <div class=\"pt-1.5 mb-3 flex flex-col items-center justify-center h-full\"><sl-button hx-target=\"#container\" hx-get=\"/register\" hx-push-url=\"/register\" type=\"button\"><sl-icon slot=\"prefix\" library=\"sonr\" name=\"sonr\"></sl-icon> Get Started <sl-icon slot=\"suffix\" library=\"sonr\" name=\"arrow-right\"></sl-icon></sl-button></div><div class=\"pt-5 flex flex-row items-center justify-center h-full gap-2\"><sl-button circle outline><sl-icon name=\"home\" library=\"sonr\" label=\"Home\"></sl-icon></sl-button> <sl-button circle outline><sl-icon name=\"docs\" library=\"sonr\" label=\"Docs\"></sl-icon></sl-button> <sl-button circle outline><sl-icon name=\"question\" label=\"About\"></sl-icon></sl-button></div>")
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" <div class=\"pt-1.5 mb-3 flex flex-col items-center justify-center h-full\"><sl-button size=\"large\" hx-target=\"#container\" hx-get=\"/register\" hx-push-url=\"/register\" type=\"button\"><sl-icon slot=\"prefix\" library=\"sonr\" name=\"sonr\"></sl-icon> Get Started <sl-icon slot=\"suffix\" library=\"sonr\" name=\"arrow-right\"></sl-icon></sl-button></div><div class=\"pt-4 flex flex-row items-center justify-center h-full gap-3\"><sl-button circle outline href=\"https://sonr.io\"><sl-icon name=\"home\" library=\"sonr\" label=\"Home\"></sl-icon></sl-button> <sl-button circle outline href=\"https://onsonr.dev\"><sl-icon name=\"docs\" library=\"sonr\" label=\"Docs\"></sl-icon></sl-button> <sl-button circle outline href=\"https://github.com/onsonr/sonr\"><sl-icon name=\"social-github\" library=\"sonr\" label=\"Open Source\"></sl-icon></sl-button></div>")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
diff --git a/internal/gateway/handlers/register/data.go b/internal/gateway/handlers/register/data.go
index 475dbf9d8..6317f6d54 100644
--- a/internal/gateway/handlers/register/data.go
+++ b/internal/gateway/handlers/register/data.go
@@ -6,9 +6,23 @@ import (
 	"net/http"
 
 	"github.com/labstack/echo/v4"
-	"github.com/onsonr/sonr/internal/database/sessions"
 )
 
+// Define the credential structure matching our frontend data
+type Credential struct {
+	Handle                  string            `json:"handle"`
+	ID                      string            `json:"id"`
+	RawID                   string            `json:"rawId"`
+	Type                    string            `json:"type"`
+	AuthenticatorAttachment string            `json:"authenticatorAttachment"`
+	Transports              string            `json:"transports"`
+	ClientExtensionResults  map[string]string `json:"clientExtensionResults"`
+	Response                struct {
+		AttestationObject string `json:"attestationObject"`
+		ClientDataJSON    string `json:"clientDataJSON"`
+	} `json:"response"`
+}
+
 type CreateProfileData struct {
 	TurnstileSiteKey string
 	FirstNumber      int
@@ -35,8 +49,8 @@ func (d CreateProfileData) IsHumanLabel() string {
 	return fmt.Sprintf("What is %d + %d?", d.FirstNumber, d.LastNumber)
 }
 
-func extractCredentialDescriptor(jsonString string) (*sessions.Credential, error) {
-	cred := &sessions.Credential{}
+func extractCredentialDescriptor(jsonString string) (*Credential, error) {
+	cred := &Credential{}
 	// Unmarshal the credential JSON
 	if err := json.Unmarshal([]byte(jsonString), cred); err != nil {
 		return nil, echo.NewHTTPError(http.StatusBadRequest, fmt.Sprintf("invalid credential format: %v", err))
diff --git a/internal/gateway/handlers/register/forms.templ b/internal/gateway/handlers/register/forms.templ
index 0e821497f..db6ce900d 100644
--- a/internal/gateway/handlers/register/forms.templ
+++ b/internal/gateway/handlers/register/forms.templ
@@ -4,7 +4,7 @@ import "github.com/onsonr/sonr/pkg/common/styles/layout"
 
 templ formCreateProfile(action string, method string, data CreateProfileData) {
 	<form action={ templ.SafeURL(action) } method={ method }>
-		<sl-card class="card-form gap-6 w-full max-w-2xl mx-auto px-4 sm:px-8">
+		<sl-card class="card-form gap-6 w-full max-w-xl">
 			<div slot="header">
 				<div class="w-full py-1">
 					<sl-progress-bar value="50"></sl-progress-bar>
@@ -63,7 +63,7 @@ templ formCreateProfile(action string, method string, data CreateProfileData) {
 templ formRegisterPasskey(action, method string, data RegisterPasskeyData) {
 	<form action={ templ.SafeURL(action) } method={ method } id="passkey-form">
 		<input type="hidden" name="credential" id="credential-data" required/>
-		<sl-card class="card-form gap-4 max-w-lg">
+		<sl-card class="card-form gap-4 max-w-xl">
 			<div slot="header">
 				<div class="w-full py-2">
 					@sonrProfile(data.Address, data.Name, data.Handle, data.CreationBlock)
@@ -123,4 +123,3 @@ templ formRegisterPasskey(action, method string, data RegisterPasskeyData) {
 		</sl-card>
 	</form>
 }
-
diff --git a/internal/gateway/handlers/register/forms_templ.go b/internal/gateway/handlers/register/forms_templ.go
index b8f691111..c0695896e 100644
--- a/internal/gateway/handlers/register/forms_templ.go
+++ b/internal/gateway/handlers/register/forms_templ.go
@@ -53,7 +53,7 @@ func formCreateProfile(action string, method string, data CreateProfileData) tem
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"><sl-card class=\"card-form gap-6 w-full max-w-2xl mx-auto px-4 sm:px-8\"><div slot=\"header\"><div class=\"w-full py-1\"><sl-progress-bar value=\"50\"></sl-progress-bar></div></div><div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\"><sl-input name=\"first_name\" placeholder=\"Satoshi\" type=\"text\" label=\"First Name\" required autofocus></sl-input> <sl-input name=\"last_name\" placeholder=\"N\" maxlength=\"1\" type=\"text\" label=\"Last Initial\"></sl-input></div>")
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"><sl-card class=\"card-form gap-6 w-full max-w-xl\"><div slot=\"header\"><div class=\"w-full py-1\"><sl-progress-bar value=\"50\"></sl-progress-bar></div></div><div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\"><sl-input name=\"first_name\" placeholder=\"Satoshi\" type=\"text\" label=\"First Name\" required autofocus></sl-input> <sl-input name=\"last_name\" placeholder=\"N\" maxlength=\"1\" type=\"text\" label=\"Last Initial\"></sl-input></div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -133,7 +133,7 @@ func formRegisterPasskey(action, method string, data RegisterPasskeyData) templ.
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" id=\"passkey-form\"><input type=\"hidden\" name=\"credential\" id=\"credential-data\" required> <sl-card class=\"card-form gap-4 max-w-lg\"><div slot=\"header\"><div class=\"w-full py-2\">")
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" id=\"passkey-form\"><input type=\"hidden\" name=\"credential\" id=\"credential-data\" required> <sl-card class=\"card-form gap-4 max-w-xl\"><div slot=\"header\"><div class=\"w-full py-2\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}