Web UI improvements

src/m2d/converters/utils.js

@@ -217,12 +217,12 @@ async function getViaServersQuery(roomID, api) {
  * @see https://matrix.org/blog/2024/06/20/matrix-v1.11-release/ implementation details
  * @see https://www.sqlite.org/fileformat2.html#record_format SQLite integer field size
  * @param {string} mxc
- * @returns {string?}
+ * @returns {string | undefined}
  */
 function getPublicUrlForMxc(mxc) {
 	assert(hasher, "xxhash is not ready yet")
 	const mediaParts = mxc?.match(/^mxc:\/\/([^/]+)\/(\w+)$/)
-	if (!mediaParts) return null
+	if (!mediaParts) return undefined
 
 	const serverAndMediaID = `${mediaParts[1]}/${mediaParts[2]}`
 	const unsignedHash = hasher.h64(serverAndMediaID)

src/web/pug/guild_access_denied.pug

@@ -5,12 +5,13 @@ block body
     .s-empty-state.wmx4.p48
       != icons.Spots.SpotEmptyXL
       p You need to log in to manage your servers.
-      a.s-btn.s-btn__icon.s-btn__featured.s-btn__filled(href=rel("/oauth"))
-        != icons.Icons.IconDiscord
-        = ` Log in with Discord`
-      a.s-btn.s-btn__icon.s-btn__matrix.s-btn__filled(href=rel("/log-in-with-matrix"))
-        != icons.Icons.IconChatBubble
-        = ` Log in with Matrix`
+      .d-flex.jc-center.g8
+        a.s-btn.s-btn__icon.s-btn__featured.s-btn__filled(href=rel("/oauth"))
+          != icons.Icons.IconDiscord
+          = ` Log in with Discord`
+        a.s-btn.s-btn__icon.s-btn__matrix.s-btn__filled(href=rel("/log-in-with-matrix"))
+          != icons.Icons.IconSpeechBubble
+          = ` Log in with Matrix`
 
   else if !guild_id
     .s-empty-state.wmx4.p48

src/web/pug/includes/template.pug

@@ -81,6 +81,10 @@ html(lang="en")
               else if managed.size
                 button.s-topbar--item.s-btn.s-btn__muted.s-btn__dropdown.pr24.s-user-card.bar0.fc-black(popovertarget="guilds")
                   | Your servers
+              else
+                .d-flex.ai-center
+                  .s-badge.s-badge__bot.py6.px16.bar-md
+                    | No servers available
               #guilds(popover data-popper-placement="bottom" style="display: revert; width: revert;").s-popover.overflow-visible
                 .s-popover--arrow.s-popover--arrow__tc
                 .s-popover--content.overflow-y-auto.overflow-x-hidden