@mtes-mct/monitor-ui 13.2.0 → 13.3.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [13.2.0](https://github.com/MTES-MCT/monitor-ui/compare/v13.1.0...v13.2.0) (2024-03-07)
+
+
+### Features
+
+* **utils:** delete "(UTC)"  from humanizePastDate function ([91507d1](https://github.com/MTES-MCT/monitor-ui/commit/91507d17426190f38fddba32c03c50937c0ba6f2))
+
 ## [13.1.0](https://github.com/MTES-MCT/monitor-ui/compare/v13.0.0...v13.1.0) (2024-03-07)
 
 

package/cypress/global.d.ts

@@ -114,6 +114,7 @@ declare namespace Cypress {
   type DateWithTimeRangeTuple = [DateWithTimeTuple, DateWithTimeTuple]
 
   interface FillOptions extends Forceable {
+    delay: number
     retries: number
   }
 }

package/cypress/index.js

@@ -204,6 +204,7 @@ function checkMultiRadioOption(fieldsetElement, value, _label, force) {
 }
 
 const DEFAULT_OPTIONS = {
+    delay: 10,
     force: true,
     retries: 5
 };
@@ -212,7 +213,7 @@ function throwError(message) {
     throw new Error(`[monitor-ui > Cypress] ${message}`);
 }
 
-function fillDatePicker(fieldsetElement, dateOrDateWithTimeTuple, _label, force) {
+function fillDatePicker(fieldsetElement, dateOrDateWithTimeTuple, _label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldsetElement,
@@ -249,20 +250,25 @@ function fillDatePicker(fieldsetElement, dateOrDateWithTimeTuple, _label, force)
     } else {
         const [year, month, day] = dateOrDateWithTimeTuple;
         cy.wrap(fieldsetElement).find('[aria-label="Jour"]').type(String(day).padStart(2, '0'), {
+            delay,
             force
         });
         cy.wrap(fieldsetElement).find('[aria-label="Mois"]').type(String(month).padStart(2, '0'), {
+            delay,
             force
         });
         cy.wrap(fieldsetElement).find('[aria-label="Année"]').type(String(year), {
+            delay,
             force
         });
         if (hasTimeInputs) {
             const [hour, minute] = dateOrDateWithTimeTuple.slice(3);
             cy.wrap(fieldsetElement).find('[aria-label="Heure"]').type(String(hour).padStart(2, '0'), {
+                delay,
                 force
             });
             cy.wrap(fieldsetElement).find('[aria-label="Minute"]').type(String(minute).padStart(2, '0'), {
+                delay,
                 force
             });
         }
@@ -270,6 +276,7 @@ function fillDatePicker(fieldsetElement, dateOrDateWithTimeTuple, _label, force)
     cy.wait(250);
     // Close the calendar & ranged time picker popup by pressing the escape key
     cy.get('body').type('{esc}', {
+        delay,
         force
     });
     // TODO Create a util to handle the `fieldsetElement` re-creation cases.
@@ -279,7 +286,7 @@ function fillDatePicker(fieldsetElement, dateOrDateWithTimeTuple, _label, force)
 // cy.wrap(fieldsetElement).find('.Field-DateRangePicker__RangedTimePicker').should('not.exist')
 }
 
-function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _label, force) {
+function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldsetElement,
@@ -333,9 +340,11 @@ function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _lab
         const [startYear, startMonth, startDay, startHour, startMinute] = startDateOrDateWithTimeTuple;
         const [endYear, endMonth, endDay, endHour, endMinute] = endDateOrDateWithTimeTuple;
         cy.wrap(fieldsetElement).find('[aria-label="Jour de début"]').type(String(startDay).padStart(2, '0'), {
+            delay,
             force
         });
         cy.wrap(fieldsetElement).find('[aria-label="Mois de début"]').type(String(startMonth).padStart(2, '0'), {
+            delay,
             force
         });
         cy.wrap(fieldsetElement).find('[aria-label="Année de début"]').type(String(startYear), {
@@ -343,6 +352,7 @@ function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _lab
         });
         if (hasTimeInput) {
             cy.wrap(fieldsetElement).find('[aria-label="Heure de début"]').type(String(startHour).padStart(2, '0'), {
+                delay,
                 force
             });
             cy.wrap(fieldsetElement).find('[aria-label="Minute de début"]').type(String(startMinute).padStart(2, '0'), {
@@ -350,9 +360,11 @@ function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _lab
             });
         }
         cy.wrap(fieldsetElement).find('[aria-label="Jour de fin"]').type(String(endDay).padStart(2, '0'), {
+            delay,
             force
         });
         cy.wrap(fieldsetElement).find('[aria-label="Mois de fin"]').type(String(endMonth).padStart(2, '0'), {
+            delay,
             force
         });
         cy.wrap(fieldsetElement).find('[aria-label="Année de fin"]').type(String(endYear), {
@@ -360,9 +372,11 @@ function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _lab
         });
         if (hasTimeInput) {
             cy.wrap(fieldsetElement).find('[aria-label="Heure de fin"]').type(String(endHour).padStart(2, '0'), {
+                delay,
                 force
             });
             cy.wrap(fieldsetElement).find('[aria-label="Minute de fin"]').type(String(endMinute).padStart(2, '0'), {
+                delay,
                 force
             });
         }
@@ -370,6 +384,7 @@ function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _lab
     cy.wait(250);
     // Close the range calendar & ranged time picker popup by pressing the escape key
     cy.get('body').type('{esc}', {
+        delay,
         force
     });
     // TODO Create a util to handle the `fieldsetElement` re-creation cases.
@@ -379,7 +394,7 @@ function fillDateRangePicker(fieldsetElement, dateOrDateWithTimeTupleRange, _lab
 // cy.wrap(fieldsetElement).find('.Field-DateRangePicker__RangedTimePicker').should('not.exist')
 }
 
-function fillNumberInput(fieldElement, value, _label, force) {
+function fillNumberInput(fieldElement, value, _label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -401,11 +416,12 @@ function fillNumberInput(fieldElement, value, _label, force) {
         return;
     }
     cy.wrap(fieldElement).find('input[type="number"]').type(String(value), {
+        delay,
         force
     }).wait(250);
 }
 
-function fillTextarea(fieldElement, value, _label, force) {
+function fillTextarea(fieldElement, value, _label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -427,11 +443,12 @@ function fillTextarea(fieldElement, value, _label, force) {
         return;
     }
     cy.wrap(fieldElement).find('textarea').type(value, {
+        delay,
         force
     }).wait(250);
 }
 
-function fillTextInput(fieldElement, value, _label, force) {
+function fillTextInput(fieldElement, value, _label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -453,11 +470,12 @@ function fillTextInput(fieldElement, value, _label, force) {
         return;
     }
     cy.wrap(fieldElement).find('input').type(value, {
+        delay,
         force
     }).wait(250);
 }
 
-function pickCheckPickerOptions(fieldElement, values, label, force) {
+function pickCheckPickerOptions(fieldElement, values, label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -495,6 +513,7 @@ function pickCheckPickerOptions(fieldElement, values, label, force) {
         values.forEach((value)=>{
             if (maybeSearchInput) {
                 cy.wrap(rsuitePickerPopupElement).find('input[role="searchbox"]').type(value, {
+                    delay,
                     force
                 }).wait(250);
             }
@@ -504,6 +523,7 @@ function pickCheckPickerOptions(fieldElement, values, label, force) {
         });
         // Close the picker popup by pressing the escape key
         cy.get('body').type('{esc}', {
+            delay,
             force
         });
         // TODO Create a util to handle the `fieldElement` re-creation cases.
@@ -513,7 +533,7 @@ function pickCheckPickerOptions(fieldElement, values, label, force) {
     });
 }
 
-function pickMultiSelectOptions(fieldElement, values, label, force) {
+function pickMultiSelectOptions(fieldElement, values, label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -550,6 +570,7 @@ function pickMultiSelectOptions(fieldElement, values, label, force) {
             cy.wrap(fieldElement).find('.rs-picker-toggle').click({
                 force
             }).wait(250).type(value, {
+                delay,
                 force
             }).wait(250);
             cy.wrap(rsuitePickerPopupElement).find('[role="option"]').contains(value).scrollIntoView().click({
@@ -557,7 +578,10 @@ function pickMultiSelectOptions(fieldElement, values, label, force) {
             });
         });
         // Close the picker popup by pressing the escape key
-        cy.get('body').type('{esc}');
+        cy.get('body').type('{esc}', {
+            delay,
+            force
+        });
         // TODO Create a util to handle the `fieldElement` re-creation cases.
         // We to use a `wait` as a temporary fix to handle `fieldElement` re-creation cases.
         cy.wait(250);
@@ -565,7 +589,7 @@ function pickMultiSelectOptions(fieldElement, values, label, force) {
     });
 }
 
-function pickSearchOption(fieldElement, value, _label, force) {
+function pickSearchOption(fieldElement, value, _label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -592,6 +616,7 @@ function pickSearchOption(fieldElement, value, _label, force) {
     }
     // Search for the value
     cy.wrap(fieldElement).find('input[role="combobox"]').type(value, {
+        delay,
         force
     });
     // Wait for the picker to open
@@ -603,7 +628,7 @@ function pickSearchOption(fieldElement, value, _label, force) {
     });
 }
 
-function pickSelectOption(fieldElement, value, label, force) {
+function pickSelectOption(fieldElement, value, label, force, delay) {
     Cypress.log({
         consoleProps: ()=>({
                 'Applied to': fieldElement,
@@ -641,6 +666,7 @@ function pickSelectOption(fieldElement, value, label, force) {
         const maybeSearchInput = rsuitePickerPopupElement.querySelector('input[role="searchbox"]');
         if (maybeSearchInput) {
             cy.wrap(rsuitePickerPopupElement).find('input[role="searchbox"]').type(value, {
+                delay,
                 force
             }).wait(250);
         }
@@ -739,43 +765,43 @@ function fill(label, value, options = {}) {
                 // CheckPicker
                 case fieldElement.classList.contains('Field-CheckPicker'):
                     assertStringArrayOrUndefined(value, 'CheckPicker');
-                    pickCheckPickerOptions(fieldElement, value, label, controlledOptions.force);
+                    pickCheckPickerOptions(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // MultiSelect
                 case fieldElement.classList.contains('Field-MultiSelect'):
                     assertStringArrayOrUndefined(value, 'MultiSelect');
-                    pickMultiSelectOptions(fieldElement, value, label, controlledOptions.force);
+                    pickMultiSelectOptions(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // Search
                 case fieldElement.classList.contains('Field-Search'):
                     assertStringOrUndefined(value, 'Search');
-                    pickSearchOption(fieldElement, value, label, controlledOptions.force);
+                    pickSearchOption(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // Select
                 case fieldElement.classList.contains('Field-Select'):
                     assertStringOrUndefined(value, 'Select');
-                    pickSelectOption(fieldElement, value, label, controlledOptions.force);
+                    pickSelectOption(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // NumberInput
                 case fieldElement.classList.contains('Field-NumberInput'):
                     assertNumberOrUndefined(value, 'TextInput');
-                    fillNumberInput(fieldElement, value, label, controlledOptions.force);
+                    fillNumberInput(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // Textarea
                 case fieldElement.classList.contains('Field-Textarea'):
                     assertStringOrUndefined(value, 'Textarea');
-                    fillTextarea(fieldElement, value, label, controlledOptions.force);
+                    fillTextarea(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 //  TextInput
                 case fieldElement.classList.contains('Field-TextInput'):
                     assertStringOrUndefined(value, 'TextInput');
-                    fillTextInput(fieldElement, value, label, controlledOptions.force);
+                    fillTextInput(fieldElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 default:
                     throwError(`\`cy.fill()\` can't handle field with \`<label>\` "${label}".`);
@@ -794,13 +820,13 @@ function fill(label, value, options = {}) {
                 // DatePicker
                 case fieldsetElement.classList.contains('Field-DatePicker'):
                     assertDateTupleOrDateWithTimeTupleOrUndefined(value, 'DatePicker');
-                    fillDatePicker(fieldsetElement, value, label, controlledOptions.force);
+                    fillDatePicker(fieldsetElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // DateRangePicker
                 case fieldsetElement.classList.contains('Field-DateRangePicker'):
                     assertDateRangeTupleOrDateWithTimeRangeTupleOrUndefined(value, 'DateRangePicker');
-                    fillDateRangePicker(fieldsetElement, value, label, controlledOptions.force);
+                    fillDateRangePicker(fieldsetElement, value, label, controlledOptions.force, controlledOptions.delay);
                     return;
                 // ---------------------------------------------------------------------
                 // MultiCheckbox

package/index.js

@@ -68109,6 +68109,7 @@ const StyledCloseButton = styled(IconButton)`
   position: absolute;
   right: 0;
   top: 0;
+  margin: ${(p)=>p.$size === Size.LARGE ? 9 : 5}px;
 
   ${(p)=>!p.$isSearchIconHidden && `
     margin: ${p.$size === Size.LARGE ? '8.5px 50px 0 0' : '4px 39px 0 0'};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mtes-mct/monitor-ui",
   "description": "Common React components, hooks, utilities and CSS stylesheets for MonitorFish, MonitorEnv and RapportNav.",
-  "version": "13.2.0",
+  "version": "13.3.0",
   "license": "AGPL-3.0",
   "type": "module",
   "engines": {