From 915454bfaa216ac5ff7d96158e21199df35aaecc Mon Sep 17 00:00:00 2001
From: Pierre Paridans <app@odoo.com>
Date: Thu, 7 Sep 2023 15:57:24 +0200
Subject: [PATCH] [FIX] web: DateTimePicker focus when programmatically
 changing month

When passing a date out of the current as a props to the DateTimePicker
component, the chosen date is actually set but the calendar doesn't
rerender to display the corresponding month.

This commit fixes this behavior to properly focus the date's month.

closes odoo/odoo#134844

X-original-commit: 9dbb35479615f5aef7b22f21bf9f58f176874886
Signed-off-by: Julien Mougenot (jum) <jum@odoo.com>
Signed-off-by: Pierre Paridans (app) <app@odoo.com>
---
 .../src/core/datetime/datetime_picker.js      |  1 +
 .../core/datetime/datetime_picker_tests.js    | 55 +++++++++++++++++++
 2 files changed, 56 insertions(+)

diff --git a/addons/web/static/src/core/datetime/datetime_picker.js b/addons/web/static/src/core/datetime/datetime_picker.js
index c5a5013ff13..5600d38e9aa 100644
--- a/addons/web/static/src/core/datetime/datetime_picker.js
+++ b/addons/web/static/src/core/datetime/datetime_picker.js
@@ -412,6 +412,7 @@ export class DateTimePicker extends Component {
             this.state.timeValues[props.focusedDateIndex] = timeValues[props.focusedDateIndex];
         }
 
+        this.shouldAdjustFocusDate = !props.range;
         this.adjustFocus(this.values, props.focusedDateIndex);
         this.handle12HourSystem();
         this.state.timeValues = this.state.timeValues.map((timeValue) => timeValue.map(String));
diff --git a/addons/web/static/tests/core/datetime/datetime_picker_tests.js b/addons/web/static/tests/core/datetime/datetime_picker_tests.js
index 9968bce95cd..19ef0e8c5dd 100644
--- a/addons/web/static/tests/core/datetime/datetime_picker_tests.js
+++ b/addons/web/static/tests/core/datetime/datetime_picker_tests.js
@@ -13,6 +13,8 @@ import {
     getTimePickers,
     useTwelveHourClockFormat,
 } from "./datetime_test_helpers";
+import { Component, useState, xml } from "@odoo/owl";
+import { nextTick } from "../../helpers/utils";
 
 const { DateTime } = luxon;
 
@@ -1145,4 +1147,57 @@ QUnit.module("Components", ({ beforeEach }) => {
 
         assert.verifySteps(["2023-04-20T08:43:00,2023-04-27T17:16:00"]);
     });
+
+    QUnit.test("focus proper month when changing props out of current month", async (assert) => {
+        class Parent extends Component {
+            static template = xml`<DateTimePicker value="state.current"/>`;
+            static components = { DateTimePicker };
+            setup() {
+                this.state = useState({
+                    current: DateTime.now(),
+                })
+            }
+        }
+
+        const parent = await mount(Parent, getFixture(), { env });
+
+        assertDateTimePicker({
+            title: "April 2023",
+            date: [
+                {
+                    cells: [
+                        [-26, -27, -28, -29, -30, -31, 1],
+                        [2, 3, 4, 5, 6, 7, 8],
+                        [9, 10, 11, 12, 13, 14, 15],
+                        [16, 17, 18, 19, 20, 21, 22],
+                        [23, 24, ["25"], 26, 27, 28, 29],
+                        [30, -1, -2, -3, -4, -5, -6],
+                    ],
+                    daysOfWeek: ["#", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+                },
+            ],
+            time: [[13, 45]],
+        });
+
+        parent.state.current = DateTime.fromObject({ month: 5, day: 1, hour: 17, minute: 16 });
+        await nextTick();
+
+        assertDateTimePicker({
+            title: "May 2023",
+            date: [
+                {
+                    cells: [
+                        [-30, [1], 2, 3, 4, 5, 6],
+                        [7, 8, 9, 10, 11, 12, 13],
+                        [14, 15, 16, 17, 18, 19, 20],
+                        [21, 22, 23, 24, 25, 26, 27],
+                        [28, 29, 30, 31, -1, -2, -3],
+                        [-4, -5, -6, -7, -8, -9, -10],
+                    ],
+                    daysOfWeek: ["#", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+                },
+            ],
+            time: [[17, 0]],
+        });
+    });
 });