From bfc9e6f5c07bc2f19c9e20afa1d0bcb1a25e386d Mon Sep 17 00:00:00 2001
From: Sam <sam@sam.wf>
Date: Tue, 14 Mar 2023 17:16:11 +0100
Subject: [PATCH] fix(frontend): use display name for members if possible

---
 .../src/routes/@[username]/[memberName]/+page.svelte |  3 ++-
 frontend/src/routes/edit/member/[id]/+page.svelte    | 12 ++++++++----
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/frontend/src/routes/@[username]/[memberName]/+page.svelte b/frontend/src/routes/@[username]/[memberName]/+page.svelte
index 8fe056b..15044a2 100644
--- a/frontend/src/routes/@[username]/[memberName]/+page.svelte
+++ b/frontend/src/routes/@[username]/[memberName]/+page.svelte
@@ -25,7 +25,8 @@
 <div class="container">
   {#if $userStore && $userStore.id === data.user.id}
     <Alert color="secondary" fade={false}>
-      You are currently viewing the <strong>public</strong> profile of {data.name}.
+      You are currently viewing the <strong>public</strong> profile of {data.display_name ??
+        data.name}.
       <br /><a href="/edit/member/{data.id}">Edit profile</a>
     </Alert>
   {/if}
diff --git a/frontend/src/routes/edit/member/[id]/+page.svelte b/frontend/src/routes/edit/member/[id]/+page.svelte
index 1f4108f..498171d 100644
--- a/frontend/src/routes/edit/member/[id]/+page.svelte
+++ b/frontend/src/routes/edit/member/[id]/+page.svelte
@@ -252,22 +252,26 @@
 </script>
 
 <svelte:head>
-  <title>Edit profile - pronouns.cc</title>
+  <title>Edit member profile - pronouns.cc</title>
 </svelte:head>
 
 <h1>
-  Edit profile
+  Edit member profile
   <ButtonGroup>
     {#if modified}
       <Button color="success" on:click={() => updateMember()}>Save changes</Button>
     {/if}
-    <Button color="danger" on:click={toggleDeleteOpen}>Delete {data.member.name}</Button>
+    <Button color="danger" on:click={toggleDeleteOpen}
+      >Delete {data.member.display_name ?? data.member.name}</Button
+    >
   </ButtonGroup>
 </h1>
 
 <Modal header="Delete member" isOpen={deleteOpen} toggle={toggleDeleteOpen}>
   <ModalBody>
-    <p>If you want to delete this member, type their name below:</p>
+    <p>
+      If you want to delete this member, type their name (<code>{data.member.name}</code>) below:
+    </p>
     <p>
       <input type="text" class="form-control" bind:value={deleteName} />
     </p>