From f13ca06569c765fa189822dda41904304e9718cc Mon Sep 17 00:00:00 2001
From: Chewbacca <dice.warrant-02@icloud.com>
Date: Fri, 6 Jan 2023 11:08:38 -0500
Subject: [PATCH] Use human-readable message from the API as the default

---
 .../__tests__/registration.test.tsx           | 25 ++++++++++++++++++-
 .../features/verification/registration.tsx    |  8 +++---
 2 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/app/soapbox/features/verification/__tests__/registration.test.tsx b/app/soapbox/features/verification/__tests__/registration.test.tsx
index fbde2fce3..130cefdd4 100644
--- a/app/soapbox/features/verification/__tests__/registration.test.tsx
+++ b/app/soapbox/features/verification/__tests__/registration.test.tsx
@@ -38,7 +38,11 @@ describe('<Registration />', () => {
   describe('with invalid data', () => {
     it('handles 422 errors', async() => {
       __stub(mock => {
-        mock.onPost('/api/v1/pepe/accounts').reply(422, {});
+        mock.onPost('/api/v1/pepe/accounts').reply(
+          422, {
+            error: 'user_taken',
+          },
+        );
       });
 
       render(<Registration />);
@@ -50,6 +54,25 @@ describe('<Registration />', () => {
       expect(screen.getByTestId('toast')).toHaveTextContent(/this username has already been taken/i);
     });
 
+    it('handles 422 errors with messages', async() => {
+      __stub(mock => {
+        mock.onPost('/api/v1/pepe/accounts').reply(
+          422, {
+            error: 'user_vip',
+            message: 'This username is unavailable.',
+          },
+        );
+      });
+
+      render(<Registration />);
+
+      await waitFor(() => {
+        fireEvent.submit(screen.getByTestId('button'), { preventDefault: () => {} });
+      });
+
+      expect(screen.getByTestId('toast')).toHaveTextContent(/this username is unavailable/i);
+    });
+
     it('handles generic errors', async() => {
       __stub(mock => {
         mock.onPost('/api/v1/pepe/accounts').reply(500, {});
diff --git a/app/soapbox/features/verification/registration.tsx b/app/soapbox/features/verification/registration.tsx
index d5acb1fb2..1c23018a3 100644
--- a/app/soapbox/features/verification/registration.tsx
+++ b/app/soapbox/features/verification/registration.tsx
@@ -58,9 +58,11 @@ const Registration = () => {
           intl.formatMessage(messages.success, { siteTitle: instance.title }),
         );
       })
-      .catch((error: AxiosError) => {
-        if (error?.response?.status === 422) {
-          toast.error(intl.formatMessage(messages.usernameTaken));
+      .catch((errorResponse: AxiosError<{ error: string, message: string }>) => {
+        const error = errorResponse.response?.data?.error;
+
+        if (error) {
+          toast.error(errorResponse.response?.data?.message || intl.formatMessage(messages.usernameTaken));
         } else {
           toast.error(intl.formatMessage(messages.error));
         }