Merge pull request #255 from vivid-planet/merge-main-into-next

Merge main into next

.env

@@ -83,4 +83,4 @@ REDIRECT_URL_FOR_IMPORT=$SITE_URL
 BREVO_ALLOWED_REDIRECT_URL=http://${DEV_DOMAIN:-localhost}${WORKAROUND_DOTENV_ISSUE}:${SITE_PORT}
 CAMPAIGNS_FRONTEND_URL=http://${DEV_DOMAIN:-localhost}${WORKAROUND_DOTENV_ISSUE}:${SITE_PORT} # doesn't work, TODO: add actual mailing frontend
 
-SITE_PREVIEW_SECRET=8f9d7e6b4c2a1b3c
+SITE_PREVIEW_SECRET=8f9d7e6b4c2a1b3c

.github/workflows/sonar-qube.yml

@@ -0,0 +1,40 @@
+name: SonarCloud Code Analysis
+
+on:
+  pull_request:
+    types:
+      - opened
+      - synchronize
+      - reopened
+  push:
+    branches:
+      - main
+      - next
+
+jobs:
+  sonarqube:
+    name: SonarQube
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
+      - name: Use Node.js 18.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: "https://registry.npmjs.org"
+          cache: "pnpm" # https://github.com/actions/setup-node/blob/main/docs/advanced-usage.md#caching-packages-dependencies
+
+      - run: pnpm install --frozen-lockfile
+
+      - name: SonarQube Scan
+        uses: SonarSource/sonarqube-scan-action@v4
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}

demo/api/schema.gql

@@ -741,11 +741,18 @@ input EmailCampaignFilter {
   updatedAt: DateTimeFilter
   title: StringFilter
   subject: StringFilter
+  sendingState: SendingStateEnumFilter
   scheduledAt: DateTimeFilter
   and: [EmailCampaignFilter!]
   or: [EmailCampaignFilter!]
 }
 
+input SendingStateEnumFilter {
+  isAnyOf: [SendingState!]
+  equal: SendingState
+  notEqual: SendingState
+}
+
 input EmailCampaignSort {
   field: EmailCampaignSortField!
   direction: SortDirection! = ASC
@@ -969,6 +976,7 @@ enum SubscribeResponse {
   SUCCESSFUL
   ERROR_UNKNOWN
   ERROR_CONTAINED_IN_ECG_RTR_LIST
+  ERROR_MAXIMAL_NUMBER_OF_TEST_CONTACTS_REACHED
 }
 
 input BrevoContactInput {

packages/admin/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @comet/brevo-admin
 
+## 2.2.0
+
+### Minor Changes
+
+-   f07d79a: Adds `createBrevoTestContactsPage` for creating a test contacts page, that is indepent from the main list.
+
+    Remove `email` and `redirectionUrl` from `brevoContactsPageAttributesConfig`
+
+-   d32e9e8: Replace the `TextField` with a `FinalFormSelect` component in the `TestEmailCampaignForm`, allowing users to choose contacts directly from the `TestContactList`
+-   ada83cf: Add filter for `sendingState` in `EmailCampaignsGrid`
+
 ## 2.1.6
 
 ### Patch Changes

packages/admin/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@comet/brevo-admin",
-    "version": "2.1.6",
+    "version": "2.2.0",
     "repository": {
         "type": "git",
         "url": "https://github.com/vivid-planet/comet-brevo-module/",

packages/admin/src/brevoTestContacts/BrevoTestContactsGrid.tsx

@@ -12,6 +12,7 @@ import {
     ToolbarFillSpace,
     ToolbarItem,
     ToolbarTitleItem,
+    Tooltip,
     useBufferedRowCount,
     useDataGridRemote,
     usePersistentColumnState,
@@ -49,7 +50,20 @@ const deleteBrevoTestContactMutation = gql`
     }
 `;
 
-function BrevoTestContactsGridToolbar({ intl, scope }: { intl: IntlShape; scope: GQLEmailCampaignContentScopeInput }) {
+function BrevoTestContactsGridToolbar({
+    intl,
+    scope,
+    totalCount,
+}: {
+    intl: IntlShape;
+    scope: GQLEmailCampaignContentScopeInput;
+    totalCount: number;
+}) {
+    const disableButton = totalCount >= 100;
+    const tooltipMessage = intl.formatMessage({
+        id: "cometBrevoModule.brevoTestContact.contactLimitReached",
+        defaultMessage: "Contact limit of 100 reached. You cannot add more contacts.",
+    });
     return (
         <DataGridToolbar>
             <ToolbarTitleItem>
@@ -65,9 +79,21 @@ function BrevoTestContactsGridToolbar({ intl, scope }: { intl: IntlShape; scope:
             </ToolbarItem>
             <ToolbarFillSpace />
             <ToolbarActions>
-                <Button startIcon={<Add />} component={StackLink} pageName="add" payload="add" variant="contained" color="primary">
-                    <FormattedMessage id="cometBrevoModule.brevoTestContact.newContact" defaultMessage="New test contact" />
-                </Button>
+                <Tooltip title={disableButton ? tooltipMessage : ""}>
+                    <span>
+                        <Button
+                            startIcon={<Add />}
+                            component={StackLink}
+                            pageName="add"
+                            payload="add"
+                            variant="contained"
+                            color="primary"
+                            disabled={disableButton}
+                        >
+                            <FormattedMessage id="cometBrevoModule.brevoTestContact.newContact" defaultMessage="New test contact" />
+                        </Button>
+                    </span>
+                </Tooltip>
             </ToolbarActions>
         </DataGridToolbar>
     );
@@ -171,6 +197,7 @@ export function BrevoTestContactsGrid({
     const rowCount = useBufferedRowCount(data?.brevoTestContacts.totalCount);
     if (error) throw error;
     const rows = data?.brevoTestContacts.nodes ?? [];
+    const totalCount = data?.brevoTestContacts.totalCount || 0;
 
     return (
         <MainContent fullHeight>
@@ -196,6 +223,7 @@ export function BrevoTestContactsGrid({
                     toolbar: {
                         intl,
                         scope,
+                        totalCount,
                     },
                 }}
             />

packages/admin/src/emailCampaigns/EmailCampaignsGrid.tsx

@@ -121,6 +121,15 @@ export function EmailCampaignsGrid({
         ...usePersistentColumnState("EmailCampaignsGrid"),
     };
 
+    const sendingStateOptions: { label: string; value: string }[] = [
+        {
+            value: "SENT",
+            label: intl.formatMessage({ id: "cometBrevoModule.emailCampaign.sent", defaultMessage: "Sent" }),
+        },
+        { value: "DRAFT", label: intl.formatMessage({ id: "cometBrevoModule.emailCampaign.draft", defaultMessage: "Draft" }) },
+        { value: "SCHEDULED", label: intl.formatMessage({ id: "cometBrevoModule.emailCampaign.scheduled", defaultMessage: "Scheduled" }) },
+    ];
+
     const columns: GridColDef<GQLEmailCampaignsListFragment>[] = [
         {
             field: "updatedAt",
@@ -145,8 +154,9 @@ export function EmailCampaignsGrid({
             headerName: intl.formatMessage({ id: "cometBrevoModule.emailCampaign.sendingState", defaultMessage: "Sending State" }),
             renderCell: ({ value }) => <SendingStateColumn sendingState={value} />,
             width: 150,
-            filterable: false,
             sortable: false,
+            type: "singleSelect",
+            valueOptions: sendingStateOptions,
         },
         {
             field: "scheduledAt",

packages/admin/src/emailCampaigns/form/TestEmailCampaignForm.tsx

@@ -1,38 +1,65 @@
-import { useApolloClient } from "@apollo/client";
-import { Field, FinalForm, FinalFormInput, SaveButton } from "@comet/admin";
+import { gql, useApolloClient, useQuery } from "@apollo/client";
+import { Field, FinalForm, FinalFormSelect, SaveButton } from "@comet/admin";
 import { Newsletter } from "@comet/admin-icons";
 import { AdminComponentPaper, AdminComponentSectionGroup } from "@comet/blocks-admin";
-import { Card, FormHelperText, Typography } from "@mui/material";
+import { useContentScope } from "@comet/cms-admin";
+import { Card } from "@mui/material";
 import React from "react";
 import { FormattedMessage } from "react-intl";
 
+import { GQLBrevoTestContactsSelectListFragment } from "./TestEmailCampaignForm.generated";
 import { SendEmailCampaignToTestEmailsMutation } from "./TestEmailCampaignForm.gql";
 import { GQLSendEmailCampaignToTestEmailsMutation, GQLSendEmailCampaignToTestEmailsMutationVariables } from "./TestEmailCampaignForm.gql.generated";
 
 interface FormProps {
-    testEmails: string;
+    testEmails: string[];
 }
 
 interface TestEmailCampaignFormProps {
     id?: string;
     isSendable?: boolean;
 }
 
+const brevoTestContactsSelectFragment = gql`
+    fragment BrevoTestContactsSelectList on BrevoContact {
+        id
+        email
+    }
+`;
+
+const brevoTestContactsSelectQuery = gql`
+    query BrevoTestContactsGridSelect($offset: Int, $limit: Int, $email: String, $scope: EmailCampaignContentScopeInput!) {
+        brevoTestContacts(offset: $offset, limit: $limit, email: $email, scope: $scope) {
+            nodes {
+                ...BrevoTestContactsSelectList
+            }
+            totalCount
+        }
+    }
+    ${brevoTestContactsSelectFragment}
+`;
+
 export const TestEmailCampaignForm = ({ id, isSendable = false }: TestEmailCampaignFormProps) => {
     const client = useApolloClient();
+    const scope = useContentScope();
 
-    async function submitTestEmails({ testEmails }: FormProps) {
-        const emailsArray = testEmails.trim().split("\n");
+    // Contact creation is limited to 100 at a time. Therefore, 100 contacts are queried without using pagination.
+    const { data, loading, error } = useQuery(brevoTestContactsSelectQuery, {
+        variables: { offset: 0, limit: 100, scope },
+    });
 
+    async function submitTestEmails({ testEmails }: FormProps) {
         if (id) {
             const { data } = await client.mutate<GQLSendEmailCampaignToTestEmailsMutation, GQLSendEmailCampaignToTestEmailsMutationVariables>({
                 mutation: SendEmailCampaignToTestEmailsMutation,
-                variables: { id, data: { emails: emailsArray } },
+                variables: { id, data: { emails: testEmails } },
             });
             return data?.sendEmailCampaignToTestEmails;
         }
     }
 
+    const emailOptions: string[] = data?.brevoTestContacts?.nodes?.map((contact: GQLBrevoTestContactsSelectListFragment) => contact.email) || [];
+
     return (
         <Card sx={{ mt: 4 }}>
             <AdminComponentPaper>
@@ -41,33 +68,26 @@ export const TestEmailCampaignForm = ({ id, isSendable = false }: TestEmailCampa
                         <FormattedMessage id="cometBrevoModule.emailCampaigns.testEmailCampaign.title" defaultMessage="Send test email campaign" />
                     }
                 >
-                    <FinalForm<FormProps> mode="edit" onSubmit={submitTestEmails}>
+                    <FinalForm<FormProps> mode="edit" onSubmit={submitTestEmails} initialValues={{ testEmails: [] }}>
                         {({ handleSubmit, submitting, values }) => {
                             return (
                                 <>
                                     <Field
+                                        component={FinalFormSelect}
                                         name="testEmails"
                                         label={
                                             <FormattedMessage
                                                 id="cometBrevoModule.emailCampaigns.testEmailCampaign.testEmails"
                                                 defaultMessage="Email addresses"
                                             />
                                         }
-                                        component={FinalFormInput}
-                                        multiline
-                                        placeholder={["First test email address", "Second test email address"].join("\n")}
                                         fullWidth
-                                        minRows={4}
+                                        options={emailOptions}
+                                        isLoading={loading}
+                                        error={!!error}
+                                        value={values.testEmails || []}
+                                        getOptionLabel={(option: string) => option}
                                     />
-                                    <FormHelperText sx={{ marginTop: -2, marginBottom: 4 }}>
-                                        <Typography sx={{ display: "flex", alignItems: "center" }}>
-                                            <FormattedMessage
-                                                id="cometBrevoModule.emailCampaigns.testEmailCampaign.oneEmailAddressEachLine"
-                                                defaultMessage="One email address each line"
-                                            />
-                                        </Typography>
-                                        <Typography />
-                                    </FormHelperText>
                                     <SaveButton
                                         disabled={!values.testEmails || !isSendable || !id}
                                         saveIcon={<Newsletter />}

packages/api/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @comet/brevo-api
 
+## 2.2.0
+
+### Minor Changes
+
+-   f07d79a: Adds `createBrevoTestContactsPage` for creating a test contacts page, that is indepent from the main list.
+
+    Remove `email` and `redirectionUrl` from `brevoContactsPageAttributesConfig`
+
+-   ada83cf: Add filter for `sendingState` in `EmailCampaignsGrid`
+-   dd93185: Add `BREVO_FOLDER_ID` to environment variables to allow overwriting default value `1`
+
 ## 2.1.6
 
 ### Patch Changes

packages/api/generate-schema.ts

@@ -65,7 +65,7 @@ async function generateSchema(): Promise<void> {
 
     const BrevoContact = BrevoContactFactory.create({});
     const [BrevoContactInput, BrevoContactUpdateInput] = BrevoContactInputFactory.create({ Scope: EmailCampaignScope });
-    const [BrevoTestContactInput, BrevoTestContactUpdateInput] = BrevoTestContactInputFactory.create({ Scope: EmailCampaignScope });
+    const [BrevoTestContactInput] = BrevoTestContactInputFactory.create({ Scope: EmailCampaignScope });
 
     const BrevoContactSubscribeInput = SubscribeInputFactory.create({ Scope: EmailCampaignScope });
     const BrevoContactResolver = createBrevoContactResolver({
@@ -75,7 +75,6 @@ async function generateSchema(): Promise<void> {
         BrevoContactInput,
         BrevoContactUpdateInput,
         BrevoTestContactInput,
-        BrevoTestContactUpdateInput,
     });
     const BrevoContactImportResolver = createBrevoContactImportResolver({
         BrevoContact,

packages/api/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@comet/brevo-api",
-    "version": "2.1.6",
+    "version": "2.2.0",
     "repository": {
         "type": "git",
         "url": "https://github.com/vivid-planet/comet-brevo-module/",

packages/api/schema.gql

@@ -285,11 +285,18 @@ input EmailCampaignFilter {
   updatedAt: DateTimeFilter
   title: StringFilter
   subject: StringFilter
+  sendingState: SendingStateEnumFilter
   scheduledAt: DateTimeFilter
   and: [EmailCampaignFilter!]
   or: [EmailCampaignFilter!]
 }
 
+input SendingStateEnumFilter {
+  isAnyOf: [SendingState!]
+  equal: SendingState
+  notEqual: SendingState
+}
+
 input EmailCampaignSort {
   field: EmailCampaignSortField!
   direction: SortDirection! = ASC
@@ -333,6 +340,7 @@ enum SubscribeResponse {
   SUCCESSFUL
   ERROR_UNKNOWN
   ERROR_CONTAINED_IN_ECG_RTR_LIST
+  ERROR_MAXIMAL_NUMBER_OF_TEST_CONTACTS_REACHED
 }
 
 input BrevoContactInput {