[FIX] website, website_sale: repair Plausible dashboard layout

This commit includes several changes in the Plausible dashboard:
- Remove the "Analytics" title.
- Add margins (container-fluid => container).
  This also fixes the country map overflow and the flickering.
- Remove the duplicated scrollbars.
- Use the background colors from within the iframe.
- Hide the date range buttons by default, but show them if website_sale
  is installed.

It also reorders the Reporting menu as follows:
- Analytics
- eCommerce
- Online Sales
- Visitors
- Page Views

task-2993773

X-original-commit: b8c1976e933628182496929d348dda11b5051a0c
Part-of: odoo/odoo#102782

addons/website/static/src/scss/website.backend.scss

@@ -1,8 +1,37 @@
 .o_dashboards {
     background-color: #ececec;
 
+    &:has(iframe[src*='plausible']) {
+        background-color: #f9fafb; // Copied from iframe.
+    }
+
     .o_website_dashboard {
         background-color: #ececec;
+
+        &:has(iframe[src*='plausible']) {
+            background-color: #f9fafb; // Copied from iframe.
+
+            iframe {
+                // TODO: Find another way to set the height, not robust enough,
+                // especially if plausible change those values later.
+                height: 2350px; // Copied from iframe.
+                top: 2px; // Do not cover eCommerce dashboard border.
+
+                @include media-breakpoint-only(md) {
+                    height: 2500px; // Copied from iframe.
+                }
+                @include media-breakpoint-only(lg) {
+                    height: 1600px; // Copied from iframe.
+                }
+                @include media-breakpoint-only(xl) {
+                    height: 1570px; // Copied from iframe.
+                }
+                @include media-breakpoint-only(xxl) {
+                    height: 1650px; // Copied from iframe.
+                }
+            }
+        }
+
         div.o_box {
             @include clearfix;
             color: $o-main-color-muted;

addons/website/static/src/xml/website.backend.xml

@@ -30,24 +30,24 @@
 
     <t t-name="website.plausible_content">
         <div class="row o_dashboard_visits" t-if="widget.groups.website_designer">
-            <div class="col-12 o_box">
-                <h2>Analytics</h2>
-                <div t-if="widget.dashboards_data.plausible_share_url" class="row">
+            <div t-if="widget.dashboards_data.plausible_share_url" class="col-12">
+                <div class="container">
                     <div class="ratio ratio-1x1">
-                        <iframe t-att-src='widget.dashboards_data.plausible_share_url' class="embed-responsive-item" frameborder="0" loading="lazy"/>
+                        <iframe t-att-src='widget.dashboards_data.plausible_share_url' class="embed-responsive-item" frameborder="0" loading="lazy" scrolling="no"/>
                     </div>
                 </div>
-                <div t-else="" class="col-lg-12">
-                    <div class="o_demo_background">
-                        <div class="o_layer">
-                        </div>
-                        <div class="o_buttons text-center">
-                            <h3>Easily track your visitor with Plausible</h3>
-                            <a class="btn btn-primary" target="_blank"
-                               href="https://www.odoo.com/documentation/master/applications/websites/website/optimize/plausible.html">
-                                Connect Plausible
-                            </a>
-                        </div>
+            </div>
+            <div t-else="" class="col-lg-12 o_box">
+                <h2>Analytics</h2>
+                <div class="o_demo_background">
+                    <div class="o_layer">
+                    </div>
+                    <div class="o_buttons text-center">
+                        <h3>Easily track your visitor with Plausible</h3>
+                        <a class="btn btn-primary" target="_blank"
+                           href="https://www.odoo.com/documentation/master/applications/websites/website/optimize/plausible.html">
+                            Connect Plausible
+                        </a>
                     </div>
                 </div>
             </div>
@@ -56,7 +56,8 @@
 
     <t t-name="website.DateRangeButtons">
         <!-- TODO: Hide in mobile as it is going to push in control panel and it breaks UI, maybe we will improve it in future -->
-        <div class="btn-group o_date_range_buttons d-none d-md-inline-flex float-end">
+        <t t-set="show_range_buttons" t-value="0"/>
+        <div t-attf-class="btn-group o_date_range_buttons #{show_range_buttons ? 'd-md-inline-flex' : 'd-none'} float-end">
             <button class="btn btn-secondary js_date_range active" data-date="week">Last Week</button>
             <button class="btn btn-secondary js_date_range" data-date="month">Last Month</button>
             <button class="btn btn-secondary js_date_range" data-date="year">Last Year</button>

addons/website/views/website_views.xml

@@ -454,14 +454,14 @@
 
         <menuitem id="menu_website_dashboard"
             name="eCommerce"
-            sequence="10"
+            sequence="20"
             parent="menu_reporting"
             action="website.ir_actions_server_website_dashboard"
             active="0"/>
 
         <menuitem id="menu_website_analytics"
             name="Analytics"
-            sequence="20"
+            sequence="10"
             parent="menu_reporting"
             action="website.ir_actions_server_website_analytics"/>
 

addons/website/views/website_visitor_views.xml

@@ -349,11 +349,11 @@
     </record>
 
     <menuitem id="website_visitor_menu" name="Visitors"
-        sequence="5"
+        sequence="40"
         parent="website.menu_reporting"
         action="website.website_visitors_action"/>
     <menuitem id="menu_visitor_view_menu" name="Page Views"
-        sequence="40"
+        sequence="50"
         parent="website.menu_reporting"
         action="website.website_visitor_view_action"/>
 </data></odoo>

addons/website_sale/static/src/xml/website_sale_dashboard.xml

@@ -159,4 +159,11 @@
             </div>
         </div>
     </t>
+
+    <!-- Show the date range buttons related to the 'community' Sales Dashboard -->
+    <t t-extend="website.DateRangeButtons">
+        <t t-jquery="t[t-set='show_range_buttons']" t-operation="attributes">
+            <attribute name="t-value" value="1" />
+        </t>
+    </t>
 </templates>