test

frontend/src/pages/WeeklySummaryPage.jsx

@@ -31,9 +31,6 @@ const MOBILE_TIME_COLUMN_WIDTH = 64;
 const MOBILE_USER_COLUMN_WIDTH = 40;
 const MOBILE_DEFAULT_CONTENT_WIDTH = 236;
 
-const MOBILE_MIN_HOUR_HEIGHT = 56;
-const MOBILE_MAX_HOUR_HEIGHT = 80;
-
 const USER_COLORS = [
   '#c56a3d',
   '#3d7c8c',
@@ -413,7 +410,7 @@ const WeeklySummaryPage = ({ userId }) => {
 
   /*
    * ------------------------------------------------------------
-   * Hauteur + largeur du planning
+   * Dimensions du planning
    * ------------------------------------------------------------
    */
 
@@ -431,8 +428,9 @@ const WeeklySummaryPage = ({ userId }) => {
       );
 
       /*
-       * Sur mobile, la hauteur du planning est calculée
+       * Le mobile utilise directement la hauteur du conteneur
-       * directement à partir de la hauteur disponible.
+       * définie par 60vh. Il ne faut surtout pas recalculer
+       * une seconde hauteur à partir de window.innerHeight.
        */
       if (window.innerWidth < 768) {
         return;
@@ -1022,52 +1020,36 @@ const WeeklySummaryPage = ({ userId }) => {
    * Hauteur du planning
    * ------------------------------------------------------------
    *
-   * Mobile :
+   * MOBILE
-   * - on part de la hauteur réelle de la fenêtre visible ;
-   * - on retire la hauteur du header ;
-   * - on garde une hauteur minimale par heure ;
-   * - on limite la hauteur maximale afin d'éviter
-   *   des cases inutilement grandes ;
-   * - si le planning dépasse la fenêtre, le scroll
-   *   vertical reste disponible.
    *
-   * Desktop :
+   * Le conteneur visible fait exactement 60vh.
-   * - la hauteur disponible dans la Card est conservée.
+   *
+   * Le header occupe 58px.
+   *
+   * Le corps du planning prend donc :
+   *
+   *     60vh - 58px
+   *
+   * Puis cette hauteur est divisée exactement par le nombre
+   * d'heures.
+   *
+   * Il n'y a aucune hauteur min/max par heure.
    */
 
-  const mobileViewportHeight =
+  const mobilePlanningViewportHeight =
     typeof window !== 'undefined'
       ? window.innerHeight * 0.6
-      : 500;
+      : 0;
 
-  const mobileAvailableScheduleHeight =
+  const mobileScheduleHeight =
     Math.max(
-      mobileViewportHeight -
-        SCHEDULE_HEADER_HEIGHT,
       0,
-    );
+      mobilePlanningViewportHeight -
-
+        SCHEDULE_HEADER_HEIGHT,
-  const calculatedMobileHourHeight =
-    hourCount > 0
-      ? mobileAvailableScheduleHeight /
-        hourCount
-      : MOBILE_MIN_HOUR_HEIGHT;
-
-  const mobileHourHeight =
-    Math.min(
-      MOBILE_MAX_HOUR_HEIGHT,
-      Math.max(
-        MOBILE_MIN_HOUR_HEIGHT,
-        calculatedMobileHourHeight,
-      ),
     );
 
   const scheduleHeight = isMobile
-    ? Math.max(
+    ? mobileScheduleHeight
-        MIN_SCHEDULE_HEIGHT,
-        hourCount *
-          mobileHourHeight,
-      )
     : Math.max(
         MIN_SCHEDULE_HEIGHT,
         availableScheduleHeight,
@@ -1077,9 +1059,8 @@ const WeeklySummaryPage = ({ userId }) => {
     SCHEDULE_HEADER_HEIGHT +
     scheduleHeight;
 
-  const hourHeight = isMobile
+  const hourHeight =
-    ? mobileHourHeight
+    hourCount > 0
-    : hourCount > 0
       ? scheduleHeight / hourCount
       : 0;
 
@@ -1431,7 +1412,7 @@ const WeeklySummaryPage = ({ userId }) => {
           ref={scheduleTableRef}
           className={`relative rounded-lg border ${
             isMobile
-              ? 'h-[60vh] max-h-[60vh] overflow-x-auto overflow-y-auto'
+              ? 'h-[60vh] max-h-[60vh] overflow-x-auto overflow-y-hidden'
               : 'overflow-x-auto overflow-y-hidden'
           }`}
           style={{