feat: allow linking discord account to existing user

backend/routes/auth/discord.go

@@ -153,6 +153,56 @@ func (s *Server) discordCallback(w http.ResponseWriter, r *http.Request) error {
 	return nil
 }
 
+type linkRequest struct {
+	Ticket string `json:"ticket"`
+}
+
+func (s *Server) discordLink(w http.ResponseWriter, r *http.Request) error {
+	ctx := r.Context()
+
+	claims, _ := server.ClaimsFromContext(ctx)
+
+	// only site tokens can be used for this endpoint
+	if claims.APIToken || !claims.TokenWrite {
+		return server.APIError{Code: server.ErrInvalidToken}
+	}
+
+	req, err := Decode[linkRequest](r)
+	if err != nil {
+		return server.APIError{Code: server.ErrBadRequest}
+	}
+
+	u, err := s.DB.User(ctx, claims.UserID)
+	if err != nil {
+		return errors.Wrap(err, "getting user")
+	}
+
+	if u.Discord != nil {
+		return server.APIError{Code: server.ErrAlreadyLinked}
+	}
+
+	du := new(discordgo.User)
+	err = s.DB.GetJSON(ctx, "discord:"+req.Ticket, &du)
+	if err != nil {
+		log.Errorf("getting discord user for ticket: %v", err)
+
+		return server.APIError{Code: server.ErrInvalidTicket}
+	}
+
+	err = u.UpdateFromDiscord(ctx, s.DB, du)
+	if err != nil {
+		return errors.Wrap(err, "updating user from discord")
+	}
+
+	fields, err := s.DB.UserFields(ctx, u.ID)
+	if err != nil {
+		return errors.Wrap(err, "getting user fields")
+	}
+
+	render.JSON(w, r, dbUserToUserResponse(u, fields))
+	return nil
+}
+
 type discordSignupRequest struct {
 	Ticket     string `json:"ticket"`
 	Username   string `json:"username"`

backend/routes/auth/fedi_mastodon.go

@@ -184,6 +184,11 @@ func (s *Server) mastodonLink(w http.ResponseWriter, r *http.Request) error {
 
 	claims, _ := server.ClaimsFromContext(ctx)
 
+	// only site tokens can be used for this endpoint
+	if claims.APIToken || !claims.TokenWrite {
+		return server.APIError{Code: server.ErrInvalidToken}
+	}
+
 	req, err := Decode[fediLinkRequest](r)
 	if err != nil {
 		return server.APIError{Code: server.ErrBadRequest}

backend/routes/auth/routes.go

@@ -79,7 +79,7 @@ func Mount(srv *server.Server, r chi.Router) {
 			// takes discord signup ticket to register account
 			r.Post("/signup", server.WrapHandler(s.discordSignup))
 			// takes discord signup ticket to link to existing account
-			r.With(server.MustAuth).Post("/add-provider", server.WrapHandler(nil))
+			r.With(server.MustAuth).Post("/add-provider", server.WrapHandler(s.discordLink))
 		})
 
 		r.Route("/mastodon", func(r chi.Router) {

frontend/src/routes/auth/login/discord/+page.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
   import { onMount } from "svelte";
-  import { Alert, Button, Icon } from "sveltestrap";
+  import { Alert, Button, FormGroup, Icon, Input } from "sveltestrap";
 
   import { goto } from "$app/navigation";
   import type { APIError, MeUser } from "$lib/api/entities";
-  import { apiFetch } from "$lib/api/fetch";
+  import { apiFetch, apiFetchClient } from "$lib/api/fetch";
   import { userStore } from "$lib/store";
   import type { PageData } from "./$types";
   import ErrorAlert from "$lib/components/ErrorAlert.svelte";
@@ -69,6 +69,21 @@
       deleteError = e as APIError;
     }
   };
+
+  const linkAccount = async () => {
+    try {
+      const resp = await apiFetchClient<MeUser>("/auth/discord/add-provider", "POST", {
+        ticket: data.ticket,
+      });
+
+      localStorage.setItem("pronouns-user", JSON.stringify(resp));
+      userStore.set(resp);
+      addToast({ header: "Linked account", body: "Successfully linked account!" });
+      await goto("/settings/auth");
+    } catch (e) {
+      data.error = e as APIError;
+    }
+  };
 </script>
 
 <svelte:head>
@@ -80,33 +95,45 @@
 {#if data.error}
   <ErrorAlert error={data.error} />
 {/if}
-{#if data.ticket}
+{#if data.ticket && $userStore}
+  <div>
+    <FormGroup floating label="Discord username">
+      <Input readonly value={data.discord} />
+    </FormGroup>
+  </div>
+  <div class="my-2">
+    <FormGroup floating label="pronouns.cc username">
+      <Input readonly value={$userStore.name} />
+    </FormGroup>
+  </div>
+  <div>
+    <Button on:click={linkAccount}>Link account</Button>
+    <Button color="secondary" href="/settings/auth">Cancel</Button>
+  </div>
+{:else if data.ticket}
   <form on:submit|preventDefault={signupForm}>
     <div>
-      <label for="discord">Discord username</label>
+      <FormGroup floating label="Discord username">
-      <input id="discord" class="form-control" name="discord" disabled value={data.discord} />
+        <Input readonly value={data.discord} />
+      </FormGroup>
     </div>
     <div>
-      <label for="username">Username</label>
+      <FormGroup floating label="Username">
-      <input id="username" class="form-control" name="username" bind:value={username} />
+        <Input id="username" name="username" bind:value={username} />
+      </FormGroup>
     </div>
     {#if data.require_invite}
       <div>
-        <label for="invite">Invite code</label>
+        <FormGroup floating label="Invite code">
-        <input
+          <Input id="invite" name="invite" aria-describedby="invite-help" bind:value={invite} />
-          id="invite"
+        </FormGroup>
-          class="form-control"
-          name="invite"
-          bind:value={invite}
-          aria-describedby="invite-help"
-        />
         <div id="invite-help" class="form-text">
           <Icon name="info-circle-fill" /> You currently need an invite code to sign up. You can get
           one from an existing user.
         </div>
       </div>
     {/if}
-    <div class="form-text">
+    <div class="form-text mb-1">
       By signing up, you agree to the <a href="/page/tos">terms of service</a> and the
       <a href="/page/privacy">privacy policy</a>.
     </div>

frontend/src/routes/auth/login/mastodon/[instance]/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { onMount } from "svelte";
-  import { Alert, Button, Icon } from "sveltestrap";
+  import { Alert, Button, FormGroup, Icon, Input } from "sveltestrap";
 
   import { goto } from "$app/navigation";
   import type { APIError, MeUser } from "$lib/api/entities";
@@ -79,7 +79,7 @@
       localStorage.setItem("pronouns-user", JSON.stringify(resp));
       userStore.set(resp);
       addToast({ header: "Linked account", body: "Successfully linked account!" });
-      goto("/settings/auth");
+      await goto("/settings/auth");
     } catch (e) {
       data.error = e as APIError;
     }
@@ -97,24 +97,14 @@
 {/if}
 {#if data.ticket && $userStore}
   <div>
-    <label for="fediverse">Fediverse username</label>
+    <FormGroup floating label="Fediverse username">
-    <input
+      <Input readonly value="{data.fediverse}@{data.instance}" />
-      id="fediverse"
+    </FormGroup>
-      class="form-control"
-      name="fediverse"
-      readonly
-      value="{data.fediverse}@{data.instance}"
-    />
   </div>
-  <div>
+  <div class="my-2">
-    <label for="fediverse">pronouns.cc username</label>
+    <FormGroup floating label="pronouns.cc username">
-    <input
+      <Input readonly value={$userStore.name} />
-      id="pronounscc"
+    </FormGroup>
-      class="form-control"
-      name="pronounscc"
-      readonly
-      value={$userStore.name}
-    />
   </div>
   <div>
     <Button on:click={linkAccount}>Link account</Button>
@@ -123,36 +113,27 @@
 {:else if data.ticket}
   <form on:submit|preventDefault={signupForm}>
     <div>
-      <label for="fediverse">Fediverse username</label>
+      <FormGroup floating label="Fediverse username">
-      <input
+        <Input readonly value="{data.fediverse}@{data.instance}" />
-        id="fediverse"
+      </FormGroup>
-        class="form-control"
-        name="fediverse"
-        readonly
-        value="{data.fediverse}@{data.instance}"
-      />
     </div>
     <div>
-      <label for="username">Username</label>
+      <FormGroup floating label="Username">
-      <input id="username" class="form-control" name="username" bind:value={username} />
+        <Input id="username" name="username" bind:value={username} />
+      </FormGroup>
     </div>
     {#if data.require_invite}
       <div>
-        <label for="invite">Invite code</label>
+        <FormGroup floating label="Invite code">
-        <input
+          <Input id="invite" name="invite" aria-describedby="invite-help" bind:value={invite} />
-          id="invite"
+        </FormGroup>
-          class="form-control"
-          name="invite"
-          bind:value={invite}
-          aria-describedby="invite-help"
-        />
         <div id="invite-help" class="form-text">
           <Icon name="info-circle-fill" /> You currently need an invite code to sign up. You can get
           one from an existing user.
         </div>
       </div>
     {/if}
-    <div class="form-text">
+    <div class="form-text mb-1">
       By signing up, you agree to the <a href="/page/tos">terms of service</a> and the
       <a href="/page/privacy">privacy policy</a>.
     </div>