feat: implement passkey registration flow

This commit is contained in:
Prad Nukala 2024-12-09 14:51:12 -05:00
parent 893631eb4c
commit 3353d9f622
5 changed files with 40 additions and 38 deletions

View File

@ -1,19 +1,19 @@
package cards
type SonrProfileData struct {
Address string
Handle string
Name string
ChainID string
CreationBlock string
// Helper function to shorten address
func shortenAddress(address string) string {
if len(address) <= 20 {
return address
}
return address[:16] + "..." + address[len(address)-4:]
}
templ SonrProfile(addr string, name string, handle string, creationBlock string) {
<div class="profile-card min-w-[320px]">
<div class="text-white max-w-xs my-auto mx-auto bg-gradient-to-r from-purple-800 to-purple-400 p-4 py-5 px-5 rounded-xl">
<div class="text-white max-w-xs my-auto mx-auto bg-gradient-to-r from-cyan-700 to-cyan-300 p-4 py-5 px-5 rounded-xl">
<div class="flex justify-between">
<div>
<h3>sonr-testnet-1</h3>
<h2>sonr-testnet-1</h2>
<p class="text-2xl font-bold">{ handle }</p>
</div>
<div class="flex items-center opacity-60">
@ -36,11 +36,3 @@ templ SonrProfile(addr string, name string, handle string, creationBlock string)
</div>
</div>
}
// Helper function to shorten address
func shortenAddress(address string) string {
if len(address) <= 20 {
return address
}
return address[:16] + "..." + address[len(address)-4:]
}

View File

@ -16,6 +16,14 @@ type SonrProfileData struct {
CreationBlock string
}
// Helper function to shorten address
func shortenAddress(address string) string {
if len(address) <= 20 {
return address
}
return address[:16] + "..." + address[len(address)-4:]
}
func SonrProfile(addr string, name string, handle string, creationBlock string) 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
@ -37,14 +45,14 @@ func SonrProfile(addr string, name string, handle string, creationBlock string)
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"profile-card min-w-[320px]\"><div class=\"text-white max-w-xs my-auto mx-auto bg-gradient-to-r from-purple-800 to-purple-400 p-4 py-5 px-5 rounded-xl\"><div class=\"flex justify-between\"><div><h3>sonr-testnet-1</h3><p class=\"text-2xl font-bold\">")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"profile-card min-w-[320px]\"><div class=\"text-white max-w-xs my-auto mx-auto bg-gradient-to-r from-cyan-700 to-cyan-300 p-4 py-5 px-5 rounded-xl\"><div class=\"flex justify-between\"><div><h2>sonr-testnet-1</h2><p class=\"text-2xl font-bold\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var2 string
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(handle)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 17, Col: 43}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 25, Col: 43}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
if templ_7745c5c3_Err != nil {
@ -57,7 +65,7 @@ func SonrProfile(addr string, name string, handle string, creationBlock string)
var templ_7745c5c3_Var3 string
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(shortenAddress(addr))
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 24, Col: 58}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 32, Col: 58}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
if templ_7745c5c3_Err != nil {
@ -70,7 +78,7 @@ func SonrProfile(addr string, name string, handle string, creationBlock string)
var templ_7745c5c3_Var4 string
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(creationBlock)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 29, Col: 55}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 37, Col: 55}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
if templ_7745c5c3_Err != nil {
@ -83,7 +91,7 @@ func SonrProfile(addr string, name string, handle string, creationBlock string)
var templ_7745c5c3_Var5 string
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(name)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 33, Col: 32}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/blocks/cards/profile.templ`, Line: 41, Col: 32}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
if templ_7745c5c3_Err != nil {
@ -97,12 +105,4 @@ func SonrProfile(addr string, name string, handle string, creationBlock string)
})
}
// Helper function to shorten address
func shortenAddress(address string) string {
if len(address) <= 20 {
return address
}
return address[:16] + "..." + address[len(address)-4:]
}
var _ = templruntime.GeneratedTemplate

View File

@ -12,7 +12,7 @@ type RegisterPasskeyData struct {
templ RegisterPasskey(action, method string, data RegisterPasskeyData) {
<form action={ templ.SafeURL(action) } method={ method }>
<input type="hidden" name="credential" id="credential-data" />
<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-1">

View File

@ -61,7 +61,7 @@ func RegisterPasskey(action, method string, data RegisterPasskeyData) templ.Comp
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"><sl-card class=\"card-form gap-4 max-w-lg\"><div slot=\"header\"><div class=\"w-full py-1\">")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"><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-1\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -133,8 +133,8 @@ func passkeyDropzone(addr string, userHandle string, challenge string) templ.Com
func createPasskey(userId string, userHandle string, challenge string) templ.ComponentScript {
return templ.ComponentScript{
Name: `__templ_createPasskey_9b69`,
Function: `function __templ_createPasskey_9b69(userId, userHandle, challenge){const publicKey = {
Name: `__templ_createPasskey_6e79`,
Function: `function __templ_createPasskey_6e79(userId, userHandle, challenge){const publicKey = {
challenge: Uint8Array.from(challenge, (c) => c.charCodeAt(0)),
rp: {
name: "Sonr.ID",
@ -170,16 +170,25 @@ func createPasskey(userId string, userHandle string, challenge string) templ.Com
navigator.credentials
.create({ publicKey })
.then((newCredentialInfo) => {
console.log(newCredentialInfo);
// Send new credential info to server for verification and registration.
// Convert credential to base64 string
const credentialJSON = JSON.stringify({
id: newCredentialInfo.id,
rawId: Array.from(new Uint8Array(newCredentialInfo.rawId)),
response: {
attestationObject: Array.from(new Uint8Array(newCredentialInfo.response.attestationObject)),
clientDataJSON: Array.from(new Uint8Array(newCredentialInfo.response.clientDataJSON))
},
type: newCredentialInfo.type
});
document.getElementById('credential-data').value = btoa(credentialJSON);
})
.catch((err) => {
console.error(err);
// No acceptable authenticator or user refused consent. Handle appropriately.
});
}`,
Call: templ.SafeScript(`__templ_createPasskey_9b69`, userId, userHandle, challenge),
CallInline: templ.SafeScriptInline(`__templ_createPasskey_9b69`, userId, userHandle, challenge),
Call: templ.SafeScript(`__templ_createPasskey_6e79`, userId, userHandle, challenge),
CallInline: templ.SafeScriptInline(`__templ_createPasskey_6e79`, userId, userHandle, challenge),
}
}

View File

@ -40,6 +40,7 @@ func HandleRegisterStart(c echo.Context) error {
}
func HandleRegisterFinish(c echo.Context) error {
// cred := c.FormValue("credential")
cred := c.FormValue("credential")
fmt.Println(cred)
return response.TemplEcho(c, register.LoadingVaultView())
}