-16

appview/pages/pages.go

··· 367 367 return p.executePlain("knots/fragments/knotListing", w, params) 368 368 } 369 369 370 370 - type KnotListingFullParams struct { 371 371 - Registrations []db.Registration 372 372 - } 373 373 - 374 374 - func (p *Pages) KnotListingFull(w io.Writer, params KnotListingFullParams) error { 375 375 - return p.executePlain("knots/fragments/knotListingFull", w, params) 376 376 - } 377 377 - 378 378 - type KnotSecretParams struct { 379 379 - Secret string 380 380 - } 381 381 - 382 382 - func (p *Pages) KnotSecret(w io.Writer, params KnotSecretParams) error { 383 383 - return p.executePlain("knots/fragments/secret", w, params) 384 384 - } 385 385 - 386 370 type SpindlesParams struct { 387 371 LoggedInUser *oauth.User 388 372 Spindles []db.Spindle

+93 -28

appview/pages/templates/knots/dashboard.html

··· 1 1 - {{ define "title" }}{{ .Registration.Domain }}{{ end }} 1 1 + {{ define "title" }}{{ .Registration.Domain }} &middot; knots{{ end }} 2 2 3 3 {{ define "content" }} 4 4 - <div class="px-6 py-4"> 5 5 - <div class="flex justify-between items-center"> 6 6 - <div id="left-side" class="flex gap-2 items-center"> 7 7 - <h1 class="text-xl font-bold dark:text-white"> 8 8 - {{ .Registration.Domain }} 9 9 - </h1> 10 10 - <span class="text-gray-500 text-base"> 11 11 - {{ template "repo/fragments/shortTimeAgo" .Registration.Created }} 4 4 + <div class="px-6 py-4"> 5 5 + <div class="flex justify-between items-center"> 6 6 + <h1 class="text-xl font-bold dark:text-white">{{ .Registration.Domain }}</h1> 7 7 + <div id="right-side" class="flex gap-2"> 8 8 + {{ $style := "px-2 py-1 rounded flex items-center flex-shrink-0 gap-2" }} 9 9 + {{ $isOwner := and .LoggedInUser (eq .LoggedInUser.Did .Registration.ByDid) }} 10 10 + {{ if .Registration.IsRegistered }} 11 11 + <span class="bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 {{$style}}">{{ i "shield-check" "w-4 h-4" }} verified</span> 12 12 + {{ if $isOwner }} 13 13 + {{ template "knots/fragments/addMemberModal" .Registration }} 14 14 + {{ end }} 15 15 + {{ else if .Registration.IsReadOnly }} 16 16 + <span class="bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200 {{$style}}"> 17 17 + {{ i "shield-alert" "w-4 h-4" }} read-only 12 18 </span> 13 13 - </div> 14 14 - <div id="right-side" class="flex gap-2"> 15 15 - {{ $style := "px-2 py-1 rounded flex items-center flex-shrink-0 gap-2" }} 16 16 - {{ if .Registration.Registered }} 17 17 - <span class="bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 {{$style}}">{{ i "shield-check" "w-4 h-4" }} verified</span> 18 18 - {{ template "knots/fragments/addMemberModal" .Registration }} 19 19 - {{ else }} 20 20 - <span class="bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200 {{$style}}">{{ i "shield-off" "w-4 h-4" }} pending</span> 19 19 + {{ if $isOwner }} 20 20 + {{ block "retryButton" .Registration }} {{ end }} 21 21 + {{ end }} 22 22 + {{ else }} 23 23 + <span class="bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200 {{$style}}">{{ i "shield-off" "w-4 h-4" }} unverified</span> 24 24 + {{ if $isOwner }} 25 25 + {{ block "retryButton" .Registration }} {{ end }} 21 26 {{ end }} 22 22 - </div> 27 27 + {{ end }} 28 28 + 29 29 + {{ if $isOwner }} 30 30 + {{ block "deleteButton" .Registration }} {{ end }} 31 31 + {{ end }} 23 32 </div> 24 24 - <div id="operation-error" class="dark:text-red-400"></div> 25 33 </div> 34 34 + <div id="operation-error" class="dark:text-red-400"></div> 35 35 + </div> 26 36 27 27 - {{ if .Members }} 28 28 - <section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto drop-shadow-sm dark:text-white"> 29 29 - <div class="flex flex-col gap-2"> 30 30 - {{ block "knotMember" . }} {{ end }} 31 31 - </div> 32 32 - </section> 33 33 - {{ end }} 37 37 + {{ if .Members }} 38 38 + <section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto drop-shadow-sm dark:text-white"> 39 39 + <div class="flex flex-col gap-2"> 40 40 + {{ block "member" . }} {{ end }} 41 41 + </div> 42 42 + </section> 43 43 + {{ end }} 34 44 {{ end }} 35 45 36 36 - {{ define "knotMember" }} 46 46 + 47 47 + {{ define "member" }} 37 48 {{ range .Members }} 38 49 <div> 39 50 <div class="flex justify-between items-center"> ··· 41 52 {{ template "user/fragments/picHandleLink" . }} 42 53 <span class="ml-2 font-mono text-gray-500">{{.}}</span> 43 54 </div> 55 55 + {{ if ne $.LoggedInUser.Did . }} 56 56 + {{ block "removeMemberButton" (list $ . ) }} {{ end }} 57 57 + {{ end }} 44 58 </div> 45 59 <div class="ml-2 pl-2 pt-2 border-l border-gray-200 dark:border-gray-700"> 46 60 {{ $repos := index $.Repos . }} ··· 53 67 </div> 54 68 {{ else }} 55 69 <div class="text-gray-500 dark:text-gray-400"> 56 56 - No repositories created yet. 70 70 + No repositories configured yet. 57 71 </div> 58 72 {{ end }} 59 73 </div> 60 74 </div> 61 75 {{ end }} 62 76 {{ end }} 77 77 + 78 78 + {{ define "deleteButton" }} 79 79 + <button 80 80 + class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2 group" 81 81 + title="Delete knot" 82 82 + hx-delete="/knots/{{ .Domain }}" 83 83 + hx-swap="outerHTML" 84 84 + hx-confirm="Are you sure you want to delete the knot '{{ .Domain }}'?" 85 85 + hx-headers='{"shouldRedirect": "true"}' 86 86 + > 87 87 + {{ i "trash-2" "w-5 h-5" }} 88 88 + <span class="hidden md:inline">delete</span> 89 89 + {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 90 90 + </button> 91 91 + {{ end }} 92 92 + 93 93 + 94 94 + {{ define "retryButton" }} 95 95 + <button 96 96 + class="btn gap-2 group" 97 97 + title="Retry knot verification" 98 98 + hx-post="/knots/{{ .Domain }}/retry" 99 99 + hx-swap="none" 100 100 + hx-headers='{"shouldRefresh": "true"}' 101 101 + > 102 102 + {{ i "rotate-ccw" "w-5 h-5" }} 103 103 + <span class="hidden md:inline">retry</span> 104 104 + {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 105 105 + </button> 106 106 + {{ end }} 107 107 + 108 108 + 109 109 + {{ define "removeMemberButton" }} 110 110 + {{ $root := index . 0 }} 111 111 + {{ $member := index . 1 }} 112 112 + {{ $memberHandle := resolve $member }} 113 113 + <button 114 114 + class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2 group" 115 115 + title="Remove member" 116 116 + hx-post="/knots/{{ $root.Registration.Domain }}/remove" 117 117 + hx-swap="none" 118 118 + hx-vals='{"member": "{{$member}}" }' 119 119 + hx-confirm="Are you sure you want to remove {{ $memberHandle }} from this knot?" 120 120 + > 121 121 + {{ i "user-minus" "w-4 h-4" }} 122 122 + remove 123 123 + {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 124 124 + </button> 125 125 + {{ end }} 126 126 + 127 127 +

+6 -7

appview/pages/templates/knots/fragments/addMemberModal.html

··· 1 1 {{ define "knots/fragments/addMemberModal" }} 2 2 <button 3 3 class="btn gap-2 group" 4 4 - title="Add member to this spindle" 4 4 + title="Add member to this knot" 5 5 popovertarget="add-member-{{ .Id }}" 6 6 popovertargetaction="toggle" 7 7 > ··· 20 20 21 21 {{ define "addKnotMemberPopover" }} 22 22 <form 23 23 - hx-put="/knots/{{ .Domain }}/member" 23 23 + hx-post="/knots/{{ .Domain }}/add" 24 24 hx-indicator="#spinner" 25 25 hx-swap="none" 26 26 class="flex flex-col gap-2" ··· 28 28 <label for="member-did-{{ .Id }}" class="uppercase p-0"> 29 29 ADD MEMBER 30 30 </label> 31 31 - <p class="text-sm text-gray-500 dark:text-gray-400">Members can create repositories on this knot.</p> 31 31 + <p class="text-sm text-gray-500 dark:text-gray-400">Members can create repositories and run workflows on this knot.</p> 32 32 <input 33 33 type="text" 34 34 id="member-did-{{ .Id }}" 35 35 - name="subject" 35 35 + name="member" 36 36 required 37 37 placeholder="@foo.bsky.social" 38 38 /> 39 39 <div class="flex gap-2 pt-2"> 40 40 - <button 40 40 + <button 41 41 type="button" 42 42 popovertarget="add-member-{{ .Id }}" 43 43 popovertargetaction="hide" ··· 54 54 </div> 55 55 <div id="add-member-error-{{ .Id }}" class="text-red-500 dark:text-red-400"></div> 56 56 </form> 57 57 - {{ end }} 58 58 - 57 57 + {{ end }}

+46 -23

appview/pages/templates/knots/fragments/knotListing.html

··· 1 1 {{ define "knots/fragments/knotListing" }} 2 2 - <div 3 3 - id="knot-{{.Id}}" 4 4 - hx-swap-oob="true" 5 5 - class="flex items-center justify-between p-2 border-b border-gray-200 dark:border-gray-700"> 6 6 - {{ block "listLeftSide" . }} {{ end }} 7 7 - {{ block "listRightSide" . }} {{ end }} 2 2 + <div id="knot-{{.Id}}" class="flex items-center justify-between p-2 border-b border-gray-200 dark:border-gray-700"> 3 3 + {{ block "knotLeftSide" . }} {{ end }} 4 4 + {{ block "knotRightSide" . }} {{ end }} 8 5 </div> 9 6 {{ end }} 10 7 11 11 - {{ define "listLeftSide" }} 8 8 + {{ define "knotLeftSide" }} 9 9 + {{ if .Registered }} 10 10 + <a href="/knots/{{ .Domain }}" class="hover:no-underline flex items-center gap-2 min-w-0 max-w-[60%]"> 11 11 + {{ i "hard-drive" "w-4 h-4" }} 12 12 + <span class="hover:underline"> 13 13 + {{ .Domain }} 14 14 + </span> 15 15 + <span class="text-gray-500"> 16 16 + {{ template "repo/fragments/shortTimeAgo" .Created }} 17 17 + </span> 18 18 + </a> 19 19 + {{ else }} 12 20 <div class="hover:no-underline flex items-center gap-2 min-w-0 max-w-[60%]"> 13 21 {{ i "hard-drive" "w-4 h-4" }} 14 14 - {{ if .Registered }} 15 15 - <a href="/knots/{{ .Domain }}"> 16 16 - {{ .Domain }} 17 17 - </a> 18 18 - {{ else }} 19 19 - {{ .Domain }} 20 20 - {{ end }} 22 22 + {{ .Domain }} 21 23 <span class="text-gray-500"> 22 24 {{ template "repo/fragments/shortTimeAgo" .Created }} 23 25 </span> 24 26 </div> 27 27 + {{ end }} 25 28 {{ end }} 26 29 27 27 - {{ define "listRightSide" }} 30 30 + {{ define "knotRightSide" }} 28 31 <div id="right-side" class="flex gap-2"> 29 32 {{ $style := "px-2 py-1 rounded flex items-center flex-shrink-0 gap-2 text-sm" }} 30 33 {{ if .Registered }} 31 34 <span class="bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 {{$style}}">{{ i "shield-check" "w-4 h-4" }} verified</span> 32 35 {{ template "knots/fragments/addMemberModal" . }} 33 36 {{ else }} 34 34 - <span class="bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200 {{$style}}">{{ i "shield-off" "w-4 h-4" }} pending</span> 35 35 - {{ block "initializeButton" . }} {{ end }} 37 37 + <span class="bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200 {{$style}}"> 38 38 + {{ i "shield-off" "w-4 h-4" }} unverified 39 39 + </span> 40 40 + {{ block "knotRetryButton" . }} {{ end }} 41 41 + {{ block "knotDeleteButton" . }} {{ end }} 36 42 {{ end }} 37 43 </div> 38 44 {{ end }} 39 45 40 40 - {{ define "initializeButton" }} 46 46 + {{ define "knotDeleteButton" }} 41 47 <button 42 42 - class="btn dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 flex gap-2 items-center group" 43 43 - hx-post="/knots/{{ .Domain }}/init" 44 44 - hx-swap="none" 48 48 + class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2 group" 49 49 + title="Delete knot" 50 50 + hx-delete="/knots/{{ .Domain }}" 51 51 + hx-swap="outerHTML" 52 52 + hx-target="#knot-{{.Id}}" 53 53 + hx-confirm="Are you sure you want to delete the knot '{{ .Domain }}'?" 45 54 > 46 46 - {{ i "square-play" "w-5 h-5" }} 47 47 - <span class="hidden md:inline">initialize</span> 55 55 + {{ i "trash-2" "w-5 h-5" }} 56 56 + <span class="hidden md:inline">delete</span> 48 57 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 49 58 </button> 50 59 {{ end }} 51 60 61 61 + 62 62 + {{ define "knotRetryButton" }} 63 63 + <button 64 64 + class="btn gap-2 group" 65 65 + title="Retry knot verification" 66 66 + hx-post="/knots/{{ .Domain }}/retry" 67 67 + hx-swap="none" 68 68 + hx-target="#knot-{{.Id}}" 69 69 + > 70 70 + {{ i "rotate-ccw" "w-5 h-5" }} 71 71 + <span class="hidden md:inline">retry</span> 72 72 + {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 73 73 + </button> 74 74 + {{ end }}

-18

appview/pages/templates/knots/fragments/knotListingFull.html

··· 1 1 - {{ define "knots/fragments/knotListingFull" }} 2 2 - <section 3 3 - id="knot-listing-full" 4 4 - hx-swap-oob="true" 5 5 - class="rounded w-full flex flex-col gap-2"> 6 6 - <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">your knots</h2> 7 7 - <div class="flex flex-col rounded border border-gray-200 dark:border-gray-700 w-full"> 8 8 - {{ range $knot := .Registrations }} 9 9 - {{ template "knots/fragments/knotListing" . }} 10 10 - {{ else }} 11 11 - <div class="flex items-center justify-center p-2 border-b border-gray-200 dark:border-gray-700 text-gray-500"> 12 12 - no knots registered yet 13 13 - </div> 14 14 - {{ end }} 15 15 - </div> 16 16 - <div id="operation-error" class="text-red-500 dark:text-red-400"></div> 17 17 - </section> 18 18 - {{ end }}

-10

appview/pages/templates/knots/fragments/secret.html

··· 1 1 - {{ define "knots/fragments/secret" }} 2 2 - <div 3 3 - id="secret" 4 4 - hx-swap-oob="true" 5 5 - class="bg-gray-50 dark:bg-gray-700 border border-black dark:border-gray-500 rounded px-6 py-2 w-full lg:w-3xl"> 6 6 - <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">generated secret</h2> 7 7 - <p class="pb-2">Configure your knot to use this secret, and then hit initialize.</p> 8 8 - <span class="font-mono overflow-x">{{ .Secret }}</span> 9 9 - </div> 10 10 - {{ end }}

+22 -7

appview/pages/templates/knots/index.html

··· 8 8 <section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto drop-shadow-sm dark:text-white"> 9 9 <div class="flex flex-col gap-6"> 10 10 {{ block "about" . }} {{ end }} 11 11 - {{ template "knots/fragments/knotListingFull" . }} 11 11 + {{ block "list" . }} {{ end }} 12 12 {{ block "register" . }} {{ end }} 13 13 </div> 14 14 </section> ··· 27 27 </section> 28 28 {{ end }} 29 29 30 30 + {{ define "list" }} 31 31 + <section class="rounded w-full flex flex-col gap-2"> 32 32 + <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">your knots</h2> 33 33 + <div class="flex flex-col rounded border border-gray-200 dark:border-gray-700 w-full"> 34 34 + {{ range $registration := .Registrations }} 35 35 + {{ template "knots/fragments/knotListing" . }} 36 36 + {{ else }} 37 37 + <div class="flex items-center justify-center p-2 border-b border-gray-200 dark:border-gray-700 text-gray-500"> 38 38 + no knots registered yet 39 39 + </div> 40 40 + {{ end }} 41 41 + </div> 42 42 + <div id="operation-error" class="text-red-500 dark:text-red-400"></div> 43 43 + </section> 44 44 + {{ end }} 45 45 + 30 46 {{ define "register" }} 31 31 - <section class="rounded max-w-2xl flex flex-col gap-2"> 47 47 + <section class="rounded w-full lg:w-fit flex flex-col gap-2"> 32 48 <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">register a knot</h2> 33 33 - <p class="mb-2 dark:text-gray-300">Enter the hostname of your knot to generate a key.</p> 49 49 + <p class="mb-2 dark:text-gray-300">Enter the hostname of your knot to get started.</p> 34 50 <form 35 35 - hx-post="/knots/key" 36 36 - class="space-y-4" 51 51 + hx-post="/knots/register" 52 52 + class="max-w-2xl mb-2 space-y-4" 37 53 hx-indicator="#register-button" 38 54 hx-swap="none" 39 55 > ··· 53 69 > 54 70 <span class="inline-flex items-center gap-2"> 55 71 {{ i "plus" "w-4 h-4" }} 56 56 - generate 72 72 + register 57 73 </span> 58 74 <span class="pl-2 hidden group-[.htmx-request]:inline"> 59 75 {{ i "loader-circle" "w-4 h-4 animate-spin" }} ··· 64 80 <div id="registration-error" class="error dark:text-red-400"></div> 65 81 </form> 66 82 67 67 - <div id="secret"></div> 68 83 </section> 69 84 {{ end }}

+2 -2

appview/pages/templates/spindles/fragments/addMemberModal.html

··· 14 14 id="add-member-{{ .Instance }}" 15 15 popover 16 16 class="bg-white w-full md:w-96 dark:bg-gray-800 p-4 rounded border border-gray-200 dark:border-gray-700 drop-shadow dark:text-white backdrop:bg-gray-400/50 dark:backdrop:bg-gray-800/50"> 17 17 - {{ block "addMemberPopover" . }} {{ end }} 17 17 + {{ block "addSpindleMemberPopover" . }} {{ end }} 18 18 </div> 19 19 {{ end }} 20 20 21 21 - {{ define "addMemberPopover" }} 21 21 + {{ define "addSpindleMemberPopover" }} 22 22 <form 23 23 hx-post="/spindles/{{ .Instance }}/add" 24 24 hx-indicator="#spinner"

+8 -8

appview/pages/templates/spindles/fragments/spindleListing.html

··· 1 1 {{ define "spindles/fragments/spindleListing" }} 2 2 <div id="spindle-{{.Id}}" class="flex items-center justify-between p-2 border-b border-gray-200 dark:border-gray-700"> 3 3 - {{ block "leftSide" . }} {{ end }} 4 4 - {{ block "rightSide" . }} {{ end }} 3 3 + {{ block "spindleLeftSide" . }} {{ end }} 4 4 + {{ block "spindleRightSide" . }} {{ end }} 5 5 </div> 6 6 {{ end }} 7 7 8 8 - {{ define "leftSide" }} 8 8 + {{ define "spindleLeftSide" }} 9 9 {{ if .Verified }} 10 10 <a href="/spindles/{{ .Instance }}" class="hover:no-underline flex items-center gap-2 min-w-0 max-w-[60%]"> 11 11 {{ i "hard-drive" "w-4 h-4" }} ··· 25 25 {{ end }} 26 26 {{ end }} 27 27 28 28 - {{ define "rightSide" }} 28 28 + {{ define "spindleRightSide" }} 29 29 <div id="right-side" class="flex gap-2"> 30 30 {{ $style := "px-2 py-1 rounded flex items-center flex-shrink-0 gap-2 text-sm" }} 31 31 {{ if .Verified }} ··· 33 33 {{ template "spindles/fragments/addMemberModal" . }} 34 34 {{ else }} 35 35 <span class="bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200 {{$style}}">{{ i "shield-off" "w-4 h-4" }} unverified</span> 36 36 - {{ block "retryButton" . }} {{ end }} 36 36 + {{ block "spindleRetryButton" . }} {{ end }} 37 37 {{ end }} 38 38 - {{ block "deleteButton" . }} {{ end }} 38 38 + {{ block "spindleDeleteButton" . }} {{ end }} 39 39 </div> 40 40 {{ end }} 41 41 42 42 - {{ define "deleteButton" }} 42 42 + {{ define "spindleDeleteButton" }} 43 43 <button 44 44 class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2 group" 45 45 title="Delete spindle" ··· 55 55 {{ end }} 56 56 57 57 58 58 - {{ define "retryButton" }} 58 58 + {{ define "spindleRetryButton" }} 59 59 <button 60 60 class="btn gap-2 group" 61 61 title="Retry spindle verification"