Fix web loading indicators

This commit is contained in:
Cadence Ember
2025-01-31 16:42:48 +13:00
parent a459ee1d1c
commit eb4aa615be
5 changed files with 15 additions and 12 deletions

View File

@@ -38,4 +38,6 @@ passthrough.select = orm.select
await discord.cloud.connect()
console.log("Discord gateway started")
sync.require("../src/web/server")
require("../src/stdin")
})()

View File

@@ -67,7 +67,7 @@ block body
option(value="admin") Admin
input(type="hidden" name="guild_id" value=guild_id)
.grid--row-start2
button.s-btn.s-btn__filled.htmx-indicator Invite
button.s-btn.s-btn__filled Invite
div
!= svg
@@ -78,13 +78,13 @@ block body
h3.mt32.fs-category Linked channels
.s-card.bs-sm.p0
form.s-table-container(method="post" action="/api/unlink" hx-post="/api/unlink" hx-trigger="submit" hx-disabled-elt="this" hx-confirm="Unlink these channels?\nIt may take a moment to clean up Matrix resources.")
form.s-table-container(method="post" action="/api/unlink" hx-confirm="Do you want to unlink these channels?\nIt may take a moment to clean up Matrix resources.")
input(type="hidden" name="guild_id" value=guild_id)
table.s-table.s-table__bx-simple
each row in linkedChannelsWithDetails
tr
td.w40: +discord(row.channel)
td.p2: button.s-btn.s-btn__muted.s-btn__xs(name="channel_id" value=row.channel.id)!= icons.Icons.IconLinkSm
td.p2: button.s-btn.s-btn__muted.s-btn__xs(name="channel_id" value=row.channel.id hx-post="/api/unlink" hx-trigger="click" hx-disabled-elt="this")!= icons.Icons.IconLinkSm
td: +matrix(row)
else
tr
@@ -100,16 +100,16 @@ block body
- let value = !!select("guild_active", "autocreate", {guild_id}).pluck().get()
input(type="hidden" name="guild_id" value=guild_id)
input.s-toggle-switch.order-last#autocreate(name="autocreate" type="checkbox" hx-post="/api/autocreate" hx-indicator="#autocreate-loading" hx-disabled-elt="this" checked=value)
.is-loading#autocreate-loading
#autocreate-loading
h3.mt32.fs-category Privacy level
.s-card
form(hx-post="/api/privacy-level" hx-trigger="change" hx-indicator="#privacy-level-loading" hx-disabled-elt="this")
form(hx-post="/api/privacy-level" hx-trigger="change" hx-indicator="#privacy-level-loading" hx-disabled-elt="input")
input(type="hidden" name="guild_id" value=guild_id)
.d-flex.ai-center.mb4
label.s-label.fl-grow1
| How people can join on Matrix
span.is-loading#privacy-level-loading
span#privacy-level-loading
.s-toggle-switch.s-toggle-switch__multiple.s-toggle-switch__incremental.d-grid.gx16.ai-center(style="grid-template-columns: auto 1fr")
input(type="radio" name="level" value="directory" id="privacy-level-directory" checked=(privacy_level === 2))
label.d-flex.gx8.jc-center.grid--row-start3(for="privacy-level-directory")
@@ -134,23 +134,23 @@ block body
p.s-description.m0 Publicly listed in directory, like Discord server discovery
h3.mt32.fs-category Manually link channels
form.d-flex.g16.ai-start(hx-post="/api/link" hx-trigger="submit" hx-disabled-elt="this")
form.d-flex.g16.ai-start(hx-post="/api/link" hx-trigger="submit" hx-disabled-elt="input, button" hx-indicator="#link-button")
.fl-grow2.s-btn-group.fd-column.w40
each channel in unlinkedChannels
input.s-btn--radio(type="radio" name="discord" id=channel.id value=channel.id)
input.s-btn--radio(type="radio" name="discord" required id=channel.id value=channel.id)
label.s-btn.s-btn__muted.ta-left.truncate(for=channel.id)
+discord(channel, true, "Announcement")
else
.s-empty-state.p8 All Discord channels are linked.
.fl-grow1.s-btn-group.fd-column.w30
each room in unlinkedRooms
input.s-btn--radio(type="radio" name="matrix" id=room.room_id value=room.room_id)
input.s-btn--radio(type="radio" name="matrix" required id=room.room_id value=room.room_id)
label.s-btn.s-btn__muted.ta-left.truncate(for=room.room_id)
+matrix(room, true)
else
.s-empty-state.p8 All Matrix rooms are linked.
input(type="hidden" name="guild_id" value=guild_id)
div
button.s-btn.s-btn__icon.s-btn__filled.htmx-indicator
button.s-btn.s-btn__icon.s-btn__filled#link-button
!= icons.Icons.IconMerge
= ` Link`

View File

@@ -16,7 +16,7 @@ html(lang="en")
<meta name="viewport" content="width=device-width, initial-scale=1">
link(rel="stylesheet" type="text/css" href=rel("/static/stacks.min.css"))
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 80%22><text y=%22.83em%22 font-size=%2283%22>💬</text></svg>">
meta(name="htmx-config" content='{"indicatorClass":"is-loading"}')
meta(name="htmx-config" content='{"requestClass":"is-loading"}')
style.
.themed {
--theme-base-primary-color-h: 266;

View File

@@ -2,7 +2,7 @@
const assert = require("assert/strict")
const {z} = require("zod")
const {defineEventHandler, sendRedirect, useSession, createError, readValidatedBody} = require("h3")
const {defineEventHandler, useSession, createError, readValidatedBody} = require("h3")
const {as, db, sync} = require("../../passthrough")
const {reg} = require("../../matrix/read-registration")

View File

@@ -63,6 +63,7 @@ as.router.post("/api/link", defineEventHandler(async event => {
// Sync room data and space child
await createRoom.syncRoom(parsedBody.discord)
setResponseHeader(event, "HX-Refresh", "true")
return null // 204
}))