From 8e5d27954d76014150512250c72187ed5db87fe7 Mon Sep 17 00:00:00 2001
From: Matthew White <matthew-white@users.noreply.github.com>
Date: Mon, 11 Dec 2023 16:48:08 -0500
Subject: [PATCH] Show custom alert message for duplicate email address

Closes getodk/central#144.
---
 src/components/user/edit/basic-details.vue    | 10 ++++-
 src/components/user/new.vue                   | 17 ++++++-
 .../user/edit/basic-details.spec.js           | 45 +++++++++++++++++++
 test/components/user/new.spec.js              | 45 +++++++++++++++++++
 transifex/strings_en.json                     | 10 +++++
 5 files changed, 124 insertions(+), 3 deletions(-)

diff --git a/src/components/user/edit/basic-details.vue b/src/components/user/edit/basic-details.vue
index 3eb9326ef..3e1e882ce 100644
--- a/src/components/user/edit/basic-details.vue
+++ b/src/components/user/edit/basic-details.vue
@@ -34,6 +34,7 @@ except according to the terms contained in the LICENSE file.
 
 <script setup>
 import { computed, inject, ref } from 'vue';
+import { equals } from 'ramda';
 import { useI18n } from 'vue-i18n';
 
 import FormGroup from '../../form-group.vue';
@@ -70,7 +71,11 @@ const submit = () => {
       user.email = data.email;
       user.displayName = data.displayName;
       user.updatedAt = data.updatedAt;
-    }
+    },
+    problemToAlert: ({ code, details }) =>
+      (code === 409.3 && equals(details.fields, ['email', 'deleted'])
+        ? t('problem.409_3', { email: details.values[0] })
+        : null)
   })
     .then(() => { alert.success(t('alert.success')); })
     .catch(noop);
@@ -86,6 +91,9 @@ const submit = () => {
     "action": {
       "update": "Update details"
     },
+    "problem": {
+      "409_3": "You cannot change your email to {email} because this account already exists. Please try another email address."
+    },
     "alert": {
       "success": "User details saved!"
     }
diff --git a/src/components/user/new.vue b/src/components/user/new.vue
index 949dafbc2..c2785060f 100644
--- a/src/components/user/new.vue
+++ b/src/components/user/new.vue
@@ -38,6 +38,8 @@ except according to the terms contained in the LICENSE file.
 </template>
 
 <script>
+import { equals } from 'ramda';
+
 import FormGroup from '../form-group.vue';
 import Modal from '../modal.vue';
 import Spinner from '../spinner.vue';
@@ -80,7 +82,15 @@ export default {
     submit() {
       const postData = { email: this.email };
       if (this.displayName !== '') postData.displayName = this.displayName;
-      this.request({ method: 'POST', url: '/v1/users', data: postData })
+      this.request({
+        method: 'POST',
+        url: '/v1/users',
+        data: postData,
+        problemToAlert: ({ code, details }) =>
+          (code === 409.3 && equals(details.fields, ['email', 'deleted'])
+            ? this.$t('problem.409_3', { email: details.values[0] })
+            : null)
+      })
         .then(response => {
           this.$emit('success', response.data);
         })
@@ -100,7 +110,10 @@ export default {
     ],
     "oidcIntroduction": [
       "Users on your login server must have a Central account to log in to Central. Once you create this account, the user on your login server with the email address you provide will be able to log in to Central."
-    ]
+    ],
+    "problem": {
+      "409_3": "It looks like {email} already has an account. Please try another email address."
+    }
   }
 }
 </i18n>
diff --git a/test/components/user/edit/basic-details.spec.js b/test/components/user/edit/basic-details.spec.js
index 9c5a8b3c7..2326cf0c6 100644
--- a/test/components/user/edit/basic-details.spec.js
+++ b/test/components/user/edit/basic-details.spec.js
@@ -96,6 +96,51 @@ describe('UserEditBasicDetails', () => {
       });
   });
 
+  describe('custom alert messages', () => {
+    beforeEach(() => {
+      mockLogin({ email: 'old@email.com' });
+    });
+
+    it('shows a message for a duplicate email', () =>
+      mockHttp()
+        .mount(UserEditBasicDetails, mountOptions())
+        .request(async (component) => {
+          await component.get('input[type="email"]').setValue('new@email.com');
+          return component.get('form').trigger('submit');
+        })
+        .respondWithProblem({
+          code: 409.3,
+          message: 'A resource already exists with email,deleted value(s) of new@email.com,false.',
+          details: {
+            fields: ['email', 'deleted'],
+            values: ['new@email.com', false]
+          }
+        })
+        .afterResponse(modal => {
+          modal.should.alert('danger', (message) => {
+            message.should.startWith('You cannot change your email to new@email.com');
+          });
+        }));
+
+    // I don't think a different uniqueness violation is currently possible.
+    // This is mostly about future-proofing.
+    it('does not show a message for a different uniqueness violation', () =>
+      mockHttp()
+        .mount(UserEditBasicDetails, mountOptions())
+        .request(async (component) => {
+          await component.get('input[type="email"]').setValue('new@email.com');
+          return component.get('form').trigger('submit');
+        })
+        .respondWithProblem({
+          code: 409.3,
+          message: 'A resource already exists with foo value(s) of bar.',
+          details: { fields: ['foo'], values: ['bar'] }
+        })
+        .afterResponse(modal => {
+          modal.should.alert('danger', 'A resource already exists with foo value(s) of bar.');
+        }));
+  });
+
   describe('after a successful response', () => {
     beforeEach(() => {
       mockLogin({ displayName: 'Old Name' });
diff --git a/test/components/user/new.spec.js b/test/components/user/new.spec.js
index 0b5625550..1d7a2fcd2 100644
--- a/test/components/user/new.spec.js
+++ b/test/components/user/new.spec.js
@@ -107,6 +107,51 @@ describe('UserNew', () => {
         modal: true
       }));
 
+  describe('custom alert messages', () => {
+    it('shows a message for a duplicate email', () =>
+      mockHttp()
+        .mount(UserNew, {
+          props: { state: true }
+        })
+        .request(async (modal) => {
+          await modal.get('input[type="email"]').setValue('new@email.com');
+          return modal.get('form').trigger('submit');
+        })
+        .respondWithProblem({
+          code: 409.3,
+          message: 'A resource already exists with email,deleted value(s) of new@email.com,false.',
+          details: {
+            fields: ['email', 'deleted'],
+            values: ['new@email.com', false]
+          }
+        })
+        .afterResponse(modal => {
+          modal.should.alert('danger', (message) => {
+            message.should.startWith('It looks like new@email.com already has an account.');
+          });
+        }));
+
+    // I don't think a different uniqueness violation is currently possible.
+    // This is mostly about future-proofing.
+    it('does not shows a message for a different uniqueness violation', () =>
+      mockHttp()
+        .mount(UserNew, {
+          props: { state: true }
+        })
+        .request(async (modal) => {
+          await modal.get('input[type="email"]').setValue('new@email.com');
+          return modal.get('form').trigger('submit');
+        })
+        .respondWithProblem({
+          message: 'A resource already exists with foo value(s) of bar.',
+          code: 409.3,
+          details: { fields: ['foo'], values: ['bar'] }
+        })
+        .afterResponse(modal => {
+          modal.should.alert('danger', 'A resource already exists with foo value(s) of bar.');
+        }));
+  });
+
   describe('after a successful response', () => {
     const submitWithSuccess = () => load('/users', { root: false })
       .complete()
diff --git a/transifex/strings_en.json b/transifex/strings_en.json
index af273294e..8ccea88dd 100644
--- a/transifex/strings_en.json
+++ b/transifex/strings_en.json
@@ -4280,6 +4280,11 @@
           "developer_comment": "This is the text for an action, for example, the text of a button."
         }
       },
+      "problem": {
+        "409_3": {
+          "string": "You cannot change your email to {email} because this account already exists. Please try another email address."
+        }
+      },
       "alert": {
         "success": {
           "string": "User details saved!"
@@ -4366,6 +4371,11 @@
         "0": {
           "string": "Users on your login server must have a Central account to log in to Central. Once you create this account, the user on your login server with the email address you provide will be able to log in to Central."
         }
+      },
+      "problem": {
+        "409_3": {
+          "string": "It looks like {email} already has an account. Please try another email address."
+        }
       }
     },
     "UserResetPassword": {