[FW][FIX] calendar: hide 'sync' options from users

## Issues

- When the google and outlook sync plugins are not installed the admin user should see an option to install them from the calendar but other users should not see anything.

- The 'groups' guard would have prevented regular users from syncing their calendar at all if it had worked

- Users can get an obtuse error message if the administrator has not configured the installed sync modules

## Fix

- Replaces the 'groups' attribute in the calendar controller template with a t-if and a dynamic check as OWL doesn't process 'groups'.

- Update the structure of the calendar sync template to facilitate overriding the display conditions
- Update the inherits to override the display conditions and allow anyone to see the sync button once a module is installed

- Update the code that handles clicking 'sync' to throw the same error as it would have for other misconfigurations

task - 3056311

closes odoo/odoo#106517

Forward-port-of: odoo/odoo#105461
Related: odoo/enterprise#34382
Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>

addons/calendar/static/src/views/attendee_calendar/attendee_calendar_controller.js

@@ -4,11 +4,12 @@ import { CalendarController } from "@web/views/calendar/calendar_controller";
 import { useService } from "@web/core/utils/hooks";
 
 export class AttendeeCalendarController extends CalendarController {
-    setup() {
+    async setup() {
         super.setup();
         this.actionService = useService("action");
         this.user = useService("user");
         this.orm = useService("orm");
+        this.isSystemUser = await this.user.hasGroup('base.group_system');
     }
 
     onClickAddButton() {

addons/calendar/static/src/views/attendee_calendar/attendee_calendar_controller.xml

@@ -2,19 +2,21 @@
 <templates>
     <t t-name="calendar.AttendeeCalendarController" t-inherit="web.CalendarController" t-inherit-mode="primary" owl="1">
         <DatePicker position="after">
-            <div class="o_calendar_sync text-center" groups="base.group_system">
-                <span class="text-primary fs-6">Synchronize with:</span>
-            </div>
-            <div id="calendar_sync" class="container inline btn-group justify-content-evenly align-items-center" groups="base.group_system">
-                <div id="google_calendar_sync" class="o_calendar_sync">
-                    <button type="button" id="google_sync_activate" class="btn btn-muted" t-on-click="() => this.configureCalendarProviderSync('google')">
-                        <b><i class='fa fa-plug'/> Google</b>
-                    </button>
+            <div id="calendar_sync_wrapper" t-if="isSystemUser">
+                <div id="calendar_sync_title" class="o_calendar_sync text-center">
+                    <span class="text-primary fs-6">Synchronize with:</span>
                 </div>
-                <div id="microsoft_calendar_sync" class="o_calendar_sync">
-                    <button type="button" id="microsoft_sync_activate" class="btn btn-muted" t-on-click="() => this.configureCalendarProviderSync('microsoft')">
-                        <b><i class='fa fa-plug'/> Outlook</b>
-                    </button>
+                <div id="calendar_sync" class="container inline btn-group justify-content-evenly align-items-center">
+                    <div id="google_calendar_sync" class="o_calendar_sync" t-if="isSystemUser">
+                        <button type="button" id="google_sync_activate" class="btn btn-muted" t-on-click="() => this.configureCalendarProviderSync('google')">
+                            <b><i class='fa fa-plug'/> Google</b>
+                        </button>
+                    </div>
+                    <div id="microsoft_calendar_sync" class="o_calendar_sync" t-if="isSystemUser">
+                        <button type="button" id="microsoft_sync_activate" class="btn btn-muted" t-on-click="() => this.configureCalendarProviderSync('microsoft')">
+                            <b><i class='fa fa-plug'/> Outlook</b>
+                        </button>
+                    </div>
                 </div>
             </div>
         </DatePicker>

addons/google_calendar/static/src/views/google_calendar/google_calendar_controller.js

@@ -19,15 +19,17 @@ patch(AttendeeCalendarController.prototype, "google_calendar_google_calendar_con
             [[this.user.userId]],
         );
         const syncResult = await this.model.syncGoogleCalendar();
-        if (syncResult.status === "need_auth") {
-            this.configureCalendarProviderSync("google");
-        } else if (syncResult.status === "need_config_from_admin") {
-            if (Number.isInteger(syncResult.action)) {
-                this.dialog.add(ConfirmationDialog, {
-                    title: this.env._t("Configuration"),
-                    body: this.env._t("The Google Synchronization needs to be configured before you can use it, do you want to do it now?"),
-                    confirm: this.actionService.doAction.bind(this.actionService, syncResult.action),
-                });
+        if (["need_auth", "need_config_from_admin"].includes(syncResult.status)) {
+            if (this.isSystemUser) {
+                if (syncResult.status === "need_auth") {
+                    this.configureCalendarProviderSync("google");
+                } else if (syncResult.status === "need_config_from_admin") {
+                    this.dialog.add(ConfirmationDialog, {
+                        title: this.env._t("Configuration"),
+                        body: this.env._t("The Google Synchronization needs to be configured before you can use it, do you want to do it now?"),
+                        confirm: this.actionService.doAction.bind(this.actionService, syncResult.action),
+                    });
+                }
             } else {
                 this.dialog.add(AlertDialog, {
                     title: this.env._t("Configuration"),

addons/google_calendar/static/src/views/google_calendar/google_calendar_controller.xml

@@ -1,6 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates>
     <t t-name="google_calendar.GoogleCalendarController" t-inherit="calendar.AttendeeCalendarController" t-inherit-mode="extension" owl="1">
+        <xpath expr="//div[@id='calendar_sync_wrapper']" position="attributes">
+            <attribute name="t-if">true</attribute>
+        </xpath>
         <xpath expr="//div[@id='google_calendar_sync']" position="replace">
             <div id="google_calendar_sync" class="o_calendar_sync">
                 <button t-if="!model.googleIsSync" type="button" id="google_sync_pending" class="o_google_sync_button o_google_sync_pending btn btn-secondary btn" t-on-click="onGoogleSyncCalendar">

addons/google_calendar/static/tests/google_calendar_tests.js

@@ -126,6 +126,8 @@ QUnit.module('Google Calendar', {
                     assert.step(route);
                 } else if (route === '/web/dataset/call_kw/res.partner/get_attendee_detail') {
                     return Promise.resolve([]);
+                } else if (route === '/web/dataset/call_kw/res.users/has_group') {
+                    return Promise.resolve(true);
                 }
             },
         });

addons/microsoft_calendar/static/src/views/microsoft_calendar/microsoft_calendar_controller.js

@@ -19,15 +19,17 @@ patch(AttendeeCalendarController.prototype, "microsoft_calendar_microsoft_calend
             [[this.user.userId]],
         );
         const syncResult = await this.model.syncMicrosoftCalendar();
-        if (syncResult.status === "need_auth") {
-            this.configureCalendarProviderSync("microsoft");
-        } else if (syncResult.status === "need_config_from_admin") {
-            if (Number.isInteger(syncResult.action)) {
-                this.dialog.add(ConfirmationDialog, {
-                    title: this.env._t("Configuration"),
-                    body: this.env._t("The Outlook Synchronization needs to be configured before you can use it, do you want to do it now?"),
-                    confirm: this.actionService.doAction.bind(this.actionService, syncResult.action),
-                });
+        if (["need_auth", "need_config_from_admin"].includes(syncResult.status)) {
+            if (this.isSystemUser) {
+                if (syncResult.status === "need_auth") {
+                    this.configureCalendarProviderSync("microsoft");
+                } else if (syncResult.status === "need_config_from_admin") {
+                    this.dialog.add(ConfirmationDialog, {
+                        title: this.env._t("Configuration"),
+                        body: this.env._t("The Outlook Synchronization needs to be configured before you can use it, do you want to do it now?"),
+                        confirm: this.actionService.doAction.bind(this.actionService, syncResult.action),
+                    });
+                }
             } else {
                 this.dialog.add(AlertDialog, {
                     title: this.env._t("Configuration"),

addons/microsoft_calendar/static/src/views/microsoft_calendar/microsoft_calendar_controller.xml

@@ -1,6 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates>
     <t t-name="microsoft_calendar.MicrosoftCalendarController" t-inherit="calendar.AttendeeCalendarController" t-inherit-mode="extension" owl="1">
+        <xpath expr="//div[@id='calendar_sync_wrapper']" position="attributes">
+            <attribute name="t-if">true</attribute>
+        </xpath>
         <xpath expr="//div[@id='microsoft_calendar_sync']" position="replace">
             <div id="microsoft_calendar_sync" class="o_calendar_sync">
                 <button t-if="!model.microsoftIsSync" type="button" id="microsoft_sync_pending" class="o_microsoft_sync_button o_microsoft_sync_pending btn btn-secondary btn" t-on-click="onMicrosoftSyncCalendar">