mirror of
https://github.com/sonr-io/sonr.git
synced 2026-08-04 10:21:40 +00:00
feature/1129 integrate webauthn controller (#1135)
* **refactor: remove nebula static file serving** * **feat: Add login, register, and authorize sections** * **feat: implement registration form UI** * **refactor: abstract template rendering to ctx module** * **feat: add deployment target for Highway gateway** * **feat: migrate Highway gateway to Cloudflare Workers** * **feat: refactor nebula routes to components** * **chore(deps): remove unused dependencies** * **chore(deps): remove unused dependencies** * **feat: add user and relaying party entities** * **refactor: remove unused imports** * * **feat: add motion scale-in and opacity-in animations** * **refactor: move dwn and orm packages to internal** * **refactor: update imports to use relative paths** * **refactor: rename build targets for clarity** * **feat: add RelayingPartyEntity model** * **refactor: rename creds templates to credentials** * **refactor: remove unused entity model** * **refactor: move models to internal package** * **refactor: move models package to internal/orm** * **feat: implement broadcast channel context** * **feat: remove config upload step** * **feat: remove unused configuration files** * **feat: migrate authentication logic to workers** * **feat: remove cloudflared dependency** * **refactor: move client related routes to 'routes/client.go'** * **feat: implement macaroon middleware** * **refactor: move fetch package to cmd/motr** * **feat: remove auth and grant endpoints** * **docs: add conceptual descriptions to did module** <sub><a href="https://huly.app/guest/sonrhq?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsaW5rSWQiOiI2NzA4MTIyNmM3ZDZhNTZhOGY4ZGFjOTciLCJndWVzdCI6InRydWUiLCJlbWFpbCI6IiNndWVzdEBoYy5lbmdpbmVlcmluZyIsIndvcmtzcGFjZSI6InctcHJhZC1zb25yaHEtNjVlZjcyZDQtY2UyOGQ0ODJjNi00ZWY4ZDAifQ.j-w5jk5Ji-0vCkaxVaK8pDMIOhRsXmG7o6oZictoHYE">Huly®: <b>ENG-1057</b></a></sub>
This commit is contained in:
Prad Nukala
@@ -0,0 +1,232 @@
|
||||
package ui
|
||||
|
||||
import "github.com/onsonr/sonr/nebula/global/styles"
|
||||
|
||||
templ PrimaryButton(href string, text string) {
|
||||
<div>
|
||||
<div class="btn cursor-pointer text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow" hx-swap="afterend" hx-get={ href }>{ text }</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ SecondaryButton(href string, text string) {
|
||||
<div>
|
||||
<div class="btn cursor-pointer text-zinc-600 bg-white hover:text-zinc-900 w-full shadow" hx-swap="afterend" hx-get={ href }>{ text }</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
type button struct {
|
||||
variant styles.Variant
|
||||
hxGet string
|
||||
hxPost string
|
||||
hxTarget string
|
||||
hxTrigger string
|
||||
hxSwap string
|
||||
}
|
||||
|
||||
type ButtonOpt func(button *button)
|
||||
|
||||
func PrimaryButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantPrimary
|
||||
}
|
||||
}
|
||||
|
||||
func InfoButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantInfo
|
||||
}
|
||||
}
|
||||
|
||||
func ErrorButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantError
|
||||
}
|
||||
}
|
||||
|
||||
func SuccessButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantSuccess
|
||||
}
|
||||
}
|
||||
|
||||
func WarningButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantWarning
|
||||
}
|
||||
}
|
||||
|
||||
func GET(action string, target string) ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.hxGet = action
|
||||
button.hxTarget = target
|
||||
button.hxTrigger = "click"
|
||||
button.hxSwap = "outerHTML"
|
||||
}
|
||||
}
|
||||
|
||||
func POST(action string, target string) ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.hxPost = action
|
||||
button.hxTarget = target
|
||||
button.hxTrigger = "click"
|
||||
button.hxSwap = "outerHTML"
|
||||
}
|
||||
}
|
||||
|
||||
func Button(opts ...ButtonOpt) templ.Component {
|
||||
button := button{
|
||||
variant: ButtonVariantDefault,
|
||||
}
|
||||
for _, opt := range opts {
|
||||
opt(&button)
|
||||
}
|
||||
if button.hxGet != "" {
|
||||
return renderHxGetButton(&button, button.variant.Attributes())
|
||||
}
|
||||
|
||||
if button.hxPost != "" {
|
||||
return renderHxPostButton(&button, button.variant.Attributes())
|
||||
}
|
||||
return renderButton(button.variant.Attributes())
|
||||
}
|
||||
|
||||
templ renderButton(attrs templ.Attributes) {
|
||||
<button { attrs... }>
|
||||
{ children... }
|
||||
</button>
|
||||
}
|
||||
|
||||
templ renderHxGetButton(c *button, attrs templ.Attributes) {
|
||||
<button hx-get={ c.hxGet } hx-push-url="true" hx-target={ c.hxTarget } hx-trigger={ c.hxTrigger } hx-swap={ c.hxSwap } { attrs... }>
|
||||
{ children... }
|
||||
</button>
|
||||
}
|
||||
|
||||
templ renderHxPostButton(c *button, attrs templ.Attributes) {
|
||||
<button hx-post={ c.hxPost } hx-target={ c.hxTarget } hx-trigger={ c.hxTrigger } hx-swap={ c.hxSwap } { attrs... }>
|
||||
{ children... }
|
||||
</button>
|
||||
}
|
||||
|
||||
type ButtonVariant int
|
||||
|
||||
const (
|
||||
ButtonVariantDefault ButtonVariant = iota
|
||||
ButtonVariantPrimary
|
||||
ButtonVariantInfo
|
||||
ButtonVariantError
|
||||
ButtonVariantSuccess
|
||||
ButtonVariantWarning
|
||||
)
|
||||
|
||||
func (v ButtonVariant) Attributes() templ.Attributes {
|
||||
switch v {
|
||||
case ButtonVariantPrimary:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-neutral-950 hover:bg-neutral-900 focus:ring-2 focus:ring-offset-2 focus:ring-neutral-900 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantInfo:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 bg-blue-600 rounded-md hover:bg-blue-700 focus:ring-2 focus:ring-offset-2 focus:ring-blue-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantError:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-red-600 hover:bg-red-700 focus:ring-2 focus:ring-offset-2 focus:ring-red-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantSuccess:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-green-600 hover:bg-green-700 focus:ring-2 focus:ring-offset-2 focus:ring-green-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantWarning:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-yellow-600 hover:bg-yellow-700 focus:ring-2 focus:ring-offset-2 focus:ring-yellow-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-200 bg-white border rounded-md text-neutral-500 hover:text-neutral-700 border-neutral-200/70 hover:bg-neutral-100 active:bg-white focus:bg-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-200/60 focus:shadow-outline",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
|
||||
type SubtleButtonVariant int
|
||||
|
||||
const (
|
||||
SubtleButtonVariantDefault SubtleButtonVariant = iota
|
||||
SubtleButtonVariantInfo
|
||||
SubtleButtonVariantError
|
||||
SubtleButtonVariantSuccess
|
||||
SubtleButtonVariantWarning
|
||||
)
|
||||
|
||||
func (v SubtleButtonVariant) Attributes() templ.Attributes {
|
||||
switch v {
|
||||
case SubtleButtonVariantInfo:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-blue-500 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-blue-100 bg-blue-50 hover:text-blue-600 hover:bg-blue-100",
|
||||
"type": "button",
|
||||
}
|
||||
case SubtleButtonVariantError:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-red-500 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-red-100 bg-red-50 hover:text-red-600 hover:bg-red-100",
|
||||
"type": "button",
|
||||
}
|
||||
case SubtleButtonVariantSuccess:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-green-500 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-green-100 bg-green-50 hover:text-green-600 hover:bg-green-100",
|
||||
"type": "button",
|
||||
}
|
||||
case SubtleButtonVariantWarning:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-yellow-600 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-yellow-100 bg-yellow-50 hover:text-yellow-700 hover:bg-yellow-100",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-100 rounded-md text-neutral-500 bg-neutral-50 focus:ring-2 focus:ring-offset-2 focus:ring-neutral-100 hover:text-neutral-600 hover:bg-neutral-100",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
|
||||
type OutlineButtonVariant int
|
||||
|
||||
const (
|
||||
OutlineButtonVariantDefault OutlineButtonVariant = iota
|
||||
OutlineButtonVariantInfo
|
||||
OutlineButtonVariantError
|
||||
OutlineButtonVariantSuccess
|
||||
OutlineButtonVariantWarning
|
||||
)
|
||||
|
||||
func (v OutlineButtonVariant) Attributes() templ.Attributes {
|
||||
switch v {
|
||||
case OutlineButtonVariantInfo:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-blue-600 transition-colors duration-100 bg-white border-2 border-blue-600 rounded-md hover:text-white hover:bg-blue-600",
|
||||
"type": "button",
|
||||
}
|
||||
case OutlineButtonVariantError:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-red-600 transition-colors duration-100 bg-white border-2 border-red-600 rounded-md hover:text-white hover:bg-red-600",
|
||||
"type": "button",
|
||||
}
|
||||
case OutlineButtonVariantSuccess:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-green-600 transition-colors duration-100 bg-white border-2 border-green-600 rounded-md hover:text-white hover:bg-green-600",
|
||||
"type": "button",
|
||||
}
|
||||
case OutlineButtonVariantWarning:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-yellow-600 transition-colors duration-100 bg-white border-2 border-yellow-500 rounded-md hover:text-white hover:bg-yellow-500",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-100 bg-white border-2 rounded-md text-neutral-900 hover:text-white border-neutral-900 hover:bg-neutral-900",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user