[CORL-3103]: Make protected email domain bans customizable

client/src/core/client/admin/components/BanModal.spec.tsx

@@ -6,7 +6,6 @@ import {
   replaceHistoryLocation,
 } from "coral-framework/testHelpers";
 
-import { PROTECTED_EMAIL_DOMAINS } from "coral-common/common/lib/constants";
 import { pureMerge } from "coral-common/common/lib/utils";
 import {
   GQLNEW_USER_MODERATION,
@@ -250,7 +249,7 @@ it("does not display ban domain option for moderated domain", async () => {
 });
 
 it("does not display ban domain option for protected domain", async () => {
-  const protectedDomain = PROTECTED_EMAIL_DOMAINS.values().next().value;
+  const protectedDomain = "gmail.com";
   const protectedEmailResolver = createResolversStub<GQLResolver>({
     Query: {
       users: () => ({

client/src/core/client/admin/components/BanModal.tsx

@@ -11,7 +11,6 @@ import { Form } from "react-final-form";
 import { graphql } from "react-relay";
 
 import NotAvailable from "coral-admin/components/NotAvailable";
-import { PROTECTED_EMAIL_DOMAINS } from "coral-common/common/lib/constants";
 import { extractDomain } from "coral-common/common/lib/email";
 import {
   isOrgModerator,
@@ -77,6 +76,7 @@ interface Props {
   emailDomainModeration: UserStatusChangeContainer_settings["emailDomainModeration"];
   userRole: string;
   isMultisite: boolean;
+  protectedEmailDomains: ReadonlyArray<string>;
 }
 
 interface BanButtonProps {
@@ -141,6 +141,7 @@ const BanModal: FunctionComponent<Props> = ({
   userBanStatus,
   userRole,
   isMultisite,
+  protectedEmailDomains,
 }) => {
   const createDomainBan = useMutation(BanDomainMutation);
   const banUser = useMutation(BanUserMutation);
@@ -233,7 +234,7 @@ const BanModal: FunctionComponent<Props> = ({
     updateType !== UpdateType.NO_SITES &&
     emailDomain &&
     !domainIsConfigured &&
-    !PROTECTED_EMAIL_DOMAINS.has(emailDomain);
+    !protectedEmailDomains.includes(emailDomain);
 
   useEffect(() => {
     if (viewerIsSingleSiteMod) {

client/src/core/client/admin/components/ModerateCard/ModerateCardContainer.tsx

@@ -428,6 +428,7 @@ const ModerateCardContainer: FunctionComponent<Props> = ({
           userEmail={comment.author.email}
           userRole={comment.author.role}
           isMultisite={settings.multisite}
+          protectedEmailDomains={settings.protectedEmailDomains}
         />
       )}
     </>
@@ -530,6 +531,7 @@ const enhanced = withFragmentContainer<Props>({
   `,
   settings: graphql`
     fragment ModerateCardContainer_settings on Settings {
+      protectedEmailDomains
       locale
       wordList {
         banned

client/src/core/client/admin/components/UserStatus/UserStatusChangeContainer.tsx

@@ -239,6 +239,7 @@ const UserStatusChangeContainer: FunctionComponent<Props> = ({
           emailDomainModeration={settings.emailDomainModeration}
           userBanStatus={user.status.ban}
           userRole={user.role}
+          protectedEmailDomains={settings.protectedEmailDomains}
         />
       )}
     </>
@@ -286,6 +287,7 @@ const enhanced = withFragmentContainer<Props>({
         newUserModeration
       }
       multisite
+      protectedEmailDomains
     }
   `,
   viewer: graphql`

client/src/core/client/admin/routes/Configure/sections/Moderation/EmailDomainConfigContainer.css

@@ -0,0 +1,3 @@
+.textArea {
+  height: 150px;
+}

client/src/core/client/admin/routes/Configure/sections/Moderation/EmailDomainConfigContainer.tsx

@@ -1,23 +1,49 @@
 import { Localized } from "@fluent/react/compat";
 import React, { FunctionComponent, useState } from "react";
+import { Field } from "react-final-form";
 import { graphql } from "relay-runtime";
 
+import { formatStringList, parseStringList } from "coral-framework/lib/form";
 import { withFragmentContainer } from "coral-framework/lib/relay";
+import { validateEmailDomainList } from "coral-framework/lib/validation";
 import { AddIcon, ButtonSvgIcon } from "coral-ui/components/icons";
-import { Button, Flex, FormFieldDescription } from "coral-ui/components/v2";
+import {
+  Button,
+  Flex,
+  FormField,
+  FormFieldDescription,
+  FormFieldHeader,
+  HelperText,
+  Label,
+  Textarea,
+} from "coral-ui/components/v2";
 
 import { EmailDomainConfigContainer_settings } from "coral-admin/__generated__/EmailDomainConfigContainer_settings.graphql";
 
 import ConfigBox from "../../ConfigBox";
 import Header from "../../Header";
-
+import ValidationMessage from "../../ValidationMessage";
 import EmailDomainTableContainer from "./EmailDomainTableContainer";
 
+import styles from "./EmailDomainConfigContainer.css";
+
 interface Props {
   settings: EmailDomainConfigContainer_settings;
+  disabled: boolean;
 }
 
-const EmailDomainConfigContainer: FunctionComponent<Props> = ({ settings }) => {
+// eslint-disable-next-line no-unused-expressions
+graphql`
+  fragment EmailDomainConfigContainer_formValues on Settings {
+    protectedEmailDomains
+  }
+`;
+
+const EmailDomainConfigContainer: FunctionComponent<Props> = ({
+  settings,
+  disabled,
+}) => {
+  const { protectedEmailDomains } = settings;
   const [showDomainList, setShowDomainList] = useState(false);
 
   return (
@@ -33,8 +59,7 @@ const EmailDomainConfigContainer: FunctionComponent<Props> = ({ settings }) => {
       <Localized id="configure-moderation-emailDomains-description">
         <FormFieldDescription>
           Create rules to take action on accounts or comments based on the
-          account holder's email address domain. Action only applies to newly
-          created accounts.
+          account holder's email address domain.
         </FormFieldDescription>
       </Localized>
       <Localized
@@ -61,13 +86,51 @@ const EmailDomainConfigContainer: FunctionComponent<Props> = ({ settings }) => {
         )}
       </Flex>
       {showDomainList && <EmailDomainTableContainer settings={settings} />}
+      <FormField>
+        <FormFieldHeader>
+          <Localized id="configure-moderation-emailDomains-exceptions-header">
+            <Label component="legend">Exceptions</Label>
+          </Localized>
+        </FormFieldHeader>
+        <Localized id="configure-moderation-emailDomains-exceptions-helperText">
+          <HelperText>
+            These domains cannot be banned. Domains should be written without
+            www, for example `gmail.com`. Separate domains with a comma.
+          </HelperText>
+        </Localized>
+        <Field
+          name="protectedEmailDomains"
+          parse={parseStringList}
+          format={formatStringList}
+          validate={validateEmailDomainList}
+          defaultValue={protectedEmailDomains}
+        >
+          {({ input, meta }) => (
+            <>
+              <Textarea
+                {...input}
+                className={styles.textArea}
+                id={`configure-advanced-${input.name}`}
+                autoComplete="off"
+                autoCorrect="off"
+                autoCapitalize="off"
+                spellCheck={false}
+                fullwidth
+                disabled={disabled}
+              />
+              <ValidationMessage meta={meta} />
+            </>
+          )}
+        </Field>
+      </FormField>
     </ConfigBox>
   );
 };
 
 const enhanced = withFragmentContainer<Props>({
   settings: graphql`
     fragment EmailDomainConfigContainer_settings on Settings {
+      protectedEmailDomains
       ...EmailDomainTableContainer_settings
     }
   `,

client/src/core/client/admin/routes/Configure/sections/Moderation/EmailDomainTableContainer.css

@@ -11,3 +11,7 @@
   font-family: var(--font-family-primary);
   font-size: var(--font-size-3);
 }
+
+.textArea {
+  height: 150px;
+}

client/src/core/client/admin/routes/Configure/sections/Moderation/ModerationConfigContainer.tsx

@@ -51,7 +51,7 @@ export const ModerationConfigContainer: React.FunctionComponent<Props> = ({
       <RecentCommentHistoryConfig disabled={submitting} />
       <ExternalLinksConfigContainer disabled={submitting} settings={settings} />
       <PremoderateEmailAddressConfig disabled={submitting} />
-      <EmailDomainConfigContainer settings={settings} />
+      <EmailDomainConfigContainer disabled={submitting} settings={settings} />
     </HorizontalGutter>
   );
 };
@@ -67,6 +67,7 @@ const enhanced = withFragmentContainer<Props>({
       ...NewCommentersConfigContainer_formValues @relay(mask: false)
       ...NewCommentersConfigContainer_settings
       ...EmailDomainConfigContainer_settings
+      ...EmailDomainConfigContainer_formValues @relay(mask: false)
       ...ExternalLinksConfigContainer_formValues @relay(mask: false)
       ...ExternalLinksConfigContainer_settings
       ...PremoderateEmailAddressConfig_formValues @relay(mask: false)

client/src/core/client/admin/test/fixtures.ts

@@ -1,5 +1,6 @@
 import {
   DEFAULT_SESSION_DURATION,
+  PROTECTED_EMAIL_DOMAINS,
   TOXICITY_THRESHOLD_DEFAULT,
 } from "coral-common/common/lib/constants";
 import TIME from "coral-common/common/lib/time";
@@ -240,6 +241,7 @@ export const settings = createFixture<GQLSettings>({
       method: GQLDSA_METHOD_OF_REDRESS.NONE,
     },
   },
+  protectedEmailDomains: Array.from(PROTECTED_EMAIL_DOMAINS),
 });
 
 export const settingsWithMultisite = createFixture<GQLSettings>(

client/src/core/client/framework/lib/validation.tsx

@@ -324,6 +324,24 @@ export const validatePercentage = (min: number, max: number) =>
 export const validateDeleteConfirmation = (phrase: string) =>
   createValidator((v) => v === phrase, DELETE_CONFIRMATION_INVALID());
 
+export const validateEmailDomainList = createValidator((v) => {
+  if (!Array.isArray(v)) {
+    return false;
+  }
+
+  for (const domain of v) {
+    if (typeof domain !== "string") {
+      return false;
+    }
+
+    if (!EMAIL_DOMAIN_REGEX.test(domain)) {
+      return false;
+    }
+  }
+
+  return true;
+}, INVALID_EMAIL_DOMAIN());
+
 export const validateStrictURLList = createValidator((v) => {
   if (!Array.isArray(v)) {
     return false;
@@ -355,7 +373,6 @@ export type Condition<T = any, V = any> = (value: T, values: V) => boolean;
 /**
  * composeSomeConditions will return true when some of the conditions return
  * true, false if all return false.
- *
  * @param conditions conditions to use
  */
 export function composeSomeConditions<T = any, V = any>(

locales/en-US/admin.ftl

@@ -872,7 +872,7 @@ configure-moderation-newCommenters-comments = comments
 
 #### Email domain
 configure-moderation-emailDomains-header = Email domain
-configure-moderation-emailDomains-description = Create rules to take action on accounts or comments based on the account holder's email address domain. Action only applies to newly created accounts.
+configure-moderation-emailDomains-description = Create rules to take action on accounts or comments based on the account holder's email address domain.
 configure-moderation-emailDomains-add = Add email domain
 configure-moderation-emailDomains-edit = Edit email domain
 configure-moderation-emailDomains-addDomain = <icon></icon> Add domain
@@ -890,6 +890,8 @@ configure-moderation-emailDomains-form-editDomain = Update
 configure-moderation-emailDomains-confirmDelete = Deleting this email domain will stop any new accounts created with it from being banned or always pre-moderated. Are you sure you want to continue?
 configure-moderation-emailDomains-form-description-add = Add a domain and select the action that should be taken when on every new account created using the specified domain.
 configure-moderation-emailDomains-form-description-edit = Update the domain or action that should be taken when on every new account using the specified domain.
+configure-moderation-emailDomains-exceptions-header = Exceptions
+configure-moderation-emailDomains-exceptions-helperText = These domains cannot be banned. Domains should be written without www, for example `gmail.com`. Separate domains with a comma.
 
 configure-moderation-emailDomains-showCurrent = Show current domain list
 configure-moderation-emailDomains-hideCurrent = Hide current domain list

server/src/core/server/graph/resolvers/Settings.ts

@@ -1,3 +1,4 @@
+import { PROTECTED_EMAIL_DOMAINS } from "coral-common/common/lib/constants";
 import {
   defaultDSAConfiguration,
   defaultRTEConfiguration,
@@ -79,6 +80,9 @@ export const Settings: GQLSettingsTypeResolver<Tenant> = {
     return flairBadges;
   },
   dsa: ({ dsa = defaultDSAConfiguration }) => dsa,
+  protectedEmailDomains: ({
+    protectedEmailDomains = Array.from(PROTECTED_EMAIL_DOMAINS),
+  }) => protectedEmailDomains,
   inPageNotifications: ({
     inPageNotifications = { enabled: true, floatingBellIndicator: true },
   }) => inPageNotifications,

server/src/core/server/graph/schema/schema.graphql

@@ -2324,6 +2324,12 @@ type Settings @cacheControl(maxAge: 30) {
   """
   emailDomainModeration: [EmailDomain!]!
 
+  """
+  protectedEmailDomains is the configuration for email domains that are protected from email
+  domain moderation rules such as all accounts banned
+  """
+  protectedEmailDomains: [String!]!
+
   """
   externalProfileURL is a string template for a link to a user's
   external profile.
@@ -6728,6 +6734,12 @@ input SettingsInput {
   """
   premoderateEmailAddress: PremoderateEmailAddressConfigurationInput
 
+  """
+  protectedEmailDomains is the configuration for email domains that are protected from email
+  domain moderation rules such as all accounts banned
+  """
+  protectedEmailDomains: [String!]
+
   """
   inPageNotifications specifies the configuration for in-page notifications
   """

server/src/core/server/models/settings/settings.ts

@@ -442,6 +442,12 @@ export type Settings = GlobalModerationSettings &
      */
     topCommenter?: TopCommenterConfig;
 
+    /**
+     * protectedEmailDomains is the configuration for email domains that are protected from email
+     * domain moderation rules such as all accounts banned
+     */
+    protectedEmailDomains: string[];
+
     /**
      * inPageNotifications specifies whether or not in-page notifications are enabled
      * as an option for commenters

server/src/core/server/models/tenant/tenant.ts

@@ -2,7 +2,10 @@ import { isEmpty } from "lodash";
 import { DateTime } from "luxon";
 import { v4 as uuid } from "uuid";
 
-import { DEFAULT_SESSION_DURATION } from "coral-common/common/lib/constants";
+import {
+  DEFAULT_SESSION_DURATION,
+  PROTECTED_EMAIL_DOMAINS,
+} from "coral-common/common/lib/constants";
 import { LanguageCode } from "coral-common/common/lib/helpers/i18n/locales";
 import TIME from "coral-common/common/lib/time";
 import { DeepPartial, Sub } from "coral-common/common/lib/types";
@@ -303,6 +306,7 @@ export const combineTenantDefaultsAndInput = (
     topCommenter: {
       enabled: false,
     },
+    protectedEmailDomains: Array.from(PROTECTED_EMAIL_DOMAINS),
     inPageNotifications: {
       enabled: true,
       floatingBellIndicator: true,

server/src/core/server/services/tenant/tenant.spec.ts

@@ -2,7 +2,6 @@ import { createEmailDomain } from "./tenant";
 jest.mock("coral-server/models/user");
 jest.mock("coral-server/models/site");
 
-import { PROTECTED_EMAIL_DOMAINS } from "coral-common/common/lib/constants";
 import { UserForbiddenError } from "coral-server/errors";
 import { GQLUSER_ROLE } from "coral-server/graph/schema/__generated__/types";
 import {
@@ -67,7 +66,7 @@ it("does not create domain bans for protected domains", async () => {
     tenantID: tenant.id,
     role: GQLUSER_ROLE.ADMIN,
   });
-  const protectedDomain = PROTECTED_EMAIL_DOMAINS.values().next().value;
+  const protectedDomain = "gmail.com";
   await expect(async () =>
     createEmailDomain(mockMongo, mockRedis, mockTenantCache, tenant, viewer, {
       domain: protectedDomain,