[CORL-513] Permitted Domain Fixes (#2455)

* fix: adjusted allowed domains configuration

* fix: removed unused logic around allowed domains prefixing

* fix: removed unused localizations

* fix: fixed signup flow

src/core/client/admin/routes/Configure/sections/Advanced/PermittedDomainsConfig.tsx

@@ -8,6 +8,7 @@ import {
   parseStringList,
   ValidationMessage,
 } from "coral-framework/lib/form";
+import { validateStrictURLList } from "coral-framework/lib/validation";
 import {
   FormField,
   HorizontalGutter,
@@ -32,18 +33,21 @@ const PermittedDomainsConfig: FunctionComponent<Props> = ({ disabled }) => (
         </Header>
       </Localized>
       <Localized
-        id="configure-advanced-permittedDomains-explanation"
+        id="configure-advanced-permittedDomains-description"
         strong={<strong />}
       >
         <Typography variant="detail">
-          Domains where your Coral instance is allowed to be embedded. Typical
-          use is localhost, staging.yourdomain.com, yourdomain.com, etc.
+          The domains you would like to permit for Coral, e.g. your local,
+          staging and production environments including the scheme (ex.
+          http://localhost:3000, https://staging.domain.com,
+          https://domain.com).
         </Typography>
       </Localized>
       <Field
         name="allowedDomains"
         parse={parseStringList}
         format={formatStringList}
+        validate={validateStrictURLList}
       >
         {({ input, meta }) => (
           <>

src/core/client/admin/test/configure/__snapshots__/advanced.spec.tsx.snap

@@ -299,9 +299,9 @@ each of your site’s stories.
               <p
                 className="Box-root Typography-root Typography-detail Typography-colorTextPrimary"
               >
-                Domains where your Coral instance is allowed to be embedded.
-Typical use is localhost, staging.yourdomain.com,
-yourdomain.com, etc.
+                Domains where your Coral instance is allowed to be embedded
+including the scheme (ex. http://localhost:3000, https://staging.domain.com,
+https://domain.com).
               </p>
               <div
                 className="TextField-root TextField-fullWidth"
@@ -320,7 +320,7 @@ yourdomain.com, etc.
                   placeholder=""
                   spellCheck={false}
                   type="text"
-                  value="localhost:8080"
+                  value="http://localhost:8080"
                 />
               </div>
             </div>

src/core/client/admin/test/configure/advanced.spec.tsx

@@ -216,8 +216,8 @@ it("change permitted domains to include more domains", async () => {
     Mutation: {
       updateSettings: ({ variables }) => {
         expectAndFail(variables.settings.allowedDomains).toEqual([
-          "localhost:8080",
-          "localhost:3000",
+          "http://localhost:8080",
+          "http://localhost:3000",
         ]);
         return {
           settings: pureMerge(settings, variables.settings),
@@ -238,7 +238,9 @@ it("change permitted domains to include more domains", async () => {
   );
 
   // Let's change the permitted domains.
-  permittedDomainsField.props.onChange("localhost:8080, localhost:3000");
+  permittedDomainsField.props.onChange(
+    "http://localhost:8080, http://localhost:3000"
+  );
 
   // Send form
   within(configureContainer)

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

@@ -50,7 +50,7 @@ export const settings = createFixture<GQLSettings>({
     enabled: true,
   },
   customCSSURL: "",
-  allowedDomains: ["localhost:8080"],
+  allowedDomains: ["http://localhost:8080"],
   editCommentWindowLength: 30000,
   communityGuidelines: {
     enabled: false,