v8.5.0

.github/workflows/build-and-test.yml

@@ -6,7 +6,7 @@ on:
   merge_group:
 
 env:
-  IMAGE_REPOSITORY: 'gcr.io/the-coral-project/coral'
+  IMAGE_REPOSITORY: 'us-east1-docker.pkg.dev/the-coral-project/coral/talk'
   IMAGE_CACHE_REPOSITORY: 'coralproject/ci'
   DOCKERHUB_USERNAME: 'coralproject'
 
@@ -27,12 +27,12 @@ jobs:
         with:
           ssh-private-key: ${{ secrets.REPO_PATCHED_DEPLOY_KEY }}
       -
-        name: Login to GCR
+        name: Login to GAR
         uses: docker/login-action@v2
         with:
-          registry: gcr.io
+          registry: us-east1-docker.pkg.dev
           username: _json_key
-          password: ${{ secrets.GCR_JSON_KEY }}
+          password: ${{ secrets.GAR_JSON_KEY }}
       -
         name: Login to Docker Hub
         uses: docker/login-action@v2

.github/workflows/build-test-deploy.yml

@@ -34,7 +34,7 @@ jobs:
         id: 'auth'
         uses: 'google-github-actions/auth@v1'
         with:
-          credentials_json: '${{ secrets.GCR_JSON_KEY }}'
+          credentials_json: '${{ secrets.GAR_JSON_KEY }}'
       -
         name: Set up Cloud SDK
         uses: 'google-github-actions/setup-gcloud@v1'

docs/docs/sso.md

@@ -35,9 +35,10 @@ You will then have to generate a JWT with the following claims:
   about status changes on a user account such as bans or suspensions.
 - `user.username` **(required)** - the username that should be used when being
   presented inside Coral to moderators and other users. There are no username validations or restrictions enforced by Coral when you're using SSO.
-- `user.badges` _(optional)_ - array of strings to be displayed as badges beside
-  username inside Coral, visible to other users and moderators. For example, to indicate
-  a user's subscription status. If you include the claim, but you are not passing a badge value, then use an empty array instead of null.
+- `user.badges` _(optional)_ - array of strings to be displayed as badges and custom flair badges beside username inside Coral,
+  visible to other users and moderators. Badges are configured by passing through strings and can be used to indicate a user's subscription status.
+   - Custom flair badges are configured by passing through names that link to the desired flair badge image.
+   - To use custom flair badges, they must also be enabled in the admin, and each custom flair badge name, image URL must be added in the admin as well. If you include the badges claim, but you are not passing a badge value, then use an empty array instead of null.
 - `user.role` _(optional)_ - one of "COMMENTER", "STAFF", "MODERATOR", "ADMIN". Will create/update
   Coral user with this permission level. When users have both an assigned role greather than COMMENTER and a badge, both will be displayed.
 - `user.url` _(optional)_ - url for user account management, where a user will
@@ -55,7 +56,8 @@ An example of the claims for this token would be:
   "user": {
     "id": "628bdc61-6616-4add-bfec-dd79156715d4",
     "email": "[email protected]",
-    "username": "bob"
+    "username": "bob",
+    "badges": ["subscriber", "https://www.example/com/image.jpg"]
   }
 }
 ```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coralproject/talk",
-  "version": "8.4.2",
+  "version": "8.5.0",
   "author": "The Coral Project",
   "homepage": "https://coralproject.net/",
   "sideEffects": [

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

@@ -1,4 +1,5 @@
 import { Localized } from "@fluent/react/compat";
+import { FORM_ERROR } from "final-form";
 import React, {
   FunctionComponent,
   useCallback,
@@ -221,27 +222,40 @@ const BanModal: FunctionComponent<Props> = ({
   const onFormSubmit = useCallback(async () => {
     switch (updateType) {
       case UpdateType.ALL_SITES:
-        await banUser({
-          userID, // Should be defined because the modal shouldn't open if author is null
-          message: customizeMessage ? emailMessage : getDefaultMessage,
-          rejectExistingComments,
-          siteIDs: viewerIsScoped
-            ? viewer?.moderationScopes?.sites?.map(({ id }) => id)
-            : [],
-        });
+        try {
+          await banUser({
+            userID, // Should be defined because the modal shouldn't open if author is null
+            message: customizeMessage ? emailMessage : getDefaultMessage,
+            rejectExistingComments,
+            siteIDs: viewerIsScoped
+              ? viewer?.moderationScopes?.sites?.map(({ id }) => id)
+              : [],
+          });
+        } catch (err) {
+          return { [FORM_ERROR]: err.message };
+        }
         break;
       case UpdateType.SPECIFIC_SITES:
-        await updateUserBan({
-          userID,
-          message: customizeMessage ? emailMessage : getDefaultMessage,
-          banSiteIDs,
-          unbanSiteIDs,
-        });
+        try {
+          await updateUserBan({
+            userID,
+            message: customizeMessage ? emailMessage : getDefaultMessage,
+            banSiteIDs,
+            unbanSiteIDs,
+            rejectExistingComments,
+          });
+        } catch (err) {
+          return { [FORM_ERROR]: err.message };
+        }
         break;
       case UpdateType.NO_SITES:
-        await removeUserBan({
-          userID,
-        });
+        try {
+          await removeUserBan({
+            userID,
+          });
+        } catch (err) {
+          return { [FORM_ERROR]: err.message };
+        }
     }
     if (banDomain) {
       void createDomainBan({
@@ -326,59 +340,66 @@ const BanModal: FunctionComponent<Props> = ({
                 >
                   {/* BAN FROM/REJECT COMMENTS */}
                   <Flex direction="column">
-                    {/* ban from header */}
-                    <Localized id="community-banModal-banFrom">
-                      <Label className={styles.banFromHeader}>Ban from</Label>
-                    </Localized>
-                    <Flex
-                      direction="row"
-                      className={styles.sitesOptions}
-                      justifyContent="flex-start"
-                      spacing={5}
-                    >
-                      {/* sites options */}
-                      {showAllSitesOption && (
-                        <FormField>
-                          <Localized id="community-banModal-allSites">
-                            <RadioButton
-                              checked={updateType === UpdateType.ALL_SITES}
-                              onChange={() =>
-                                setUpdateType(UpdateType.ALL_SITES)
-                              }
-                              disabled={userBanStatus?.active}
-                            >
-                              All sites
-                            </RadioButton>
-                          </Localized>
-                        </FormField>
-                      )}
-                      <FormField>
-                        <Localized id="community-banModal-specificSites">
-                          <RadioButton
-                            checked={updateType === UpdateType.SPECIFIC_SITES}
-                            onChange={() =>
-                              setUpdateType(UpdateType.SPECIFIC_SITES)
-                            }
-                          >
-                            Specific Sites
-                          </RadioButton>
+                    {isMultisite && (
+                      <>
+                        <Localized id="community-banModal-banFrom">
+                          <Label className={styles.banFromHeader}>
+                            Ban from
+                          </Label>
                         </Localized>
-                      </FormField>
-                      {!viewerIsScoped && userHasAnyBan && (
-                        <FormField>
-                          <Localized id="community-banModal-noSites">
-                            <RadioButton
-                              checked={updateType === UpdateType.NO_SITES}
-                              onChange={() =>
-                                setUpdateType(UpdateType.NO_SITES)
-                              }
-                            >
-                              No Sites
-                            </RadioButton>
-                          </Localized>
-                        </FormField>
-                      )}
-                    </Flex>
+                        <Flex
+                          direction="row"
+                          className={styles.sitesOptions}
+                          justifyContent="flex-start"
+                          spacing={5}
+                        >
+                          {/* sites options */}
+                          {showAllSitesOption && (
+                            <FormField>
+                              <Localized id="community-banModal-allSites">
+                                <RadioButton
+                                  checked={updateType === UpdateType.ALL_SITES}
+                                  onChange={() =>
+                                    setUpdateType(UpdateType.ALL_SITES)
+                                  }
+                                  disabled={userBanStatus?.active}
+                                >
+                                  All sites
+                                </RadioButton>
+                              </Localized>
+                            </FormField>
+                          )}
+                          <FormField>
+                            <Localized id="community-banModal-specificSites">
+                              <RadioButton
+                                checked={
+                                  updateType === UpdateType.SPECIFIC_SITES
+                                }
+                                onChange={() =>
+                                  setUpdateType(UpdateType.SPECIFIC_SITES)
+                                }
+                              >
+                                Specific Sites
+                              </RadioButton>
+                            </Localized>
+                          </FormField>
+                          {!viewerIsScoped && userHasAnyBan && (
+                            <FormField>
+                              <Localized id="community-banModal-noSites">
+                                <RadioButton
+                                  checked={updateType === UpdateType.NO_SITES}
+                                  onChange={() =>
+                                    setUpdateType(UpdateType.NO_SITES)
+                                  }
+                                >
+                                  No Sites
+                                </RadioButton>
+                              </Localized>
+                            </FormField>
+                          )}
+                        </Flex>
+                      </>
+                    )}
                     {/* reject comments option */}
                     {updateType !== UpdateType.NO_SITES && (
                       <Localized