Log in with Matrix

package-lock.json

@@ -924,9 +924,10 @@
       "dev": true
     },
     "node_modules/@stackoverflow/stacks": {
-      "version": "2.5.7",
+      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@stackoverflow/stacks/-/stacks-2.5.7.tgz",
+      "resolved": "https://registry.npmjs.org/@stackoverflow/stacks/-/stacks-2.7.0.tgz",
-      "integrity": "sha512-1ipTt7jqUszyd78Gn9TADT22PL0yXe14iEfgZyvJlDvrNrmyJLoGsFMRMwcduPol6/C/zkFt2dmfph/5vFDcYA==",
+      "integrity": "sha512-nn4tow6oTsYlpKwOcpPeKclFMvn0Py+rWCZppRWqcEVl9w2+U+nU7QyKsLzySvSFgXoo5hrBPWp5t7AlNVmF0A==",
+      "license": "MIT",
       "dependencies": {
         "@hotwired/stimulus": "^3.2.2",
         "@popperjs/core": "^2.11.8"

src/matrix/api.js

@@ -377,6 +377,27 @@ async function getAlias(alias) {
 	return root.room_id
 }
 
+/**
+ * @param {string} type namespaced event type, e.g. m.direct
+ * @param {string} [mxid] you
+ * @returns the *content* of the account data "event"
+ */
+async function getAccountData(type, mxid) {
+	if (!mxid) mxid = `@${reg.sender_localpart}:${reg.ooye.server_name}`
+	const root = await mreq.mreq("GET", `/client/v3/user/${mxid}/account_data/${type}`)
+	return root
+}
+
+/**
+ * @param {string} type namespaced event type, e.g. m.direct
+ * @param {any} content whatever you want
+ * @param {string} [mxid] you
+ */
+async function setAccountData(type, content, mxid) {
+	if (!mxid) mxid = `@${reg.sender_localpart}:${reg.ooye.server_name}`
+	await mreq.mreq("PUT", `/client/v3/user/${mxid}/account_data/${type}`, content)
+}
+
 module.exports.path = path
 module.exports.register = register
 module.exports.createRoom = createRoom
@@ -406,3 +427,5 @@ module.exports.getMedia = getMedia
 module.exports.sendReadReceipt = sendReadReceipt
 module.exports.ackEvent = ackEvent
 module.exports.getAlias = getAlias
+module.exports.getAccountData = getAccountData
+module.exports.setAccountData = setAccountData

src/web/pug-sync.js

@@ -35,12 +35,13 @@ function render(event, filename, locals) {
 			pugCache.set(path, async (event, locals) => {
 				defaultContentType(event, "text/html; charset=utf-8")
 				const session = await useSession(event, {password: reg.as_token})
+				const managed = (session.data.managedGuilds || []).concat(session.data.matrixGuilds || [])
 				const rel = x => getRelativePath(event.path, x)
 				return template(Object.assign({},
 					getQuery(event), // Query parameters can be easily accessed on the top level but don't allow them to overwrite anything
 					globals, // Globals
 					locals, // Explicit locals overwrite globals in case we need to DI something
-					{session, event, rel} // These are assigned last so they overwrite everything else. It would be catastrophically bad if they can't be trusted.
+					{session, event, rel, managed} // These are assigned last so they overwrite everything else. It would be catastrophically bad if they can't be trusted.
 				))
 			})
 		/* c8 ignore start */

src/web/pug/guild_access_denied.pug

@@ -1,13 +1,16 @@
 extends includes/template.pug
 
 block body
-  if !session.data.managedGuilds
+  if !managed
     .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__filled(href=rel("/oauth"))
+      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`
 
   else if !guild_id
     .s-empty-state.wmx4.p48
@@ -15,7 +18,7 @@ block body
       p Select a server from the top right corner to continue.
       p If the server you're looking for isn't there, try #[a(href=rel("/oauth?action=add")) logging in again.]
 
-  else if !discord.guilds.has(guild_id) || !session.data.managedGuilds.includes(guild_id)
+  else if !discord.guilds.has(guild_id) || !managed.includes(guild_id)
     .s-empty-state.wmx4.p48
       != icons.Spots.SpotAlertXL
       p Either the selected server doesn't exist, or you don't have the Manage Server permission on Discord.

src/web/pug/includes/template.pug

@@ -30,6 +30,31 @@ html(lang="en")
         --_ts-multiple-bg: var(--green-400);
         --_ts-multiple-fc: var(--white);
       }
+      .s-btn.s-btn__matrix {
+        --_bu-bg-active: var(--black-300);
+        --_bu-bg-hover: var(--black-200);
+        --_bu-bg-selected: var(--black-300);
+        --_bu-fc: var(--black-500);
+        --_bu-fc-active: var(--_bu-fc);
+        --_bu-fc-hover: var(--black-500);
+        --_bu-fc-selected: var(--black-600);
+        --_bu-filled-bc: transparent;
+        --_bu-filled-bc-selected: var(--_bu-filled-bc);
+        --_bu-filled-bg: var(--black-400);
+        --_bu-filled-bg-active: var(--black-500);
+        --_bu-filled-bg-hover: var(--black-500);
+        --_bu-filled-bg-selected: var(--black-600);
+        --_bu-filled-fc: var(--white);
+        --_bu-filled-fc-active: var(--_bu-filled-fc);
+        --_bu-filled-fc-hover: var(--_bu-filled-fc);
+        --_bu-filled-fc-selected: var(--_bu-filled-fc);
+        --_bu-outlined-bc: var(--black-400);
+        --_bu-outlined-bc-selected: var(--black-500);
+        --_bu-outlined-bg-selected: var(--_bu-bg-selected);
+        --_bu-outlined-fc-selected: var(--_bu-fc-selected);
+        --_bu-number-fc: var(--white);
+        --_bu-number-fc-filled: var(--black);
+      }
   body.themed.theme-system
     header.s-topbar
       .s-topbar--skip-link(href="#content") Skip to main content
@@ -38,22 +63,26 @@ html(lang="en")
           img.s-avatar.s-avatar__32(src=rel("/icon.png"))
         nav.s-topbar--navigation
           ul.s-topbar--content
-            li.ps-relative
+            li.ps-relative.g8
-              if !session.data.managedGuilds || session.data.managedGuilds.length === 0
+              if !session.data.mxid
-                a.s-btn.s-btn__icon.as-center(href=rel("/oauth"))
+                a.s-btn.s-btn__icon.s-btn__matrix.s-btn__outlined.as-center(href=rel("/log-in-with-matrix"))
+                  != icons.Icons.IconSpeechBubble
+                  = ` Log in with Matrix`
+              if !session.data.userID
+                a.s-btn.s-btn__icon.s-btn__featured.s-btn__outlined.as-center(href=rel("/oauth"))
                   != icons.Icons.IconDiscord
-                  = ` Log in`
+                  = ` Log in with Discord`
-              else if guild_id && session.data.managedGuilds.includes(guild_id) && discord.guilds.has(guild_id)
+              if guild_id && managed.includes(guild_id) && discord.guilds.has(guild_id)
                 button.s-topbar--item.s-btn.s-btn__muted.s-user-card(popovertarget="guilds")
                   +guild(discord.guilds.get(guild_id))
-              else if session.data.managedGuilds
+              else if managed.length
                 button.s-topbar--item.s-btn.s-btn__muted.s-btn__dropdown.pr24.s-user-card.s-label(popovertarget="guilds")
                   | Your servers
               #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
                   ul.s-menu(role="menu")
-                    each guild in (session.data.managedGuilds || []).map(id => discord.guilds.get(id)).filter(g => g)
+                    each guild in managed.map(id => discord.guilds.get(id)).filter(g => g)
                       li(role="menuitem")
                         a.s-topbar--item.s-user-card.d-flex.p4(href=rel(`/guild?guild_id=${guild.id}`))
                           +guild(guild)

src/web/pug/log-in-with-matrix.pug

@@ -0,0 +1,14 @@
+extends includes/template.pug
+
+block body
+  .s-page-title.mb24
+    h1.s-page-title--header Log in with Matrix
+
+  .d-flex.g16#form-container
+    .fl-grow1
+      form.d-flex.gy16.fd-column(method="post" action="/api/log-in-with-matrix" hx-post="/api/log-in-with-matrix" hx-indicator="#log-in-button" hx-select="#ok" hx-target="#form-container")
+        .d-flex.gy4.fd-column
+          label.s-label(for="mxid") Your Matrix ID
+          input.fl-grow1.s-input.wmx3#mxid(name="mxid" required placeholder="@user:example.org")
+        div
+          button.s-btn.s-btn__github#log-in-button Continue with Matrix

src/web/pug/ok.pug

@@ -2,5 +2,5 @@ extends includes/template.pug
 
 block body
   .ta-center.wmx5.p48.mx-auto#ok
-    != icons.Spots.SpotApproveXL
+    != spot ? icons.Spots[spot] : icons.Spots.SpotApproveXL
     p.mt24.fs-body2= msg

src/web/routes/guild-settings.js

@@ -26,7 +26,7 @@ const schema = {
 as.router.post("/api/autocreate", defineEventHandler(async event => {
 	const parsedBody = await readValidatedBody(event, schema.autocreate.parse)
 	const session = await useSession(event, {password: reg.as_token})
-	if (!(session.data.managedGuilds || []).includes(parsedBody.guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't change settings for a guild you don't have Manage Server permissions in"})
+	if (!(session.data.managedGuilds || []).concat(session.data.matrixGuilds || []).includes(parsedBody.guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't change settings for a guild you don't have Manage Server permissions in"})
 
 	db.prepare("UPDATE guild_active SET autocreate = ? WHERE guild_id = ?").run(+!!parsedBody.autocreate, parsedBody.guild_id)
 	return null // 204
@@ -35,7 +35,7 @@ as.router.post("/api/autocreate", defineEventHandler(async event => {
 as.router.post("/api/privacy-level", defineEventHandler(async event => {
 	const parsedBody = await readValidatedBody(event, schema.privacyLevel.parse)
 	const session = await useSession(event, {password: reg.as_token})
-	if (!(session.data.managedGuilds || []).includes(parsedBody.guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't change settings for a guild you don't have Manage Server permissions in"})
+	if (!(session.data.managedGuilds || []).concat(session.data.matrixGuilds || []).includes(parsedBody.guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't change settings for a guild you don't have Manage Server permissions in"})
 
 	const i = levels.indexOf(parsedBody.level)
 	assert.notEqual(i, -1)

src/web/routes/guild.js

@@ -114,7 +114,7 @@ as.router.get("/guild", defineEventHandler(async event => {
 	const guild = discord.guilds.get(guild_id)
 
 	// Permission problems
-	if (!guild_id || !guild || !session.data.managedGuilds || !session.data.managedGuilds.includes(guild_id)) {
+	if (!guild_id || !guild || !(session.data.managedGuilds || []).concat(session.data.matrixGuilds || []).includes(guild_id)) {
 		return pugSync.render(event, "guild_access_denied.pug", {guild_id})
 	}
 
@@ -159,7 +159,7 @@ as.router.post("/api/invite", defineEventHandler(async event => {
 	// Check guild ID or nonce
 	if (parsedBody.guild_id) {
 		var guild_id = parsedBody.guild_id
-		if (!(session.data.managedGuilds || []).includes(guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't invite users to a guild you don't have Manage Server permissions in"})
+		if (!(session.data.managedGuilds || []).concat(session.data.matrixGuilds || []).includes(guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't invite users to a guild you don't have Manage Server permissions in"})
 	} else if (parsedBody.nonce) {
 		if (!validNonce.has(parsedBody.nonce)) throw createError({status: 403, message: "Nonce expired", data: "Nonce means number-used-once, and, well, you tried to use it twice..."})
 		let ok = validNonce.get(parsedBody.nonce)

src/web/routes/link.js

@@ -33,7 +33,7 @@ as.router.post("/api/link", defineEventHandler(async event => {
 
 	// Check guild ID or nonce
 	const guildID = parsedBody.guild_id
-	if (!(session.data.managedGuilds || []).includes(guildID)) throw createError({status: 403, message: "Forbidden", data: "Can't edit a guild you don't have Manage Server permissions in"})
+	if (!(session.data.managedGuilds || []).concat(session.data.matrixGuilds || []).includes(guildID)) throw createError({status: 403, message: "Forbidden", data: "Can't edit a guild you don't have Manage Server permissions in"})
 
 	// Check guild is bridged
 	const guild = discord.guilds.get(guildID)
@@ -81,7 +81,7 @@ as.router.post("/api/unlink", defineEventHandler(async event => {
 	const session = await useSession(event, {password: reg.as_token})
 
 	// Check guild ID or nonce
-	if (!(session.data.managedGuilds || []).includes(guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't edit a guild you don't have Manage Server permissions in"})
+	if (!(session.data.managedGuilds || []).concat(session.data.matrixGuilds || []).includes(guild_id)) throw createError({status: 403, message: "Forbidden", data: "Can't edit a guild you don't have Manage Server permissions in"})
 
 	// Check channel is part of this guild
 	const channel = discord.channels.get(channel_id)

src/web/routes/log-in-with-matrix.js

@@ -0,0 +1,126 @@
+// @ts-check
+
+const {z} = require("zod")
+const {randomUUID} = require("crypto")
+const {defineEventHandler, getValidatedQuery, sendRedirect, readValidatedBody, useSession, createError, getRequestHeader} = require("h3")
+const {SnowTransfer} = require("snowtransfer")
+const DiscordTypes = require("discord-api-types/v10")
+const fetch = require("node-fetch")
+const getRelativePath = require("get-relative-path")
+const {LRUCache} = require("lru-cache")
+
+const {as, db, select, from} = require("../../passthrough")
+const {id} = require("../../../addbot")
+const {reg} = require("../../matrix/read-registration")
+
+const {sync} = require("../../passthrough")
+const assert = require("assert").strict
+/** @type {import("../pug-sync")} */
+const pugSync = sync.require("../pug-sync")
+/** @type {import("../../matrix/api")} */
+const api = sync.require("../../matrix/api")
+
+const redirect_uri = `${reg.ooye.bridge_origin}/oauth`
+
+const schema = {
+	form: z.object({
+		mxid: z.string()
+	}),
+	token: z.object({
+		token: z.string()
+	})
+}
+
+/** @type {LRUCache<string, string>} token to mxid */
+const validToken = new LRUCache({max: 200})
+
+/*
+	1st request, GET, they clicked the button, need to input their mxid
+	2nd request, POST, they input their mxid and we need to send a link
+	3rd request, GET, they clicked the link and we need to set the session data (just their mxid)
+*/
+
+as.router.get("/log-in-with-matrix", defineEventHandler(async event => {
+	const parsed = await getValidatedQuery(event, schema.token.safeParse)
+
+	if (!parsed.success) {
+		// We are in the first request and need to tell them to input their mxid
+		return pugSync.render(event, "log-in-with-matrix.pug", {})
+	}
+
+	const userAgent = getRequestHeader(event, "User-Agent")
+	if (userAgent?.match(/bot/)) throw createError({status: 400, data: "Sorry URL previewer, you can't have this URL."})
+
+	const token = parsed.data.token
+	if (!validToken.has(token)) return sendRedirect(event, `${reg.ooye.bridge_origin}/log-in-with-matrix`, 302)
+
+	const session = await useSession(event, {password: reg.as_token})
+	const mxid = validToken.get(token)
+	assert(mxid)
+	validToken.delete(token)
+
+	const matrixGuilds = db.prepare("SELECT guild_id FROM guild_space INNER JOIN member_cache ON space_id = room_id WHERE mxid = ? AND power_level >= 50").pluck().all(mxid)
+
+	await session.update({mxid, matrixGuilds})
+
+	return sendRedirect(event, "./", 302) // open to homepage where they can see they're logged in
+}))
+
+as.router.post("/api/log-in-with-matrix", defineEventHandler(async event => {
+	const {mxid} = await readValidatedBody(event, schema.form.parse)
+	let roomID = null
+
+	// Don't extend a duplicate invite for the same user
+	for (const alreadyInvited of validToken.values()) {
+		if (mxid === alreadyInvited) {
+			return sendRedirect(event, "../ok?msg=We already sent you a link on Matrix. Please click it!", 302)
+		}
+	}
+
+	// See if we can reuse an existing room from account data
+	let directData = {}
+	try {
+		directData = await api.getAccountData("m.direct")
+	} catch (e) {}
+	const rooms = directData[mxid] || []
+	for (const candidate of rooms) {
+		// Check that the person is/still in the room
+		let member
+		try {
+			member = await api.getStateEvent(candidate, "m.room.member", mxid)
+		} catch (e) {}
+		if (!member || member.membership === "leave") {
+			// We can reinvite them back to the same room!
+			await api.inviteToRoom(candidate, mxid)
+			roomID = candidate
+		} else {
+			// Member is in this room
+			roomID = candidate
+		}
+		if (roomID) break	// no need to check other candidates
+	}
+
+	// No candidates available, create a new room and invite
+	if (!roomID) {
+		roomID = await api.createRoom({
+			invite: [mxid],
+			is_direct: true,
+			preset: "trusted_private_chat"
+		})
+		// Store the newly created room in account data (Matrix doesn't do this for us automatically, sigh...)
+		;(directData[mxid] ??= []).push(roomID)
+		await api.setAccountData("m.direct", directData)
+	}
+
+	const token = randomUUID()
+	validToken.set(token, mxid)
+
+	console.log(`web log in requested for ${mxid}`)
+	const body = `Hi, this is Out Of Your Element! You just clicked the "log in" button on the website.\nOpen this link to finish: ${reg.ooye.bridge_origin}/log-in-with-matrix?token=${token}\nThe link can be used once.`
+	await api.sendEvent(roomID, "m.room.message", {
+		msgtype: "m.text",
+		body
+	})
+
+	return sendRedirect(event, "../ok?msg=Please check your inbox on Matrix!&spot=SpotMailXL", 302)
+}))

src/web/routes/oauth.js

@@ -2,7 +2,7 @@
 
 const {z} = require("zod")
 const {randomUUID} = require("crypto")
-const {defineEventHandler, getValidatedQuery, sendRedirect, getQuery, useSession, createError} = require("h3")
+const {defineEventHandler, getValidatedQuery, sendRedirect, useSession, createError} = require("h3")
 const {SnowTransfer} = require("snowtransfer")
 const DiscordTypes = require("discord-api-types/v10")
 const fetch = require("node-fetch")
@@ -75,11 +75,12 @@ as.router.get("/oauth", defineEventHandler(async event => {
 		throw createError({status: 502, message: "Invalid token response", data: `Discord completed OAuth, but returned this instead of an OAuth access token: ${JSON.stringify(root)}`})
 	}
 
+	const userID = Buffer.from(parsedToken.data.access_token.split(".")[0], "base64").toString()
 	const client = new SnowTransfer(`Bearer ${parsedToken.data.access_token}`)
 	try {
 		const guilds = await client.user.getGuilds()
 		var managedGuilds = guilds.filter(g => BigInt(g.permissions) & DiscordTypes.PermissionFlagsBits.ManageGuild).map(g => g.id)
-		await session.update({managedGuilds})
+		await session.update({managedGuilds, userID, state: undefined})
 	} catch (e) {
 		throw createError({status: 502, message: "API call failed", data: e.message})
 	}

src/web/server.js

@@ -27,6 +27,7 @@ sync.require("./routes/guild-settings")
 sync.require("./routes/guild")
 sync.require("./routes/link")
 sync.require("./routes/oauth")
+sync.require("./routes/log-in-with-matrix")
 
 // Files