feat(NES-1637): add "Copy to collection" action to template cards in Collections

apps/journeys-admin/src/components/JourneyList/JourneyCard/JourneyCardMenu/DefaultMenu/DefaultMenu.spec.tsx

@@ -9,6 +9,7 @@ import {
 } from '@core/journeys/ui/TeamProvider'
 import { GetLastActiveTeamIdAndTeams } from '@core/journeys/ui/TeamProvider/__generated__/GetLastActiveTeamIdAndTeams'
 import { GET_USER_ROLE } from '@core/journeys/ui/useUserRoleQuery'
+import { FlagsProvider } from '@core/shared/ui/FlagsProvider'
 
 import {
   JourneyStatus,
@@ -18,6 +19,7 @@ import {
 } from '../../../../../../__generated__/globalTypes'
 import { GET_CURRENT_USER } from '../../../../../libs/useCurrentUserLazyQuery'
 import { getCustomDomainMock } from '../../../../../libs/useCustomDomainsQuery/useCustomDomainsQuery.mock'
+import { ThemeProvider } from '../../../../ThemeProvider'
 
 import { GET_JOURNEY_WITH_USER_ROLES } from './DefaultMenu'
 
@@ -1089,4 +1091,108 @@ describe('DefaultMenu', () => {
     expect(setOpenTranslateDialog).toHaveBeenCalled()
     expect(handleCloseMenu).toHaveBeenCalled()
   })
+
+  describe('Copy to collection menu item (NES-1637)', () => {
+    function renderWithFlagAndTemplate({
+      flag,
+      template
+    }: {
+      flag: boolean
+      template: boolean
+    }) {
+      return render(
+        <MockedProvider
+          mocks={[
+            teamWithManagerMock,
+            currentUserMock,
+            userRoleNonPublisherMock,
+            makeJourneyMock('journey-id')
+          ]}
+        >
+          <ThemeProvider>
+            <SnackbarProvider>
+              <FlagsProvider flags={{ teamTemplateCollection: flag }}>
+                <TeamProvider>
+                  <DefaultMenu
+                    id="journey-id"
+                    slug="journey-slug"
+                    status={JourneyStatus.draft}
+                    journeyId="journey-id"
+                    published={false}
+                    template={template}
+                    setOpenAccessDialog={noop}
+                    handleCloseMenu={noop}
+                    setOpenTrashDialog={noop}
+                    setOpenDetailsDialog={noop}
+                    setOpenTranslateDialog={noop}
+                  />
+                </TeamProvider>
+              </FlagsProvider>
+            </SnackbarProvider>
+          </ThemeProvider>
+        </MockedProvider>
+      )
+    }
+
+    it('renders "Copy to collection..." when flag is on AND template is true', async () => {
+      const { getByTestId, getByRole } = renderWithFlagAndTemplate({
+        flag: true,
+        template: true
+      })
+      await waitFor(() =>
+        expect(
+          getByTestId('JourneysAdminMenuItemCopyToCollection')
+        ).toBeInTheDocument()
+      )
+      // CopyToTeamMenuItem also renders in this test because the mock omits
+      // `journey.team`, so `isLocalTemplate` evaluates false (the gate from PR
+      // #8510 only suppresses the item for the active team's own templates).
+      expect(getByRole('menuitem', { name: 'Copy to ...' })).toBeInTheDocument()
+    })
+
+    it('does NOT render "Copy to collection..." when flag is off but template is true', async () => {
+      const { queryByTestId, getByRole } = renderWithFlagAndTemplate({
+        flag: false,
+        template: true
+      })
+      await waitFor(() =>
+        expect(
+          getByRole('menuitem', { name: 'Copy to ...' })
+        ).toBeInTheDocument()
+      )
+      expect(
+        queryByTestId('JourneysAdminMenuItemCopyToCollection')
+      ).not.toBeInTheDocument()
+    })
+
+    it('does NOT render "Copy to collection..." when flag is on but template is false', async () => {
+      const { queryByTestId, getByRole } = renderWithFlagAndTemplate({
+        flag: true,
+        template: false
+      })
+      await waitFor(() =>
+        expect(
+          getByRole('menuitem', { name: 'Copy to ...' })
+        ).toBeInTheDocument()
+      )
+      expect(
+        queryByTestId('JourneysAdminMenuItemCopyToCollection')
+      ).not.toBeInTheDocument()
+    })
+
+    it('does NOT render "Copy to collection..." when flag is off and template is false (sanity)', async () => {
+      const { queryByTestId, getByRole } = renderWithFlagAndTemplate({
+        flag: false,
+        template: false
+      })
+      await waitFor(() =>
+        expect(
+          getByRole('menuitem', { name: 'Copy to ...' })
+        ).toBeInTheDocument()
+      )
+      expect(
+        queryByTestId('JourneysAdminMenuItemCopyToCollection')
+      ).not.toBeInTheDocument()
+    })
+  })
 })

apps/journeys-admin/src/components/JourneyList/JourneyCard/JourneyCardMenu/DefaultMenu/DefaultMenu.tsx

@@ -7,6 +7,7 @@ import { ReactElement, useEffect, useMemo } from 'react'
 import { useTeam } from '@core/journeys/ui/TeamProvider'
 import { TemplateActionButton } from '@core/journeys/ui/TemplateView/TemplateViewHeader/TemplateActionButton'
 import { useUserRoleQuery } from '@core/journeys/ui/useUserRoleQuery'
+import { useFlags } from '@core/shared/ui/FlagsProvider'
 import Edit2Icon from '@core/shared/ui/icons/Edit2'
 import EyeOpenIcon from '@core/shared/ui/icons/EyeOpen'
 import TranslateIcon from '@core/shared/ui/icons/Translate'
@@ -36,6 +37,7 @@ import { CreateTemplateItem } from '../../../../Editor/Toolbar/Items/CreateTempl
 import { ShareItem } from '../../../../Editor/Toolbar/Items/ShareItem/ShareItem'
 import { MenuItem } from '../../../../MenuItem'
 import { CopyToTeamMenuItem } from '../../../../Team/CopyToTeamMenuItem/CopyToTeamMenuItem'
+import { CopyToCollectionMenuItem } from '../../../../TemplateGalleryPageList/CopyToCollectionMenuItem'
 import { DuplicateJourneyMenuItem } from '../DuplicateJourneyMenuItem'
 
 import { ArchiveJourney } from './ArchiveJourney'
@@ -117,6 +119,7 @@ export function DefaultMenu({
 }: DefaultMenuProps): ReactElement {
   const { t } = useTranslation('apps-journeys-admin')
   const { activeTeam } = useTeam()
+  const { teamTemplateCollection } = useFlags()
   const { data: userRoleData } = useUserRoleQuery()
   const { refetchTemplateStats } = useTemplateFamilyStatsAggregateLazyQuery()
   const { hostname } = useCustomDomainsQuery({
@@ -300,6 +303,15 @@ export function DefaultMenu({
           setHasOpenDialog={setHasOpenDialog}
         />
       )}
+      {teamTemplateCollection === true && template === true && (
+        <CopyToCollectionMenuItem
+          id={id}
+          journey={journey}
+          handleCloseMenu={handleCloseMenu}
+          handleKeepMounted={handleKeepMounted}
+          setHasOpenDialog={setHasOpenDialog}
+        />
+      )}
       {activeTeam != null && (
         <>
           <ArchiveJourney