refactor: move vault package to app directory

app/gateway/config/schema.go

@@ -4,8 +4,8 @@ import (
 	"reflect"
 	"strings"
 
+	"github.com/onsonr/sonr/app/vault/types"
 	"github.com/onsonr/sonr/pkg/common/models"
-	"github.com/onsonr/sonr/pkg/vault/types"
 )
 
 // DefaultSchema returns the default schema

app/gateway/config/vault.go

@@ -5,7 +5,7 @@ import (
 
 	"github.com/ipfs/boxo/files"
 	"github.com/onsonr/sonr/app/gateway/config/internal"
-	"github.com/onsonr/sonr/pkg/vault/types"
+	"github.com/onsonr/sonr/app/vault/types"
 )
 
 const SchemaVersion = 1

app/vault/fetch.go

@@ -0,0 +1,211 @@
+//go:build js && wasm
+// +build js,wasm
+
+package vault
+
+import (
+	"bytes"
+	"fmt"
+	"io"
+	"net/http"
+	"net/http/httptest"
+	"strings"
+	"sync"
+	"syscall/js"
+)
+
+var (
+	// Global buffer pool to reduce allocations
+	bufferPool = sync.Pool{
+		New: func() interface{} {
+			return new(bytes.Buffer)
+		},
+	}
+
+	// Cached JS globals
+	jsGlobal     = js.Global()
+	jsUint8Array = jsGlobal.Get("Uint8Array")
+	jsResponse   = jsGlobal.Get("Response")
+	jsPromise    = jsGlobal.Get("Promise")
+	jsWasmHTTP   = jsGlobal.Get("wasmhttp")
+)
+
+// ServeFetch serves HTTP requests with optimized handler management
+func ServeFetch(handler http.Handler) func() {
+	h := handler
+	if h == nil {
+		h = http.DefaultServeMux
+	}
+
+	// Optimize prefix handling
+	prefix := strings.TrimRight(jsWasmHTTP.Get("path").String(), "/")
+	if prefix != "" {
+		mux := http.NewServeMux()
+		mux.Handle(prefix+"/", http.StripPrefix(prefix, h))
+		h = mux
+	}
+
+	// Create request handler function
+	cb := js.FuncOf(func(_ js.Value, args []js.Value) interface{} {
+		promise, resolve, reject := newPromiseOptimized()
+
+		go handleRequest(h, args[1], resolve, reject)
+
+		return promise
+	})
+
+	jsWasmHTTP.Call("setHandler", cb)
+	return cb.Release
+}
+
+// handleRequest processes the request with panic recovery
+func handleRequest(h http.Handler, jsReq js.Value, resolve, reject func(interface{})) {
+	defer func() {
+		if r := recover(); r != nil {
+			var errMsg string
+			if err, ok := r.(error); ok {
+				errMsg = fmt.Sprintf("wasmhttp: panic: %+v", err)
+			} else {
+				errMsg = fmt.Sprintf("wasmhttp: panic: %v", r)
+			}
+			reject(errMsg)
+		}
+	}()
+
+	recorder := newResponseRecorder()
+	h.ServeHTTP(recorder, buildRequest(jsReq))
+	resolve(recorder.jsResponse())
+}
+
+// buildRequest creates an http.Request from JS Request
+func buildRequest(jsReq js.Value) *http.Request {
+	// Get request body
+	arrayBuffer, err := awaitPromiseOptimized(jsReq.Call("arrayBuffer"))
+	if err != nil {
+		panic(err)
+	}
+
+	// Create body buffer
+	jsBody := jsUint8Array.New(arrayBuffer)
+	bodyLen := jsBody.Get("length").Int()
+	body := make([]byte, bodyLen)
+	js.CopyBytesToGo(body, jsBody)
+
+	// Create request
+	req := httptest.NewRequest(
+		jsReq.Get("method").String(),
+		jsReq.Get("url").String(),
+		bytes.NewReader(body),
+	)
+
+	// Set headers efficiently
+	headers := jsReq.Get("headers")
+	headersIt := headers.Call("entries")
+	for {
+		entry := headersIt.Call("next")
+		if entry.Get("done").Bool() {
+			break
+		}
+		pair := entry.Get("value")
+		req.Header.Set(pair.Index(0).String(), pair.Index(1).String())
+	}
+
+	return req
+}
+
+// ResponseRecorder with optimized buffer handling
+type ResponseRecorder struct {
+	*httptest.ResponseRecorder
+	buffer *bytes.Buffer
+}
+
+func newResponseRecorder() *ResponseRecorder {
+	return &ResponseRecorder{
+		ResponseRecorder: httptest.NewRecorder(),
+		buffer:           bufferPool.Get().(*bytes.Buffer),
+	}
+}
+
+// jsResponse creates a JS Response with optimized memory usage
+func (rr *ResponseRecorder) jsResponse() js.Value {
+	defer func() {
+		rr.buffer.Reset()
+		bufferPool.Put(rr.buffer)
+	}()
+
+	res := rr.Result()
+	defer res.Body.Close()
+
+	// Prepare response body
+	body := js.Undefined()
+	if res.ContentLength != 0 {
+		if _, err := io.Copy(rr.buffer, res.Body); err != nil {
+			panic(err)
+		}
+		bodyBytes := rr.buffer.Bytes()
+		body = jsUint8Array.New(len(bodyBytes))
+		js.CopyBytesToJS(body, bodyBytes)
+	}
+
+	// Prepare response init object
+	init := make(map[string]interface{}, 3)
+	if res.StatusCode != 0 {
+		init["status"] = res.StatusCode
+	}
+
+	if len(res.Header) > 0 {
+		headers := make(map[string]interface{}, len(res.Header))
+		for k, v := range res.Header {
+			if len(v) > 0 {
+				headers[k] = v[0]
+			}
+		}
+		init["headers"] = headers
+	}
+
+	return jsResponse.New(body, init)
+}
+
+// newPromiseOptimized creates a new JavaScript Promise with optimized callback handling
+func newPromiseOptimized() (js.Value, func(interface{}), func(interface{})) {
+	var (
+		resolve     func(interface{})
+		reject      func(interface{})
+		promiseFunc = js.FuncOf(func(_ js.Value, args []js.Value) interface{} {
+			resolve = func(v interface{}) { args[0].Invoke(v) }
+			reject = func(v interface{}) { args[1].Invoke(v) }
+			return js.Undefined()
+		})
+	)
+	defer promiseFunc.Release()
+
+	return jsPromise.New(promiseFunc), resolve, reject
+}
+
+// awaitPromiseOptimized waits for Promise resolution with optimized channel handling
+func awaitPromiseOptimized(promise js.Value) (js.Value, error) {
+	done := make(chan struct{})
+	var (
+		result js.Value
+		err    error
+	)
+
+	thenFunc := js.FuncOf(func(_ js.Value, args []js.Value) interface{} {
+		result = args[0]
+		close(done)
+		return nil
+	})
+	defer thenFunc.Release()
+
+	catchFunc := js.FuncOf(func(_ js.Value, args []js.Value) interface{} {
+		err = js.Error{Value: args[0]}
+		close(done)
+		return nil
+	})
+	defer catchFunc.Release()
+
+	promise.Call("then", thenFunc).Call("catch", catchFunc)
+	<-done
+
+	return result, err
+}

app/vault/handlers/accounts_handler.go

@@ -0,0 +1 @@
+package handlers

app/vault/handlers/authorization_handler.go

@@ -0,0 +1,23 @@
+package handlers
+
+import (
+	"github.com/labstack/echo/v4"
+)
+
+func GrantAuthorization(e echo.Context) error {
+	// Implement authorization endpoint using passkey authentication
+	// Store session data in cache
+	return nil
+}
+
+func GetJWKS(e echo.Context) error {
+	// Implement token endpoint
+	// Use cached session data for validation
+	return nil
+}
+
+func GetToken(e echo.Context) error {
+	// Implement token endpoint
+	// Use cached session data for validation
+	return nil
+}

app/vault/handlers/connect_handler.go

@@ -0,0 +1,7 @@
+package handlers
+
+import "github.com/labstack/echo/v4"
+
+func HandleConnect(c echo.Context) error {
+	return nil
+}

app/vault/handlers/credentials_handler.go

@@ -0,0 +1,72 @@
+package handlers
+
+import (
+	"github.com/go-webauthn/webauthn/protocol"
+	"github.com/labstack/echo/v4"
+)
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                    Login Handlers                         │
+// ╰───────────────────────────────────────────────────────────╯
+
+// LoginSubjectCheck handles the login subject check.
+func LoginSubjectCheck(e echo.Context) error {
+	return e.JSON(200, "HandleCredentialAssertion")
+}
+
+// LoginSubjectStart handles the login subject start.
+func LoginSubjectStart(e echo.Context) error {
+	opts := &protocol.PublicKeyCredentialRequestOptions{
+		UserVerification: "preferred",
+		Challenge:        []byte("challenge"),
+	}
+	return e.JSON(200, opts)
+}
+
+// LoginSubjectFinish handles the login subject finish.
+func LoginSubjectFinish(e echo.Context) error {
+	var crr protocol.CredentialAssertionResponse
+	if err := e.Bind(&crr); err != nil {
+		return err
+	}
+	return e.JSON(200, crr)
+}
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                   Register Handlers                       │
+// ╰───────────────────────────────────────────────────────────╯
+
+// RegisterSubjectCheck handles the register subject check.
+func RegisterSubjectCheck(e echo.Context) error {
+	subject := e.FormValue("subject")
+	return e.JSON(200, subject)
+}
+
+// RegisterSubjectStart handles the register subject start.
+func RegisterSubjectStart(e echo.Context) error {
+	// Get subject and address
+	// subject := e.FormValue("subject")
+
+	// Get challenge
+
+	return nil
+}
+
+// RegisterSubjectFinish handles the register subject finish.
+func RegisterSubjectFinish(e echo.Context) error {
+	// Deserialize the JSON into a temporary struct
+	var ccr protocol.CredentialCreationResponse
+	if err := e.Bind(&ccr); err != nil {
+		return err
+	}
+	//
+	// // Parse the CredentialCreationResponse
+	// parsedData, err := ccr.Parse()
+	// if err != nil {
+	// 	return e.JSON(500, err.Error())
+	// }
+	//
+	// // Create the Credential
+	// // credential := orm.NewCredential(parsedData, e.Request().Host, "")
+	return e.JSON(201, ccr)
+}

app/vault/handlers/dash_handler.go

@@ -0,0 +1,11 @@
+package handlers
+
+import (
+	"net/http"
+
+	"github.com/labstack/echo/v4"
+)
+
+func HandleDash(c echo.Context) error {
+	return c.Render(http.StatusOK, "index.templ", nil)
+}

app/vault/handlers/index_handler.go

@@ -0,0 +1,48 @@
+package handlers
+
+import (
+	"net/http"
+
+	"github.com/labstack/echo/v4"
+	session "github.com/onsonr/sonr/app/vault/internal"
+	"github.com/onsonr/sonr/app/vault/internal/pages/index"
+	"github.com/onsonr/sonr/pkg/common/response"
+)
+
+func HandleIndex(c echo.Context) error {
+	if isInitial(c) {
+		return response.TemplEcho(c, index.InitialView())
+	}
+	if isExpired(c) {
+		return response.TemplEcho(c, index.ReturningView())
+	}
+	return c.Render(http.StatusOK, "index.templ", nil)
+}
+
+// ╭─────────────────────────────────────────────────────────╮
+// │                    Utility Functions                    │
+// ╰─────────────────────────────────────────────────────────╯
+
+// Initial users have no authorization, user handle, or vault address
+func isInitial(c echo.Context) bool {
+	noAuth := !session.HasAuthorization(c)
+	noUserHandle := !session.HasUserHandle(c)
+	noVaultAddress := !session.HasVaultAddress(c)
+	return noUserHandle && noVaultAddress && noAuth
+}
+
+// Expired users have either a user handle or vault address
+func isExpired(c echo.Context) bool {
+	noAuth := !session.HasAuthorization(c)
+	hasUserHandle := session.HasUserHandle(c)
+	hasVaultAddress := session.HasVaultAddress(c)
+	return noAuth && hasUserHandle || noAuth && hasVaultAddress
+}
+
+// Returning users have a valid authorization, and either a user handle or vault address
+func isReturning(c echo.Context) bool {
+	hasAuth := session.HasAuthorization(c)
+	hasUserHandle := session.HasUserHandle(c)
+	hasVaultAddress := session.HasVaultAddress(c)
+	return hasAuth && (hasUserHandle || hasVaultAddress)
+}

app/vault/handlers/resolver_handler.go

@@ -0,0 +1 @@
+package handlers

app/vault/handlers/transaction_handler.go

@@ -0,0 +1 @@
+package handlers

app/vault/handlers/wallet_handler.go

@@ -0,0 +1,93 @@
+package handlers
+
+//
+// // Constants for supported payment methods
+// const (
+// 	MethodCard       = "basic-card"
+// 	MethodGooglePay  = "https://google.com/pay"
+// 	MethodApplePay   = "https://apple.com/apple-pay"
+// 	MethodSonrWallet = "https://sonr.id/wallet"
+// )
+//
+// // InitiatePayment starts the payment request flow
+// func InitiatePayment(c echo.Context, request PaymentRequest) error {
+// 	return StartPayment(request).Render(c.Request().Context(), c.Response().Writer)
+// }
+//
+// // Helper functions to create payment requests
+// func NewBasicCardPayment(amount float64, currency string, label string) PaymentRequest {
+// 	return PaymentRequest{
+// 		MethodData: []PaymentMethodData{
+// 			{
+// 				SupportedMethods: MethodCard,
+// 				Data: map[string]any{
+// 					"supportedNetworks": []string{"visa", "mastercard"},
+// 					"supportedTypes":    []string{"credit", "debit"},
+// 				},
+// 			},
+// 		},
+// 		Details: PaymentDetails{
+// 			Total: PaymentItem{
+// 				Label: label,
+// 				Amount: Money{
+// 					Currency: currency,
+// 					Value:    formatAmount(amount),
+// 				},
+// 			},
+// 		},
+// 		Options: PaymentOptions{
+// 			RequestPayerName:  true,
+// 			RequestPayerEmail: true,
+// 		},
+// 	}
+// }
+//
+// // Example usage:
+// func PaymentHandler(c echo.Context) error {
+// 	request := NewBasicCardPayment(99.99, "USD", "Product Purchase")
+//
+// 	// Add display items
+// 	request.Details.DisplayItems = []PaymentItem{
+// 		{
+// 			Label: "Product Price",
+// 			Amount: Money{
+// 				Currency: "USD",
+// 				Value:    "89.99",
+// 			},
+// 		},
+// 		{
+// 			Label: "Tax",
+// 			Amount: Money{
+// 				Currency: "USD",
+// 				Value:    "10.00",
+// 			},
+// 		},
+// 	}
+//
+// 	// Add shipping options
+// 	request.Details.ShippingOptions = []ShippingOption{
+// 		{
+// 			ID:    "standard",
+// 			Label: "Standard Shipping",
+// 			Amount: Money{
+// 				Currency: "USD",
+// 				Value:    "0.00",
+// 			},
+// 			Selected: true,
+// 		},
+// 		{
+// 			ID:    "express",
+// 			Label: "Express Shipping",
+// 			Amount: Money{
+// 				Currency: "USD",
+// 				Value:    "10.00",
+// 			},
+// 		},
+// 	}
+//
+// 	return InitiatePayment(c, request)
+// }
+//
+// func formatAmount(amount float64) string {
+// 	return fmt.Sprintf("%.2f", amount)
+// }

app/vault/internal/context.go

@@ -0,0 +1,156 @@
+package session
+
+import (
+	"regexp"
+	"strings"
+
+	"github.com/go-webauthn/webauthn/protocol"
+	"github.com/go-webauthn/webauthn/protocol/webauthncose"
+	"github.com/labstack/echo/v4"
+	"github.com/segmentio/ksuid"
+
+	"github.com/onsonr/sonr/pkg/common"
+)
+
+const kWebAuthnTimeout = 6000
+
+// TODO: Returns fixed chain ID for testing.
+func GetChainID(c echo.Context) string {
+	return "sonr-testnet-1"
+}
+
+// SetVaultAddress sets the address of the vault
+func SetVaultAddress(c echo.Context, address string) error {
+	return common.WriteCookie(c, common.SonrAddress, address)
+}
+
+// SetVaultAuthorization sets the UCAN CID of the vault
+func SetVaultAuthorization(c echo.Context, ucanCID string) error {
+	common.HeaderWrite(c, common.Authorization, formatAuth(ucanCID))
+	return nil
+}
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                       Initialization                      │
+// ╰───────────────────────────────────────────────────────────╯
+
+func loadOrGenKsuid(c echo.Context) error {
+	var (
+		sessionID string
+		err       error
+	)
+
+	// Setup genKsuid function
+	genKsuid := func() string {
+		return ksuid.New().String()
+	}
+
+	// Attempt to read the session ID from the "session" cookie
+	if ok := common.CookieExists(c, common.SessionID); !ok {
+		sessionID = genKsuid()
+	} else {
+		sessionID, err = common.ReadCookie(c, common.SessionID)
+		if err != nil {
+			sessionID = genKsuid()
+		}
+	}
+	common.WriteCookie(c, common.SessionID, sessionID)
+	return nil
+}
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                       Extraction                          │
+// ╰───────────────────────────────────────────────────────────╯
+
+func extractPeerInfo(c echo.Context) (string, string) {
+	var chal protocol.URLEncodedBase64
+	id, _ := common.ReadCookie(c, common.SessionID)
+	chalRaw, _ := common.ReadCookieBytes(c, common.SessionChallenge)
+	chal.UnmarshalJSON(chalRaw)
+
+	return id, common.Base64Encode(chal)
+}
+
+func extractBrowserInfo(c echo.Context) (string, string) {
+	secCHUA := common.HeaderRead(c, common.UserAgent)
+
+	// If common.is empty, return empty BrowserInfo
+	if secCHUA == "" {
+		return "N/A", "-1"
+	}
+
+	// Split the common.into individual browser entries
+	var (
+		name string
+		ver  string
+	)
+	entries := strings.Split(strings.TrimSpace(secCHUA), ",")
+	for _, entry := range entries {
+		// Remove leading/trailing spaces and quotes
+		entry = strings.TrimSpace(entry)
+
+		// Use regex to extract the browser name and version
+		re := regexp.MustCompile(`"([^"]+)";v="([^"]+)"`)
+		matches := re.FindStringSubmatch(entry)
+
+		if len(matches) == 3 {
+			browserName := matches[1]
+			version := matches[2]
+
+			// Skip "Not A;Brand"
+			if !validBrowser(browserName) {
+				continue
+			}
+
+			// Store the first valid browser info as fallback
+			name = browserName
+			ver = version
+		}
+	}
+	return name, ver
+}
+
+func validBrowser(name string) bool {
+	return name != common.BrowserNameUnknown.String() && name != common.BrowserNameChromium.String()
+}
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                        Authentication                     │
+// ╰───────────────────────────────────────────────────────────╯
+
+func buildUserEntity(userID string) protocol.UserEntity {
+	return protocol.UserEntity{
+		ID: userID,
+	}
+}
+
+// returns the base options for registering a new user without challenge or user entity.
+func baseRegisterOptions() *protocol.PublicKeyCredentialCreationOptions {
+	return &protocol.PublicKeyCredentialCreationOptions{
+		Timeout:     kWebAuthnTimeout,
+		Attestation: protocol.PreferDirectAttestation,
+		AuthenticatorSelection: protocol.AuthenticatorSelection{
+			AuthenticatorAttachment: "platform",
+			ResidentKey:             protocol.ResidentKeyRequirementPreferred,
+			UserVerification:        "preferred",
+		},
+		Parameters: []protocol.CredentialParameter{
+			{
+				Type:      "public-key",
+				Algorithm: webauthncose.AlgES256,
+			},
+			{
+				Type:      "public-key",
+				Algorithm: webauthncose.AlgES256K,
+			},
+			{
+				Type:      "public-key",
+				Algorithm: webauthncose.AlgEdDSA,
+			},
+		},
+	}
+}
+
+func formatAuth(ucanCID string) string {
+	return "Bearer " + ucanCID
+}

app/vault/internal/middleware.go

@@ -0,0 +1,90 @@
+package session
+
+import (
+	"encoding/json"
+	"net/http"
+
+	"github.com/labstack/echo/v4"
+
+	"github.com/onsonr/sonr/app/vault/types"
+	"github.com/onsonr/sonr/pkg/common"
+)
+
+type SessionCtx interface {
+	ID() string
+	BrowserName() string
+	BrowserVersion() string
+}
+
+type contextKey string
+
+// Context keys
+const (
+	DataContextKey contextKey = "http_session_data"
+)
+
+// Get returns the session.Context from the echo context.
+func Get(c echo.Context) (SessionCtx, error) {
+	ctx, ok := c.(*HTTPContext)
+	if !ok {
+		return nil, echo.NewHTTPError(http.StatusInternalServerError, "Session Context not found")
+	}
+	return ctx, nil
+}
+
+// WebNodeMiddleware establishes a Session Cookie.
+func Middleware(config *types.Config) echo.MiddlewareFunc {
+	return func(next echo.HandlerFunc) echo.HandlerFunc {
+		return func(c echo.Context) error {
+			err := injectConfig(c, config)
+			if err != nil {
+				return err
+			}
+			cc := injectSession(c, common.RoleMotr)
+			return next(cc)
+		}
+	}
+}
+
+func injectConfig(c echo.Context, config *types.Config) error {
+	common.HeaderWrite(c, common.SonrAPIURL, config.SonrApiUrl)
+	common.HeaderWrite(c, common.SonrRPCURL, config.SonrRpcUrl)
+
+	common.WriteCookie(c, common.SonrAddress, config.MotrAddress)
+	schemaBz, err := json.Marshal(config.VaultSchema)
+	if err != nil {
+		return err
+	}
+	common.WriteCookieBytes(c, common.VaultSchema, schemaBz)
+	return nil
+}
+
+// injectSession returns the session injectSession from the cookies.
+func injectSession(c echo.Context, role common.PeerRole) *HTTPContext {
+	if c == nil {
+		return initHTTPContext(nil)
+	}
+
+	common.WriteCookie(c, common.SessionRole, role.String())
+
+	// Continue even if there are errors, just ensure we have valid session data
+	if err := loadOrGenKsuid(c); err != nil {
+		// Log error but continue
+	}
+	return initHTTPContext(c)
+}
+
+// HasAuthorization checks if the request has an authorization header
+func HasAuthorization(c echo.Context) bool {
+	return common.HeaderExists(c, common.Authorization)
+}
+
+// HasUserHandle checks if the request has a user handle cookie
+func HasUserHandle(c echo.Context) bool {
+	return common.CookieExists(c, common.UserHandle)
+}
+
+// HasVaultAddress checks if the request has a vault address cookie
+func HasVaultAddress(c echo.Context) bool {
+	return common.CookieExists(c, common.SonrAddress)
+}

app/vault/internal/pages/authenticate/model.go

@@ -0,0 +1,7 @@
+package authorize
+
+type AuthorizeRequest struct {
+	Subject string
+	Action  string
+	Origin  string
+}

app/vault/internal/pages/authorize/model.go

@@ -0,0 +1,7 @@
+package authorize
+
+type AuthorizeRequest struct {
+	Subject string
+	Action  string
+	Origin  string
+}

app/vault/internal/pages/dashboard/page.templ

@@ -0,0 +1,57 @@
+package dash
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+templ ProfileView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Sonr.ID
+							</h1>
+							<p class="text-lg text-zinc-500">
+								The decentralized identity layer for the web.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Get Started
+							</button>
+						</div>
+					</div>
+					{ children... }
+				</div>
+			</div>
+		</div>
+	}
+}
+
+templ FeedView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Welcome Back!
+							</h1>
+							<p class="text-lg text-zinc-500">
+								Continue with your existing Sonr.ID.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Login
+							</button>
+						</div>
+					</div>
+					{ children... }
+				</div>
+			</div>
+		</div>
+	}
+}

app/vault/internal/pages/dashboard/page_templ.go

@@ -0,0 +1,123 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.793
+package dash
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+func ProfileView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Sonr.ID</h1><p class=\"text-lg text-zinc-500\">The decentralized identity layer for the web.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Get Started</button></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func FeedView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Welcome Back!</h1><p class=\"text-lg text-zinc-500\">Continue with your existing Sonr.ID.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Login</button></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

app/vault/internal/pages/index/error.templ

@@ -0,0 +1,29 @@
+package index
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+templ NoWebauthnErrorView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								No WebAuthn Devices
+							</h1>
+							<p class="text-lg text-zinc-500">
+								You don't have any WebAuthn devices connected to your computer.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Get Started
+							</button>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	}
+}

app/vault/internal/pages/index/error_templ.go

@@ -0,0 +1,60 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.793
+package index
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+func NoWebauthnErrorView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">No WebAuthn Devices</h1><p class=\"text-lg text-zinc-500\">You don't have any WebAuthn devices connected to your computer.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Get Started</button></div></div></div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

app/vault/internal/pages/index/page.templ

@@ -0,0 +1,57 @@
+package index
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+templ InitialView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Sonr.ID
+							</h1>
+							<p class="text-lg text-zinc-500">
+								The decentralized identity layer for the web.
+							</p>
+						</div>
+						<br/>
+						<div class="pt-3 flex flex-col items-center justify-center h-full">
+							<div hx-get="/register" hx-swap="outerHTML" class="pointer:cursor-pointer btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Get Started
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	}
+}
+
+templ ReturningView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Welcome Back!
+							</h1>
+							<p class="text-lg text-zinc-500">
+								Continue with your existing Sonr.ID.
+							</p>
+						</div>
+						<br/>
+						<div class="pt-3 flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Login
+							</button>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	}
+}

app/vault/internal/pages/index/page_templ.go

@@ -0,0 +1,107 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.793
+package index
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+func InitialView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Sonr.ID</h1><p class=\"text-lg text-zinc-500\">The decentralized identity layer for the web.</p></div><br><div class=\"pt-3 flex flex-col items-center justify-center h-full\"><div hx-get=\"/register\" hx-swap=\"outerHTML\" class=\"pointer:cursor-pointer btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Get Started</div></div></div></div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func ReturningView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Welcome Back!</h1><p class=\"text-lg text-zinc-500\">Continue with your existing Sonr.ID.</p></div><br><div class=\"pt-3 flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Login</button></div></div></div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

app/vault/internal/pages/wallet/model.go

@@ -0,0 +1,43 @@
+package wallet
+
+// Payment types
+type PaymentMethodData struct {
+	SupportedMethods string         `json:"supportedMethods"`
+	Data             map[string]any `json:"data,omitempty"`
+}
+
+type PaymentItem struct {
+	Label  string `json:"label"`
+	Amount Money  `json:"amount"`
+}
+
+type Money struct {
+	Currency string `json:"currency"`
+	Value    string `json:"value"` // Decimal as string for precision
+}
+
+type PaymentOptions struct {
+	RequestPayerName  bool `json:"requestPayerName,omitempty"`
+	RequestPayerEmail bool `json:"requestPayerEmail,omitempty"`
+	RequestPayerPhone bool `json:"requestPayerPhone,omitempty"`
+	RequestShipping   bool `json:"requestShipping,omitempty"`
+}
+
+type PaymentDetails struct {
+	Total           PaymentItem      `json:"total"`
+	DisplayItems    []PaymentItem    `json:"displayItems,omitempty"`
+	ShippingOptions []ShippingOption `json:"shippingOptions,omitempty"`
+}
+
+type ShippingOption struct {
+	ID       string `json:"id"`
+	Label    string `json:"label"`
+	Amount   Money  `json:"amount"`
+	Selected bool   `json:"selected,omitempty"`
+}
+
+type PaymentRequest struct {
+	MethodData []PaymentMethodData `json:"methodData"`
+	Details    PaymentDetails      `json:"details"`
+	Options    PaymentOptions      `json:"options,omitempty"`
+}

app/vault/internal/pages/wallet/page.templ

@@ -0,0 +1,111 @@
+package wallet
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+templ DepositFundsView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Sonr.ID
+							</h1>
+							<p class="text-lg text-zinc-500">
+								The decentralized identity layer for the web.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Get Started
+							</button>
+						</div>
+					</div>
+					{ children... }
+				</div>
+			</div>
+		</div>
+	}
+}
+
+templ SwapTokensView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Sonr.ID
+							</h1>
+							<p class="text-lg text-zinc-500">
+								The decentralized identity layer for the web.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Get Started
+							</button>
+						</div>
+					</div>
+					{ children... }
+				</div>
+			</div>
+		</div>
+	}
+}
+
+templ ConfirmPasscodeView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Sonr.ID
+							</h1>
+							<p class="text-lg text-zinc-500">
+								The decentralized identity layer for the web.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Get Started
+							</button>
+						</div>
+					</div>
+					{ children... }
+				</div>
+			</div>
+		</div>
+	}
+}
+
+templ TransferTokensView() {
+	@layout.Root("Sonr.ID") {
+		<div class="flex fixed inset-0 z-[99] w-screen h-screen bg-white">
+			<div class="relative flex flex-wrap items-center w-full h-full px-8">
+				<div class="relative w-full max-w-sm mx-auto lg:mb-0">
+					<div class="flex flex-col items-center justify-center h-full">
+						<div class="flex flex-col items-center justify-center h-full">
+							<h1 class="text-3xl font-bold text-zinc-900 mb-4">
+								Welcome Back!
+							</h1>
+							<p class="text-lg text-zinc-500">
+								Continue with your existing Sonr.ID.
+							</p>
+						</div>
+						<div class="flex flex-col items-center justify-center h-full">
+							<button class="btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow">
+								Login
+							</button>
+						</div>
+					</div>
+					{ children... }
+				</div>
+			</div>
+		</div>
+	}
+}

app/vault/internal/pages/wallet/page_templ.go

@@ -0,0 +1,233 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.793
+package wallet
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "github.com/onsonr/sonr/pkg/common/styles/layout"
+
+func DepositFundsView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Sonr.ID</h1><p class=\"text-lg text-zinc-500\">The decentralized identity layer for the web.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Get Started</button></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func SwapTokensView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Sonr.ID</h1><p class=\"text-lg text-zinc-500\">The decentralized identity layer for the web.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Get Started</button></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func ConfirmPasscodeView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Sonr.ID</h1><p class=\"text-lg text-zinc-500\">The decentralized identity layer for the web.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Get Started</button></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func TransferTokensView() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var7 == nil {
+			templ_7745c5c3_Var7 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex fixed inset-0 z-[99] w-screen h-screen bg-white\"><div class=\"relative flex flex-wrap items-center w-full h-full px-8\"><div class=\"relative w-full max-w-sm mx-auto lg:mb-0\"><div class=\"flex flex-col items-center justify-center h-full\"><div class=\"flex flex-col items-center justify-center h-full\"><h1 class=\"text-3xl font-bold text-zinc-900 mb-4\">Welcome Back!</h1><p class=\"text-lg text-zinc-500\">Continue with your existing Sonr.ID.</p></div><div class=\"flex flex-col items-center justify-center h-full\"><button class=\"btn btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow\">Login</button></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var7.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.Root("Sonr.ID").Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

app/vault/internal/pages/wallet/scripts.templ

@@ -0,0 +1,107 @@
+package wallet
+
+var paymentsHandle = templ.NewOnceHandle()
+
+// Base payments script template
+templ PaymentsScripts() {
+	@paymentsHandle.Once() {
+		<script type="text/javascript">
+            // Check if Payment Request API is supported
+            function isPaymentRequestSupported() {
+                return window.PaymentRequest !== undefined;
+            }
+
+            // Create and show payment request
+            async function showPaymentRequest(request) {
+                try {
+                    const paymentMethods = request.methodData;
+                    const details = request.details;
+                    const options = request.options || {};
+
+                    const paymentRequest = new PaymentRequest(
+                        paymentMethods,
+                        details,
+                        options
+                    );
+
+                    // Handle shipping address changes if shipping is requested
+                    if (options.requestShipping) {
+                        paymentRequest.addEventListener('shippingaddresschange', event => {
+                            event.updateWith(Promise.resolve(details));
+                        });
+                    }
+
+                    // Handle shipping option changes
+                    if (details.shippingOptions && details.shippingOptions.length > 0) {
+                        paymentRequest.addEventListener('shippingoptionchange', event => {
+                            event.updateWith(Promise.resolve(details));
+                        });
+                    }
+
+                    const response = await paymentRequest.show();
+                    
+                    // Create response object
+                    const result = {
+                        methodName: response.methodName,
+                        details: response.details,
+                    };
+
+                    if (options.requestPayerName) {
+                        result.payerName = response.payerName;
+                    }
+                    if (options.requestPayerEmail) {
+                        result.payerEmail = response.payerEmail;
+                    }
+                    if (options.requestPayerPhone) {
+                        result.payerPhone = response.payerPhone;
+                    }
+                    if (options.requestShipping) {
+                        result.shippingAddress = response.shippingAddress;
+                        result.shippingOption = response.shippingOption;
+                    }
+
+                    // Complete the payment
+                    await response.complete('success');
+
+                    // Dispatch success event
+                    window.dispatchEvent(new CustomEvent('paymentComplete', {
+                        detail: result
+                    }));
+
+                } catch (err) {
+                    // Dispatch error event
+                    window.dispatchEvent(new CustomEvent('paymentError', {
+                        detail: err.message
+                    }));
+                }
+            }
+
+            // Abort payment request
+            function abortPaymentRequest() {
+                if (window.currentPaymentRequest) {
+                    window.currentPaymentRequest.abort();
+                }
+            }
+        </script>
+	}
+}
+
+// StartPayment for initiating payment request
+templ StartPayment(request PaymentRequest) {
+	@PaymentsScripts()
+	<script>
+        (async () => {
+            try {
+                if (!isPaymentRequestSupported()) {
+                    throw new Error("Payment Request API is not supported in this browser");
+                }
+                const request = { templ.JSONString(request) };
+                await showPaymentRequest(request);
+            } catch (err) {
+                window.dispatchEvent(new CustomEvent('paymentError', {
+                    detail: err.message
+                }));
+            }
+        })();
+    </script>
+}

app/vault/internal/pages/wallet/scripts_templ.go

@@ -0,0 +1,95 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.793
+package wallet
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+var paymentsHandle = templ.NewOnceHandle()
+
+// Base payments script template
+func PaymentsScripts() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<script type=\"text/javascript\">\n            // Check if Payment Request API is supported\n            function isPaymentRequestSupported() {\n                return window.PaymentRequest !== undefined;\n            }\n\n            // Create and show payment request\n            async function showPaymentRequest(request) {\n                try {\n                    const paymentMethods = request.methodData;\n                    const details = request.details;\n                    const options = request.options || {};\n\n                    const paymentRequest = new PaymentRequest(\n                        paymentMethods,\n                        details,\n                        options\n                    );\n\n                    // Handle shipping address changes if shipping is requested\n                    if (options.requestShipping) {\n                        paymentRequest.addEventListener('shippingaddresschange', event => {\n                            event.updateWith(Promise.resolve(details));\n                        });\n                    }\n\n                    // Handle shipping option changes\n                    if (details.shippingOptions && details.shippingOptions.length > 0) {\n                        paymentRequest.addEventListener('shippingoptionchange', event => {\n                            event.updateWith(Promise.resolve(details));\n                        });\n                    }\n\n                    const response = await paymentRequest.show();\n                    \n                    // Create response object\n                    const result = {\n                        methodName: response.methodName,\n                        details: response.details,\n                    };\n\n                    if (options.requestPayerName) {\n                        result.payerName = response.payerName;\n                    }\n                    if (options.requestPayerEmail) {\n                        result.payerEmail = response.payerEmail;\n                    }\n                    if (options.requestPayerPhone) {\n                        result.payerPhone = response.payerPhone;\n                    }\n                    if (options.requestShipping) {\n                        result.shippingAddress = response.shippingAddress;\n                        result.shippingOption = response.shippingOption;\n                    }\n\n                    // Complete the payment\n                    await response.complete('success');\n\n                    // Dispatch success event\n                    window.dispatchEvent(new CustomEvent('paymentComplete', {\n                        detail: result\n                    }));\n\n                } catch (err) {\n                    // Dispatch error event\n                    window.dispatchEvent(new CustomEvent('paymentError', {\n                        detail: err.message\n                    }));\n                }\n            }\n\n            // Abort payment request\n            function abortPaymentRequest() {\n                if (window.currentPaymentRequest) {\n                    window.currentPaymentRequest.abort();\n                }\n            }\n        </script>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = paymentsHandle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+// StartPayment for initiating payment request
+func StartPayment(request PaymentRequest) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = PaymentsScripts().Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<script>\n        (async () => {\n            try {\n                if (!isPaymentRequestSupported()) {\n                    throw new Error(\"Payment Request API is not supported in this browser\");\n                }\n                const request = { templ.JSONString(request) };\n                await showPaymentRequest(request);\n            } catch (err) {\n                window.dispatchEvent(new CustomEvent('paymentError', {\n                    detail: err.message\n                }));\n            }\n        })();\n    </script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

app/vault/internal/session.go

@@ -0,0 +1,51 @@
+package session
+
+import (
+	"github.com/labstack/echo/v4"
+
+	"github.com/onsonr/sonr/pkg/common"
+)
+
+// HTTPContext is the context for HTTP endpoints.
+type HTTPContext struct {
+	echo.Context
+	role common.PeerRole
+	id   string
+	chal string
+	bn   string
+	bv   string
+}
+
+// initHTTPContext loads the headers from the request.
+func initHTTPContext(c echo.Context) *HTTPContext {
+	if c == nil {
+		return &HTTPContext{}
+	}
+
+	id, chal := extractPeerInfo(c)
+	bn, bv := extractBrowserInfo(c)
+
+	cc := &HTTPContext{
+		Context: c,
+		role:    common.PeerRole(common.ReadCookieUnsafe(c, common.SessionRole)),
+		id:      id,
+		chal:    chal,
+		bn:      bn,
+		bv:      bv,
+	}
+
+	// Set the session data in both contexts
+	return cc
+}
+
+func (s *HTTPContext) ID() string {
+	return s.id
+}
+
+func (s *HTTPContext) BrowserName() string {
+	return s.bn
+}
+
+func (s *HTTPContext) BrowserVersion() string {
+	return s.bv
+}

app/vault/routes.go

@@ -0,0 +1,28 @@
+//go:build js && wasm
+// +build js,wasm
+
+// Package vault provides the routes for the Decentralized Web Node (...or Sonr Motr).
+package vault
+
+import (
+	"github.com/labstack/echo/v4"
+
+	"github.com/onsonr/sonr/app/vault/handlers"
+	session "github.com/onsonr/sonr/app/vault/internal"
+	"github.com/onsonr/sonr/app/vault/types"
+)
+
+// RegisterRoutes registers the Decentralized Web Node API routes.
+func RegisterRoutes(e *echo.Echo, config *types.Config) {
+	e.Use(session.Middleware(config))
+
+	e.GET("/register/:subject/start", handlers.RegisterSubjectStart)
+	e.POST("/register/:subject/finish", handlers.RegisterSubjectFinish)
+
+	e.GET("/login/:subject/start", handlers.LoginSubjectStart)
+	e.POST("/login/:subject/finish", handlers.LoginSubjectFinish)
+
+	e.GET("/authz/jwks", handlers.GetJWKS)
+	e.GET("/authz/token", handlers.GetToken)
+	e.POST("/:origin/grant/:subject", handlers.GrantAuthorization)
+}

app/vault/types/Config.pkl.go

@@ -0,0 +1,18 @@
+// Code generated from Pkl module `sonr.motr.DWN`. DO NOT EDIT.
+package types
+
+type Config struct {
+	IpfsGatewayUrl string `pkl:"ipfsGatewayUrl" json:"ipfsGatewayUrl,omitempty"`
+
+	MotrToken string `pkl:"motrToken" json:"motrToken,omitempty"`
+
+	MotrAddress string `pkl:"motrAddress" json:"motrAddress,omitempty"`
+
+	SonrApiUrl string `pkl:"sonrApiUrl" json:"sonrApiUrl,omitempty"`
+
+	SonrRpcUrl string `pkl:"sonrRpcUrl" json:"sonrRpcUrl,omitempty"`
+
+	SonrChainId string `pkl:"sonrChainId" json:"sonrChainId,omitempty"`
+
+	VaultSchema *Schema `pkl:"vaultSchema" json:"vaultSchema,omitempty"`
+}

app/vault/types/DWN.pkl.go

@@ -0,0 +1,36 @@
+// Code generated from Pkl module `sonr.motr.DWN`. DO NOT EDIT.
+package types
+
+import (
+	"context"
+
+	"github.com/apple/pkl-go/pkl"
+)
+
+type DWN struct {
+}
+
+// LoadFromPath loads the pkl module at the given path and evaluates it into a DWN
+func LoadFromPath(ctx context.Context, path string) (ret *DWN, err error) {
+	evaluator, err := pkl.NewEvaluator(ctx, pkl.PreconfiguredOptions)
+	if err != nil {
+		return nil, err
+	}
+	defer func() {
+		cerr := evaluator.Close()
+		if err == nil {
+			err = cerr
+		}
+	}()
+	ret, err = Load(ctx, evaluator, pkl.FileSource(path))
+	return ret, err
+}
+
+// Load loads the pkl module at the given source and evaluates it with the given evaluator into a DWN
+func Load(ctx context.Context, evaluator pkl.Evaluator, source *pkl.ModuleSource) (*DWN, error) {
+	var ret DWN
+	if err := evaluator.EvaluateModule(ctx, source, &ret); err != nil {
+		return nil, err
+	}
+	return &ret, nil
+}

app/vault/types/Environment.pkl.go

@@ -0,0 +1,14 @@
+// Code generated from Pkl module `sonr.motr.DWN`. DO NOT EDIT.
+package types
+
+type Environment struct {
+	IsDevelopment bool `pkl:"isDevelopment" json:"isDevelopment,omitempty"`
+
+	CacheVersion string `pkl:"cacheVersion" json:"cacheVersion,omitempty"`
+
+	HttpserverPath string `pkl:"httpserverPath" json:"httpserverPath,omitempty"`
+
+	WasmExecPath string `pkl:"wasmExecPath" json:"wasmExecPath,omitempty"`
+
+	WasmPath string `pkl:"wasmPath" json:"wasmPath,omitempty"`
+}

app/vault/types/Schema.pkl.go

@@ -0,0 +1,22 @@
+// Code generated from Pkl module `sonr.motr.DWN`. DO NOT EDIT.
+package types
+
+type Schema struct {
+	Version int `pkl:"version"`
+
+	Account string `pkl:"account" json:"account,omitempty"`
+
+	Asset string `pkl:"asset" json:"asset,omitempty"`
+
+	Chain string `pkl:"chain" json:"chain,omitempty"`
+
+	Credential string `pkl:"credential" json:"credential,omitempty"`
+
+	Jwk string `pkl:"jwk" json:"jwk,omitempty"`
+
+	Grant string `pkl:"grant" json:"grant,omitempty"`
+
+	Keyshare string `pkl:"keyshare" json:"keyshare,omitempty"`
+
+	Profile string `pkl:"profile" json:"profile,omitempty"`
+}

app/vault/types/init.pkl.go

@@ -0,0 +1,11 @@
+// Code generated from Pkl module `sonr.motr.DWN`. DO NOT EDIT.
+package types
+
+import "github.com/apple/pkl-go/pkl"
+
+func init() {
+	pkl.RegisterMapping("sonr.motr.DWN", DWN{})
+	pkl.RegisterMapping("sonr.motr.DWN#Config", Config{})
+	pkl.RegisterMapping("sonr.motr.DWN#Schema", Schema{})
+	pkl.RegisterMapping("sonr.motr.DWN#Environment", Environment{})
+}

app/vault/wasm.go

@@ -0,0 +1,34 @@
+//go:build js && wasm
+// +build js,wasm
+
+package vault
+
+import (
+	"encoding/base64"
+	"encoding/json"
+
+	"github.com/labstack/echo/v4"
+)
+
+func WasmContextMiddleware(next echo.HandlerFunc) echo.HandlerFunc {
+	return func(c echo.Context) error {
+		// Extract WASM context from headers
+		if wasmCtx := c.Request().Header.Get("X-Wasm-Context"); wasmCtx != "" {
+			if ctx, err := DecodeWasmContext(wasmCtx); err == nil {
+				c.Set("wasm_context", ctx)
+			}
+		}
+		return next(c)
+	}
+}
+
+// decodeWasmContext decodes the WASM context from a base64 encoded string
+func DecodeWasmContext(ctx string) (map[string]any, error) {
+	decoded, err := base64.StdEncoding.DecodeString(ctx)
+	if err != nil {
+		return nil, err
+	}
+	var ctxData map[string]any
+	err = json.Unmarshal(decoded, &ctxData)
+	return ctxData, err
+}