Dev add stromae v3 (#714)

* add link to Stromae V3 * Update visualize-dropdown.spec.js.snap * update version --------- Co-authored-by: Laurent Caouissin <[email protected]>
InseeFr · Jan 10, 2024 · a78a494 · a78a494
1 parent 3537517
commit a78a494
Show file tree

Hide file tree

Showing 7 changed files with 88 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pogues",
-  "version": "1.5.5-rc5",
+  "version": "1.5.5-rc6",
   "description": "Outil de conception et de test de questionnaires.",
   "repository": {
     "type": "git",

diff --git a/src/actions/app-state.js b/src/actions/app-state.js
@@ -8,6 +8,7 @@ import {
   visualizeQueenCapi,
   visualizeQueenCati,
   visualizeWebStromaeV2,
+  visualizeWebStromaeV3,
 } from 'utils/remote-api';
 import { addVisualizationError } from './errors';
 import { TCM } from 'constants/pogues-constants';
@@ -399,6 +400,8 @@ export const visualizeActiveQuestionnaire = (type, componentId, token) => {
         return visualizeHtml;
       } else if (type === 'stromae-v2') {
         return visualizeWebStromaeV2;
+      } else if (type === 'stromae-v3') {
+        return visualizeWebStromaeV3;
       } else if (type === 'queen-capi') {
         return visualizeQueenCapi;
       } else if (type === 'queen-cati') {

diff --git a/src/constants/dictionary.js b/src/constants/dictionary.js
@@ -1566,6 +1566,10 @@ const dictionary = {
     fr: 'Web V2',
     en: 'Web V2',
   },
+  VISUALIZE_WEB_STROMAE_V3: {
+    fr: 'Web V3',
+    en: 'Web V3',
+  },
   VISUALIZE_QUEEN_CAPI: {
     fr: 'Enquêteur face à face',
     en: 'Interviewer face to face',

diff --git a/src/scss/inc/_generic-input.scss b/src/scss/inc/_generic-input.scss
@@ -27,12 +27,20 @@
   justify-content: space-around;
 }
 
-.flex-column{
+.flex-column {
   display: flex;
   flex-direction: column;
 }
 
-.flex-column-reverse{
+.flex-column-reverse {
   display: flex;
   flex-direction: column-reverse;
-}
+}
+
+.link-tag {
+  color: green;
+  border: solid green 0.5px;
+  border-radius: 10%;
+  padding: 1px;
+  margin-left: 5px;
+}
diff --git a/src/utils/remote-api.js b/src/utils/remote-api.js
@@ -161,6 +161,20 @@ export const visualizeWebStromaeV2 = async (qr, ref, token) => {
   );
 };
 
+/**
+ * This method will send a request in order to get the URL
+ * of the generated Stromae v2 page for the active questionnaire.
+ * @param {*} qr The active questionnaire
+ */
+export const visualizeWebStromaeV3 = async (qr, ref, token) => {
+  await getVizualisationUrl(
+    `${pathVisualisation}-stromae-v3/${qr.Name}`,
+    qr,
+    ref,
+    token,
+  );
+};
+
 /**
  * This method will call the back in order to get a documpent for
  * the visualization of the questionnaire in DDI, PDF and ODT (Spec)

diff --git a/src/widgets/visualize-dropdown/__snapshots__/visualize-dropdown.spec.js.snap b/src/widgets/visualize-dropdown/__snapshots__/visualize-dropdown.spec.js.snap
@@ -37,6 +37,21 @@ exports[`Visualize Dropdown Component:  Should disable the button 1`] = `
         Web V2
       </a>
     </li>
+    <li>
+      <a
+        href="#"
+        onClick={[Function]}
+      >
+        Web V3
+        <span
+          className="link-tag"
+        >
+          <i>
+            beta
+          </i>
+        </span>
+      </a>
+    </li>
     <li>
       <a
         href="#"
@@ -118,6 +133,21 @@ exports[`Visualize Dropdown Component:  Should display the dropdown on top 1`] =
         Web V2
       </a>
     </li>
+    <li>
+      <a
+        href="#"
+        onClick={[Function]}
+      >
+        Web V3
+        <span
+          className="link-tag"
+        >
+          <i>
+            beta
+          </i>
+        </span>
+      </a>
+    </li>
     <li>
       <a
         href="#"
@@ -199,6 +229,21 @@ exports[`Visualize Dropdown Component:  Should return the right HTML 1`] = `
         Web V2
       </a>
     </li>
+    <li>
+      <a
+        href="#"
+        onClick={[Function]}
+      >
+        Web V3
+        <span
+          className="link-tag"
+        >
+          <i>
+            beta
+          </i>
+        </span>
+      </a>
+    </li>
     <li>
       <a
         href="#"

diff --git a/src/widgets/visualize-dropdown/components/visualize-dropdown.jsx b/src/widgets/visualize-dropdown/components/visualize-dropdown.jsx
@@ -83,6 +83,11 @@ function VisualizeDropdown({
       actionType: 'stromae-v2',
       actionLabel: Dictionary.VISUALIZE_WEB_STROMAE_V2,
     },
+    {
+      actionType: 'stromae-v3',
+      actionLabel: Dictionary.VISUALIZE_WEB_STROMAE_V3,
+      tag: 'beta',
+    },
     { actionType: 'queen-capi', actionLabel: Dictionary.VISUALIZE_QUEEN_CAPI },
     { actionType: 'queen-cati', actionLabel: Dictionary.VISUALIZE_QUEEN_CATI },
     { actionType: 'pdf', actionLabel: Dictionary.VISUALIZE_PDF },
@@ -127,6 +132,11 @@ function VisualizeDropdown({
               <li key={link.actionLabel}>
                 <a href="#" onClick={e => visualize(e, link.actionType)}>
                   {link.actionLabel}
+                  {link.tag && (
+                    <span className="link-tag">
+                      <i>{link.tag}</i>
+                    </span>
+                  )}
                 </a>
               </li>
             );