[FIX] table_style_editor_panel: disable "No Color" button

This PR introduces two changes:

1. Resolves a traceback error in the table style editor by
disabling the "No Color" button when not applicable.

2. Prevents errors by validating color input earlier, ensuring that
empty values are not processed when generating table color sets.

closes #5347

Task: 4102704
X-original-commit: bd13a6c
Signed-off-by: Rémi Rahir (rar) <[email protected]>
Signed-off-by: Dhrutik Patel (dhrp) <[email protected]>

Author: dhrp-odoo

src/components/side_panel/table_style_editor_panel/table_style_editor_panel.ts

@@ -1,4 +1,5 @@
 import { Component, useExternalListener, useState } from "@odoo/owl";
+import { isColorValid } from "../../../helpers";
 import { TABLE_STYLES_TEMPLATES, buildTableStyle } from "../../../helpers/table_presets";
 import {
   Color,
@@ -26,6 +27,8 @@ css/* scss */ `
   }
 `;
 
+const DEFAULT_TABLE_STYLE_COLOR = "#3C78D8";
+
 export interface TableStyleEditorPanelProps {
   onCloseSidePanel: () => void;
   styleId?: string;
@@ -63,7 +66,7 @@ export class TableStyleEditorPanel extends Component<
       : null;
     return {
       pickerOpened: false,
-      primaryColor: editedStyle?.primaryColor || "#3C78D8",
+      primaryColor: editedStyle?.primaryColor || DEFAULT_TABLE_STYLE_COLOR,
       selectedTemplateName: editedStyle?.templateName || "lightColoredText",
       styleName: editedStyle?.displayName || this.env.model.getters.getNewCustomTableStyleName(),
     };
@@ -74,7 +77,7 @@ export class TableStyleEditorPanel extends Component<
   }
 
   onColorPicked(color: Color) {
-    this.state.primaryColor = color;
+    this.state.primaryColor = isColorValid(color) ? color : DEFAULT_TABLE_STYLE_COLOR;
     this.state.pickerOpened = false;
   }
 

src/components/side_panel/table_style_editor_panel/table_style_editor_panel.xml

@@ -7,7 +7,11 @@
       </Section>
       <Section class="'pt-1'">
         <t t-set-slot="title">Style color</t>
-        <RoundColorPicker currentColor="state.primaryColor" onColorPicked.bind="onColorPicked"/>
+        <RoundColorPicker
+          currentColor="state.primaryColor"
+          onColorPicked.bind="onColorPicked"
+          disableNoColor="true"
+        />
       </Section>
       <Section class="'pt-1'">
         <t t-set-slot="title">Style template</t>