[CORL-156] Manage user suspension status (#2419)

* wire up suspension modal

* show user suspended callout on stream

* prevent comment actions for suspended users

* set default to 3 hour suspension

* add message field to suspension

* allow custom message for suspension

* show suspend success modal

* fix type errors

* remove unused code

* update styles

* fix fixture for streams

* add suspension ui tests

* fix types

* remove warnings?

* remove snapshot

* fix merge conflicts

* allow custom email message when banning users

* fix typo

* correct message type

* use final-form in suspend modal

* refactor suspend modal to use final-form

* refactor ban modal to use final-form

* refactor userStatusChangeContainer to use useCallback

* feat: improve translated form

* fix: addressed issue caused by i18n refactor

* update getMessage to accept arguments, remove format method

* translate suspend info

* change hour format

* make message a mandatory input for suspend and ban user

* fix types in user table

* Revert "fix types in user table"

This reverts commit d396e90b88bb1bd354c5cdbdd72b6d8f1ab72929.

* fix types for user table

* fix: small review tweaks

src/core/server/queue/tasks/mailer/templates/index.ts

@@ -24,6 +24,7 @@ export type BanTemplate = UserNotificationContext<
   {
     username: string;
     organizationContactEmail: string;
+    customMessage?: string;
   }
 >;
 
@@ -33,6 +34,7 @@ export type SuspendTemplate = UserNotificationContext<
     username: string;
     until: string;
     organizationContactEmail: string;
+    customMessage?: string;
   }
 >;
 

src/core/server/queue/tasks/mailer/templates/suspend.html

@@ -2,10 +2,12 @@
 
 {% block content %}
   Hello {{ context.username }},<br/><br/>
+
   In accordance with {{ context.organizationName }}'s community guidelines, your
   account has been temporarily suspended. During the suspension, you will be
   unable to comment, flag or engage with fellow commenters. Please rejoin the
   conversation {{ context.until }}.<br/><br/>
-  If you think this has been done in error,  please contact our community team
-  at <a data-l10n-name="organizationContactEmail" href="mailto:{{ context.organizationContactEmail }}">{{ context.organizationContactEmail }}</a>.
+
+  If you think this has been done in error, please contact our community team at
+  <a data-l10n-name="organizationContactEmail" href="mailto:{{ context.organizationContactEmail }}">{{ context.organizationContactEmail }}</a>.
 {% endblock %}