From f02c9bfe2b1598cb4d95ed9a3c241ad5f031dcd1 Mon Sep 17 00:00:00 2001
From: Imen Chermiti <imen.chermiti@ouidou.fr>
Date: Tue, 5 Dec 2023 00:52:16 +0100
Subject: [PATCH 1/3] feat: add power BI iframe

---
 package-lock.json                             |  2 +-
 .../src/components/HomePage/sections.js       | 65 +++++--------------
 2 files changed, 17 insertions(+), 50 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index d6ab60ff..cae9bb5c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "fce",
-  "version": "27.49.0",
+  "version": "27.89.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/src/client/src/components/HomePage/sections.js b/src/client/src/components/HomePage/sections.js
index 205d82b1..32c21202 100644
--- a/src/client/src/components/HomePage/sections.js
+++ b/src/client/src/components/HomePage/sections.js
@@ -2,8 +2,6 @@ import PropTypes from "prop-types";
 import React from "react";
 import { Link } from "react-router-dom";
 
-import { NounExcelIcon, NounPeopleIcon, NounPlatformIcon } from "./Icons";
-
 const LoginLink = () => (
   <div
     className="home-page__link"
@@ -24,56 +22,25 @@ const RequestAccessLink = () => (
   </div>
 );
 
-export const IconItems = ({ users, isLoading = false }) => {
-  // I can't use anonymous function without a display name for icon.
-  // That's make a lint error
-  const items = [
-    {
-      firstParagraph: "22 millions d’entreprises",
-      icon: function renderIcon(height) {
-        return <NounExcelIcon height={height} />;
-      },
-      secondParagraph: "37 millions d’établissements",
-    },
-    {
-      firstParagraph: "59 millions de fiches​",
-      icon: function renderIcon(height) {
-        return <NounPlatformIcon height={height} />;
-      },
-      secondParagraph: "200 Go de données​",
-    },
-    {
-      firstParagraph: `+ ${users} utilisateurs`,
-      icon: function renderIcon(height) {
-        return <NounPeopleIcon height={height} />;
-      },
-      secondParagraph: "dans les Dreets et Ddets(PP)",
-    },
-  ];
-
+export const IconItems = () => {
   return (
     <div className="home-page__section ">
-      <h2 className="home-page__blue-title">FCE en chiffres</h2>
+      {/* <h2 className="home-page__blue-title">FCE en chiffres</h2> */}
       <div className="columns icons">
-        {items.map((item, index) => {
-          return (
-            <div className="column is-3 icons__item" key={item.firstParagraph}>
-              <div>
-                <div className="icons__image-container">{item.icon(40)}</div>
-                {isLoading && index === 2 ? (
-                  <div className="dots">
-                    <div />
-                    <div />
-                    <div />
-                  </div>
-                ) : (
-                  <p className="first-text">{item.firstParagraph}</p>
-                )}
-                <p>{item.secondParagraph}</p>
-              </div>
-            </div>
-          );
-        })}
+        <iframe
+          title="Report Section"
+          width="100%"
+          height="373.5"
+          src="https://app.powerbi.com/view?r=eyJrIjoiNzdiNjg5YzgtNzk2OC00ZTkwLWEwOWYtNTBlOGM1ODc2ZjFlIiwidCI6IjAzNWU1MjkyLTVhMjUtNDUwOS1iYjA4LWE1NTVmN2QzMWE4YiJ9"
+          frameBorder="0"
+          allowFullScreen="true"
+          style={{
+            backgroundColor: "#ffffff !important",
+            filter: "drop-shadow(0 1px 3px rgba(0, 0, 18, 0.16))",
+            overflow: "hidden",
+            padding: 0,
+          }}
+        />
       </div>
     </div>
   );

From 4540425a446d4c1e06d6dc9682e0986990e716e4 Mon Sep 17 00:00:00 2001
From: Imen Chermiti <imen.chermiti@ouidou.fr>
Date: Tue, 2 Jan 2024 16:07:37 +0100
Subject: [PATCH 2/3] feat: fix iframe dimensions

---
 src/client/src/components/HomePage/sections.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/client/src/components/HomePage/sections.js b/src/client/src/components/HomePage/sections.js
index 32c21202..fb7ab2fb 100644
--- a/src/client/src/components/HomePage/sections.js
+++ b/src/client/src/components/HomePage/sections.js
@@ -26,11 +26,12 @@ export const IconItems = () => {
   return (
     <div className="home-page__section ">
       {/* <h2 className="home-page__blue-title">FCE en chiffres</h2> */}
-      <div className="columns icons">
+      <div className="columns icons" style={{ height: "60vh" }}>
         <iframe
           title="Report Section"
           width="100%"
-          height="373.5"
+          height="100%"
+          userScalable="no"
           src="https://app.powerbi.com/view?r=eyJrIjoiNzdiNjg5YzgtNzk2OC00ZTkwLWEwOWYtNTBlOGM1ODc2ZjFlIiwidCI6IjAzNWU1MjkyLTVhMjUtNDUwOS1iYjA4LWE1NTVmN2QzMWE4YiJ9"
           frameBorder="0"
           allowFullScreen="true"
@@ -39,6 +40,7 @@ export const IconItems = () => {
             filter: "drop-shadow(0 1px 3px rgba(0, 0, 18, 0.16))",
             overflow: "hidden",
             padding: 0,
+            color: "black",
           }}
         />
       </div>

From 138bad366d42353a4e30e99c8a7f6d0e83fc1c29 Mon Sep 17 00:00:00 2001
From: Imen Chermiti <imen.chermiti@ouidou.fr>
Date: Tue, 2 Jan 2024 18:07:10 +0100
Subject: [PATCH 3/3] feat: fix iframe dimensions

---
 src/client/src/components/HomePage/homePage.scss |  7 +++++++
 src/client/src/components/HomePage/sections.js   | 12 ++++++------
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/client/src/components/HomePage/homePage.scss b/src/client/src/components/HomePage/homePage.scss
index 1ca8cf9b..0e078860 100644
--- a/src/client/src/components/HomePage/homePage.scss
+++ b/src/client/src/components/HomePage/homePage.scss
@@ -63,6 +63,13 @@
             padding: $spacing-4 !important;
         }
     }
+    &__section-iframe {
+        padding: $spacing-4;
+        @media (max-width: 600px) {
+            padding: $spacing-4 !important;
+            margin: auto !important;
+        }
+    }
 
     &__summary {
         color: $dark-blue;
diff --git a/src/client/src/components/HomePage/sections.js b/src/client/src/components/HomePage/sections.js
index fb7ab2fb..2e003e9c 100644
--- a/src/client/src/components/HomePage/sections.js
+++ b/src/client/src/components/HomePage/sections.js
@@ -26,21 +26,21 @@ export const IconItems = () => {
   return (
     <div className="home-page__section ">
       {/* <h2 className="home-page__blue-title">FCE en chiffres</h2> */}
-      <div className="columns icons" style={{ height: "60vh" }}>
+      <div
+        className="columns icons "
+        style={{ height: "28VW", margin: "auto" }}
+      >
         <iframe
           title="Report Section"
           width="100%"
-          height="100%"
-          userScalable="no"
+          // height="90%"
           src="https://app.powerbi.com/view?r=eyJrIjoiNzdiNjg5YzgtNzk2OC00ZTkwLWEwOWYtNTBlOGM1ODc2ZjFlIiwidCI6IjAzNWU1MjkyLTVhMjUtNDUwOS1iYjA4LWE1NTVmN2QzMWE4YiJ9"
-          frameBorder="0"
           allowFullScreen="true"
           style={{
             backgroundColor: "#ffffff !important",
             filter: "drop-shadow(0 1px 3px rgba(0, 0, 18, 0.16))",
             overflow: "hidden",
             padding: 0,
-            color: "black",
           }}
         />
       </div>
@@ -181,7 +181,7 @@ export const DailyUse = () => {
   ];
 
   return (
-    <div className="home-page__daily-use home-page__section ">
+    <div className="home-page__daily-use home-page__section-iframe ">
       <h2 className="home-page__blue-title">Quels usages au quotidien ?</h2>
       <div className="columns home-page__daily-use__items">
         {items.map((item) => (