Merge pull request #9622 from overleaf/mf-add-portal-templates-2

Add institution templates to the react version of the new project dropdown

GitOrigin-RevId: 32bf0b1b559ea3da744430902cc016e7c2a918d9

services/web/test/frontend/features/project-list/components/new-project-button.test.tsx

@@ -3,70 +3,133 @@ import { expect } from 'chai'
 import NewProjectButton from '../../../../../frontend/js/features/project-list/components/new-project-button'
 
 describe('<NewProjectButton />', function () {
-  beforeEach(function () {
-    window.metaAttributesCache.set('ol-ExposedSettings', {
-      templateLinks: [
-        {
-          name: 'Academic Journal',
-          url: '/gallery/tagged/academic-journal',
-        },
-        {
-          name: 'View All',
-          url: '/latex/templates',
-        },
-      ],
+  describe('for every user (affiliated and non-affiliated)', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-ExposedSettings', {
+        templateLinks: [
+          {
+            name: 'Academic Journal',
+            url: '/gallery/tagged/academic-journal',
+          },
+          {
+            name: 'View All',
+            url: '/latex/templates',
+          },
+        ],
+      })
+
+      render(<NewProjectButton id="test" />)
+
+      const newProjectButton = screen.getByRole('button', {
+        name: 'New Project',
+      })
+      fireEvent.click(newProjectButton)
     })
 
-    render(<NewProjectButton id="test" />)
+    afterEach(function () {
+      window.metaAttributesCache = new Map()
+    })
 
-    const newProjectButton = screen.getByRole('button', {
-      name: 'New Project',
+    it('shows the correct dropdown menu', function () {
+      // static menu
+      screen.getByText('Blank Project')
+      screen.getByText('Example Project')
+      screen.getByText('Upload Project')
+      screen.getByText('Import from GitHub')
+
+      // static text
+      screen.getByText('Templates')
+
+      // dynamic menu based on templateLinks
+      screen.getByText('Academic Journal')
+      screen.getByText('View All')
+    })
+
+    it('open new project modal when clicking at Blank Project', function () {
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+
+      screen.getByPlaceholderText('Project Name')
+    })
+
+    it('open new project modal when clicking at Example Project', function () {
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Example Project' }))
+
+      screen.getByPlaceholderText('Project Name')
+    })
+
+    it('close the new project modal when clicking at the top right "x" button', function () {
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+      fireEvent.click(screen.getByRole('button', { name: 'Close' }))
+
+      expect(screen.queryByRole('dialog')).to.be.null
+    })
+
+    it('close the new project modal when clicking at the Cancel button', function () {
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+      fireEvent.click(screen.getByRole('button', { name: 'Cancel' }))
+
+      expect(screen.queryByRole('dialog')).to.be.null
     })
-    fireEvent.click(newProjectButton)
   })
 
-  afterEach(function () {
-    window.metaAttributesCache = new Map()
-  })
+  describe('for affiliated user with custom templates', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-ExposedSettings', {
+        templateLinks: [
+          {
+            name: 'Academic Journal',
+            url: '/gallery/tagged/academic-journal',
+          },
+          {
+            name: 'View All',
+            url: '/latex/templates',
+          },
+        ],
+      })
 
-  it('opens a dropdown', function () {
-    // static menu
-    screen.getByText('Blank Project')
-    screen.getByText('Example Project')
-    screen.getByText('Upload Project')
-    screen.getByText('Import from GitHub')
+      window.metaAttributesCache.set('ol-portalTemplates', [
+        {
+          name: 'Affiliation 1',
+          url: '/edu/test-new-template',
+        },
+      ])
+    })
 
-    // static text
-    screen.getByText('Templates')
+    afterEach(function () {
+      window.metaAttributesCache = new Map()
+    })
 
-    // dynamic menu based on templateLinks
-    screen.getByText('Academic Journal')
-    screen.getByText('View All')
-  })
+    it('shows the correct dropdown menu', function () {
+      render(<NewProjectButton id="test" />)
 
-  it('open new project modal when clicking at Blank Project', function () {
-    fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+      const newProjectButton = screen.getByRole('button', {
+        name: 'New Project',
+      })
 
-    screen.getByPlaceholderText('Project Name')
-  })
+      fireEvent.click(newProjectButton)
+      // static menu
+      screen.getByText('Blank Project')
+      screen.getByText('Example Project')
+      screen.getByText('Upload Project')
+      screen.getByText('Import from GitHub')
 
-  it('open new project modal when clicking at Example Project', function () {
-    fireEvent.click(screen.getByRole('menuitem', { name: 'Example Project' }))
+      // static text for institution templates
+      screen.getByText('Institution Templates')
 
-    screen.getByPlaceholderText('Project Name')
-  })
+      // dynamic menu based on portalTemplates
+      const affiliationTemplate = screen.getByRole('menuitem', {
+        name: 'Affiliation 1',
+      })
+      expect(affiliationTemplate.getAttribute('href')).to.equal(
+        '/edu/test-new-template#templates'
+      )
 
-  it('close the new project modal when clicking at the top right "x" button', function () {
-    fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
-    fireEvent.click(screen.getByRole('button', { name: 'Close' }))
+      // static text
+      screen.getByText('Templates')
 
-    expect(screen.queryByRole('dialog')).to.be.null
-  })
-
-  it('close the new project modal when clicking at the Cancel button', function () {
-    fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
-    fireEvent.click(screen.getByRole('button', { name: 'Cancel' }))
-
-    expect(screen.queryByRole('dialog')).to.be.null
+      // dynamic menu based on templateLinks
+      screen.getByText('Academic Journal')
+      screen.getByText('View All')
+    })
   })
 })