[FIX] web, web_editor: avoid rendering color palettes more than once

Before this commit the palette was rendered each time it was opened.

After this commit if the palette has already been rendered only the
selected color is being updated in the palette (and its colorpicker).

task-2439295
https://github.com/odoo/odoo/pull/65223

X-original-commit: 7f19f63b18bc7d17a393b3535492c7f90595ca39
Co-authored-by: Samuel Degueldre <sad@odoo.com>

addons/web/static/src/js/widgets/colorpicker.js

@@ -102,6 +102,17 @@ var ColorpickerWidget = Widget.extend({
         this._super.apply(this, arguments);
         $(document).off(`.${this.uniqueId}`);
     },
+    /**
+     * Sets the currently selected color
+     *
+     * @param {string} color rgb[a]
+     */
+    setSelectedColor: function (color) {
+        var rgba = ColorpickerWidget.convertCSSColorToRgba(color);
+        if (rgba) {
+            this._updateRgba(rgba.red, rgba.green, rgba.blue, rgba.opacity);
+        }
+    },
 
     //--------------------------------------------------------------------------
     // Private

addons/web_editor/static/src/js/editor/snippets.options.js

@@ -1320,7 +1320,7 @@ const ColorpickerUserValueWidget = SelectUserValueWidget.extend({
     async setValue(color) {
         await this._super(...arguments);
 
-        await this._renderColorPalette();
+        this.colorPalette.setSelectedColor(this._value);
 
         const classes = weUtils.computeColorClasses(this.colorPalette.getColorNames());
         this.colorPreviewEl.classList.remove(...classes);

addons/web_editor/static/src/js/wysiwyg/widgets/color_palette.js

@@ -155,6 +155,14 @@ const ColorPaletteWidget = Widget.extend({
     getColorNames: function () {
         return this.colorNames;
     },
+    /**
+     * Sets the currently selected color
+     *
+     * @param {string} color rgb[a]
+     */
+    setSelectedColor: function (color) {
+        this._selectColor({color: color});
+    },
 
     //--------------------------------------------------------------------------
     // Private
@@ -257,13 +265,16 @@ const ColorPaletteWidget = Widget.extend({
      * Set the selectedColor and trigger an event
      *
      * @param {Object} color
-     * @param {string} eventName
+     * @param {string} [eventName]
      */
     _selectColor: function (colorInfo, eventName) {
         this.selectedColor = colorInfo.color = this.colorToColorNames[colorInfo.color] || colorInfo.color;
-        this.trigger_up(eventName, colorInfo);
+        if (eventName) {
+            this.trigger_up(eventName, colorInfo);
+        }
         this._buildCustomColors();
         this._markSelectedColor();
+        this.colorPicker.setSelectedColor(colorInfo.color);
     },
     /**
      * Mark the selected color