poc: integration d’un POIP

Author: nlepage

api/src/devcomp/infrastructure/datasources/learning-content/modules/bac-a-sable.json

@@ -61,6 +61,50 @@
         }
       ]
     },
+    {
+      "id": "0d4ef09a-ebb8-4514-a037-8fb22e540d7d",
+      "type": "lesson",
+      "title": "test web component",
+      "components": [
+        {
+          "type": "element",
+          "element": {
+            "id": "96e2457d-54d3-461a-97e4-69180a30bfb7",
+            "type": "text",
+            "content": "<p>Voici un web component</p>"
+          }
+        },
+        {
+          "type": "element",
+          "element": {
+            "id": "cfec5a0e-2ed5-462f-8974-e5ca25faae39",
+            "type": "custom",
+            "tagName": "cartes-a-retourner",
+            "props": {
+              "cardsPerLine": 4,
+              "cards": [
+                {
+                  "frontImageUrl": "https://i.imgur.com/ynIpt6T.png",
+                  "backImageUrl": "https://i.imgur.com/prjj6bH.png"
+                },
+                {
+                  "frontImageUrl": "https://i.imgur.com/Gcy9yUl.png",
+                  "backImageUrl": "https://i.imgur.com/HVZcy58.png"
+                },
+                {
+                  "frontImageUrl": "https://i.imgur.com/k2istl3.png",
+                  "backImageUrl": "https://i.imgur.com/ww44Phm.png"
+                },
+                {
+                  "frontImageUrl": "https://i.imgur.com/6MLS2tU.png",
+                  "backImageUrl": "https://i.imgur.com/chQSy0B.png"
+                }
+              ]
+            }
+          }
+        }
+      ]
+    },
     {
       "id": "0d4ef09a-ebb8-4514-a037-8fb22e540d7c",
       "type": "discovery",

mon-pix/app/app.js

@@ -1,5 +1,5 @@
 import './deprecation-workflow';
-import '@1024pix/web-components';
+import '@1024pix/epreuves-components';
 
 import Application from '@ember/application';
 import { init as initSentry } from '@sentry/ember';

mon-pix/app/components/module/element/web-component.gjs

@@ -1,6 +1,5 @@
-import { on } from '@ember/modifier';
 import { action } from '@ember/object';
-import { eq } from 'ember-truth-helpers';
+import { element } from 'ember-element-helper';
 
 import ModuleElement from './module-element';
 
@@ -16,9 +15,9 @@ export default class ModulixWebComponent extends ModuleElement {
   <template>
     <div class="element-webcomponent">
       <div class="element-webcomponent__container">
-        {{#if (eq @component.tagName "qcu-image")}}
-          <qcu-image props={{@component.props}} />
-        {{/if}}
+        {{#let (element @component.tagName) as |Tag|}}
+          <Tag props={{@component.props}} />
+        {{/let}}
       </div>
     </div>
   </template>

mon-pix/package-lock.json

@@ -46,10 +46,10 @@
     "@1024pix/ember-api-actions": "^1.1.0",
     "@1024pix/ember-matomo-tag-manager": "^2.4.3",
     "@1024pix/ember-testing-library": "^3.0.6",
+    "@1024pix/epreuves-components": "^0.1.0",
     "@1024pix/eslint-plugin": "^2.1.1",
     "@1024pix/pix-ui": "^55.6.0",
     "@1024pix/stylelint-config": "^5.1.28",
-    "@1024pix/web-components": "^0.2.7",
     "@babel/eslint-parser": "^7.25.1",
     "@babel/plugin-proposal-decorators": "^7.24.7",
     "@ember-data/json-api": "^5.3.8",
@@ -85,6 +85,7 @@
     "ember-cookies": "^1.0.0",
     "ember-data": "^5.3.8",
     "ember-dayjs": "^0.12.0",
+    "ember-element-helper": "^0.8.6",
     "ember-eslint-parser": "^0.5.0",
     "ember-exam": "^9.0.0",
     "ember-fetch": "^8.1.2",