GSLUX-734: My symbols

.env

@@ -22,7 +22,9 @@ VITE_ADDRESS_URL="/geocode/reverse"
 
 # Paths for symbols
 VITE_SYMBOL_ICONS_URL="/mymaps"
-VITE_SYMBOLS_URL="/mymaps/symbols"
+VITE_SYMBOLS_URL="/mymaps/symbols" # all symbols
+VITE_SYMBOL_URL="/mymaps/symbol" # query one symbol
+VITE_SYMBOL_UPLOAD_URL="/mymaps/upload_symbol"
 
 # Urls for vectortiles
 VITE_VECTORTILES_URL="https://vectortiles.geoportail.lu"

.env.development

@@ -21,8 +21,10 @@ VITE_QR_URL="http://localhost:8080/qr"
 VITE_ADDRESS_URL="http://localhost:8080/geocode/reverse"
 
 # Paths for symbols
-VITE_SYMBOL_ICONS_URL="https://map.geoportail.lu/mymaps" # !!! use prod because of CORS
-VITE_SYMBOLS_URL="https://map.geoportail.lu/mymaps/symbols" # !!! use prod because of CORS
+VITE_SYMBOL_ICONS_URL="http://localhost:8080/mymaps"
+VITE_SYMBOLS_URL="http://localhost:8080/mymaps/symbols"
+VITE_SYMBOL_URL="http://localhost:8080/mymaps/symbol"
+VITE_SYMBOL_UPLOAD_URL="http://localhost:8080/mymaps/upload_symbol"
 
 # Urls for vectortiles
 VITE_VECTORTILES_URL="https://vectortiles.geoportail.lu"

.env.e2e

@@ -23,6 +23,8 @@ VITE_ADDRESS_URL="https://migration.geoportail.lu/geocode/reverse"
 # Paths for symbols
 VITE_SYMBOL_ICONS_URL="https://map.geoportail.lu/mymaps" # !!! use prod because of CORS
 VITE_SYMBOLS_URL="https://map.geoportail.lu/mymaps/symbols" # !!! use prod because of CORS
+VITE_SYMBOL_URL="https://map.geoportail.lu/mymaps/symbol" # query one symbol
+VITE_SYMBOL_UPLOAD_URL="https://map.geoportail.lu/mymaps/upload_symbol"
 
 # Urls for vectortiles
 VITE_VECTORTILES_URL="https://vectortiles.geoportail.lu"

.env.staging

@@ -23,6 +23,8 @@ VITE_ADDRESS_URL="https://migration.geoportail.lu/geocode/reverse"
 # Paths for symbols
 VITE_SYMBOL_ICONS_URL="https://migration.geoportail.lu/mymaps"
 VITE_SYMBOLS_URL="https://migration.geoportail.lu/mymaps/symbols"
+VITE_SYMBOL_URL="https://migration.geoportail.lu/mymaps/symbol" # query one symbol
+VITE_SYMBOL_UPLOAD_URL="http://migration.geoportail.lu/mymaps/upload_symbol"
 
 # Urls for vectortiles
 VITE_VECTORTILES_URL="https://vectortiles-staging.geoportail.lu"

.github/workflows/ci.yml

@@ -18,7 +18,7 @@ jobs:
           fetch-depth: 0
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 22
           cache: 'npm'
       - run: npm ci
 

.github/workflows/ci_bundle.yml

@@ -60,7 +60,7 @@ jobs:
           tag_name: ${{ github.ref_type == 'tag' && github.ref || env.AUTO_TAG }}
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 22
           cache: 'npm'
       - name: Build and pack prod library
         shell: bash

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

@@ -18,7 +18,7 @@ jobs:
           fetch-depth: 0
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 22
           cache: 'npm'
       - run: npm ci
       - run: npm run lint

cypress/e2e/auth/auth.cy.ts

@@ -38,19 +38,7 @@ describe('Authentification', () => {
 
     describe('When user is authenticating with success', () => {
       beforeEach(() => {
-        cy.intercept('POST', '/login', {
-          statusCode: 200,
-          body: {
-            login: 'MyLogin',
-            mail: 'my_login@email.com',
-          },
-        })
-        cy.get('header [data-cy="authFormIcon"]').click()
-        cy.get('[data-cy="authForm"] input[name="userName"]').type('MyLogin')
-        cy.get('[data-cy="authForm"] input[name="userPassword"]').type(
-          'Rand87321mdp'
-        )
-        cy.get('[data-cy="authForm"] input[type="submit"]').click()
+        cy.login()
       })
 
       it('authenticates the user, hides the form and display the success notification msg', () => {
@@ -73,23 +61,11 @@ describe('Authentification', () => {
 
     describe('When user is logging out', () => {
       beforeEach(() => {
-        cy.intercept('POST', '/login', {
-          statusCode: 200,
-          body: {
-            login: 'MyLogin',
-            mail: 'my_login@email.com',
-          },
-        })
         cy.intercept('GET', '/logout', {
           statusCode: 200,
           body: {},
         })
-        cy.get('[data-cy="authFormIcon"]').click()
-        cy.get('[data-cy="authForm"] input[name="userName"]').type('MyLogin')
-        cy.get('[data-cy="authForm"] input[name="userPassword"]').type(
-          'Rand87321mdp'
-        )
-        cy.get('[data-cy="authForm"] input[type="submit"]').click()
+        cy.login()
       })
 
       it('logs out the user and display back the login form', () => {

cypress/e2e/draw/draw-feat-point-symbols.cy.ts

@@ -0,0 +1,121 @@
+describe('Draw "Point" symbols', () => {
+  beforeEach(() => {
+    cy.intercept(
+      'GET',
+      '/raster?lon=-25877.619036593664&lat=154433.4715351454',
+      {
+        statusCode: 200,
+        body: {
+          dhm: null,
+        },
+      }
+    )
+    cy.intercept(
+      'GET',
+      '/raster?lon=12756.103097272688&lat=114635.74032468312',
+      {
+        statusCode: 200,
+        body: {
+          dhm: 333.13,
+        },
+      }
+    )
+    cy.intercept('GET', '/raster?lon=51966.98676810359&lat=74839.09999860045', {
+      statusCode: 500,
+      body: {},
+    })
+
+    cy.visit('/')
+    cy.get('button[data-cy="drawButton"]').click()
+    cy.get('button[data-cy="drawPointButton"]').click()
+    cy.get('div.ol-viewport').click(100, 100)
+    cy.get('[data-cy="featItemActionStyle"]').click()
+    cy.get('[data-cy="featStyleSymbolEdit"]').click()
+  })
+
+  describe('When editing symbol', () => {
+    describe('When browsing public symbols', () => {
+      beforeEach(() => {
+        cy.get('[data-cy="featStyleSymbolTab"]').eq(1).click()
+      })
+
+      it('displays the public symbol list', () => {
+        cy.get('[data-cy="featStyleSymbolFilterList"]').should('exist')
+        cy.get('[data-cy="featStyleSymbolIcon"]').should('have.length', 81)
+      })
+
+      describe('When filtering public symbols', () => {
+        it('displays the public symbol list', () => {
+          cy.get('[data-cy="featStyleSymbolFilterList"]').type('pin1')
+          cy.get('[data-cy="featStyleSymbolIcon"]').should('have.length', 2)
+        })
+      })
+
+      describe('When choosing a symbol', () => {
+        it('should close the list', () => {
+          cy.get('[data-cy="featStyleSymbolFilterList"]').should('exist')
+          cy.get('[data-cy="featStyleSymbolIcon"]').eq(1).click()
+          cy.get('[data-cy="featStyleSymbolFilterList"]').should('not.exist')
+        })
+      })
+    })
+
+    describe('When browsing private symbols', () => {
+      beforeEach(() => {
+        cy.intercept('GET', /\/symbols\?symboltype=us/, {
+          statusCode: 200,
+          body: {
+            success: true,
+            count: 2,
+            results: [
+              {
+                id: 1915,
+                name: 'foo symbol 1',
+                url: '/symbol/1915',
+                symboltype: 'us',
+              },
+              {
+                id: 1998,
+                name: 'foo symbol 2',
+                url: '/symbol/1998',
+                symboltype: 'us',
+              },
+            ],
+          },
+        }).as('getSymbols')
+        cy.intercept('POST', /\/mymaps\/upload_symbol/, {
+          statusCode: 200,
+        })
+        cy.login()
+        cy.get('[data-cy="featStyleSymbolTab_private"]').click()
+      })
+
+      it('displays the public symbols tab and the private symbols tab', () => {
+        cy.get('[data-cy="featStyleSymbolFilterList"]').should('exist')
+        cy.get('[data-cy="featStyleSymbolIcon"]').should('have.length', 2)
+      })
+
+      describe('When filtering private symbols', () => {
+        it('displays the filtered private symbol list', () => {
+          cy.get('[data-cy="featStyleSymbolFilterList"]').type('symbol 1')
+          cy.get('[data-cy="featStyleSymbolIcon"]').should('have.length', 1)
+        })
+      })
+
+      describe('When uploading file', () => {
+        it('refreshes the private symbol list list', () => {
+          cy.get('input[type=file]').selectFile(
+            {
+              contents: Cypress.Buffer.from('file contents'),
+              fileName: 'file.txt',
+              mimeType: 'text/plain',
+              lastModified: Date.now(),
+            },
+            { force: true }
+          )
+          cy.get('@getSymbols.all').should('have.length', 2)
+        })
+      })
+    })
+  })
+})

cypress/e2e/draw/draw-feat-point.cy.ts

@@ -8,10 +8,12 @@ function testFeatItemMeasurements() {
   cy.get('*[data-cy="featItemProfile"]').should('not.exist')
 }
 
-function testFeatStyleEditionTabContent() {
+function testFeatStyleEditionTabContent(withAngle: boolean) {
   cy.get('*[data-cy="featStyleColor"]').should('exist')
   cy.get('*[data-cy="featStyleSize"]').should('exist')
-  cy.get('*[data-cy="featStyleAngle"]').should('not.exist')
+  cy.get('*[data-cy="featStyleAngle"]').should(
+    withAngle ? 'exist' : 'not.exist'
+  )
   cy.get('*[data-cy="featStyleSymbol"]').should('exist')
   cy.get('*[data-cy="featStyleLineStyle"]').should('not.exist')
   cy.get('*[data-cy="featStyleLineWidth"]').should('not.exist')
@@ -55,7 +57,7 @@ describe('Draw "Point"', () => {
 
   describe('When clicking button to draw Point', () => {
     it('displays a new feature item in the draw panel', () => {
-      cy.get('*[data-cy="featItemName"]').should('exist')
+      cy.get('[data-cy="featItemName"]').should('exist')
     })
 
     it('displays measurements for Point', () => {
@@ -70,17 +72,14 @@ describe('Draw "Point"', () => {
       cy.get('button[data-cy="drawPointButton"]').click()
       cy.get('button[data-cy="drawPointButton"]').click()
       cy.get('div.ol-viewport').click(200, 200)
-      cy.get('*[data-cy="featItemElevation"]').should(
-        'contain.text',
-        '333.13 m'
-      )
+      cy.get('[data-cy="featItemElevation"]').should('contain.text', '333.13 m')
     })
 
     it('displays N/A elevation for new Point if response has error', () => {
       cy.get('button[data-cy="drawPointButton"]').click()
       cy.get('button[data-cy="drawPointButton"]').click()
       cy.get('div.ol-viewport').click(300, 300)
-      cy.get('*[data-cy="featItemElevation"]').should('contain.text', 'N/A')
+      cy.get('[data-cy="featItemElevation"]').should('contain.text', 'N/A')
     })
 
     it('displays the possible actions for the feature', () => {
@@ -110,11 +109,12 @@ describe('Draw "Point"', () => {
 
   describe('When editing feature style', () => {
     beforeEach(() => {
-      cy.get('*[data-cy="featItemActionStyle"]').click()
+      cy.get('[data-cy="featItemActionStyle"]').click()
     })
 
     it('displays the style edition tab for "Point"', () => {
-      testFeatStyleEditionTabContent()
+      const withAngle = false
+      testFeatStyleEditionTabContent(withAngle)
     })
 
     describe('When editing symbol', () => {
@@ -132,23 +132,24 @@ describe('Draw "Point"', () => {
           cy.get('[data-cy="featStyleSymbolTab"]').eq(1).click()
         })
 
-        it('displays the public symbol list', () => {
-          cy.get('[data-cy="featStyleSymbolFilterList"]').should('exist')
-          cy.get('[data-cy="featStyleSymbolIcon"]').should('have.length', 81)
-        })
+        describe('When choosing a symbol', () => {
+          it('should close the list', () => {
+            cy.get('[data-cy="featStyleSymbolFilterList"]').should('exist')
+            cy.get('[data-cy="featStyleSymbolIcon"]').eq(1).click()
+            cy.get('[data-cy="featStyleSymbolFilterList"]').should('not.exist')
 
-        describe('When filtering public symbols', () => {
-          it('displays the public symbol list', () => {
-            cy.get('[data-cy="featStyleSymbolFilterList"]').type('pin1')
-            cy.get('[data-cy="featStyleSymbolIcon"]').should('have.length', 2)
+            const withAngle = true
+            testFeatStyleEditionTabContent(withAngle)
           })
         })
       })
 
       describe('When clicking close button', () => {
         it('returns to style edition tab', () => {
           cy.get('[data-cy="featClosePopup"]').click()
-          testFeatStyleEditionTabContent()
+
+          const withAngle = false
+          testFeatStyleEditionTabContent(withAngle)
         })
       })
     })