Better background color when hover to heading (for sorting)

Previous commit runs only in dev

src/views/Project.vue

@@ -62,10 +62,11 @@ const tableHeaders = computed<TableHeader[]>(() => {
 
     const fields = dataStore.projectFieldsMap.get(props.projectData.id);
     if (fields) {
+        // Сортируем поля, возможно не нужно
         const sortedFields = [...fields].sort((a, b) => a.order - b.order);
         sortedFields.forEach((field) => {
             headers.push({
-                key: `attr_${field.id}`,
+                key: `attr_${field.id}`, // Ensure unique key for attributes
                 label: field.name,
                 isAttribute: true,
                 attributeId: field.id,
@@ -181,20 +182,31 @@ function getCellValue(userstory: Userstory, header: TableHeader): string | numbe
             return userstory.status_extra_info?.name || userstory.status?.toString() || "";
         }
         const value = userstory[header.key as keyof Userstory];
-        return value ?? "";
+
+        if (value === null) return null;
+        if (typeof value === "string" || typeof value === "number") return value;
+        // Если значение undefined, ?? "" превратит его в пустую строку.
+        // Если это объект (например, UserstoryStatusInfo) или boolean, его нужно преобразовать в строку.
+        if (value === undefined) return "";
+        return String(value); // Преобразует UserstoryStatusInfo, boolean и другие объекты в строку
     } else {
         if (header.attributeId === undefined) return "N/A (no attr ID)";
 
         const attributes = dataStore.userstoryAttributesMap.get(userstory.id);
         if (attributes) {
-            // Ключи для кастомных полей приходят как строки
             const attrValue = attributes[header.attributeId.toString()];
-            return attrValue ?? "";
+
+            if (attrValue === null) return null;
+            if (typeof attrValue === "string" || typeof attrValue === "number") return attrValue;
+            // Аналогично для атрибутов
+            if (attrValue === undefined) return "";
+            return String(attrValue); // Преобразует boolean, object в строку
         }
+
         if (isLoadingAttributesForAnyStory.value && !dataStore.userstoryAttributesMap.has(userstory.id)) {
             return "...";
         }
-        return "";
+        return ""; // Если атрибутов нет и не идет загрузка, вернуть пустую строку
     }
 }
 </script>
@@ -213,9 +225,8 @@ function getCellValue(userstory: Userstory, header: TableHeader): string | numbe
 }
 table thead tr th {
     font-weight: bold;
-    /* cursor: pointer; is added inline for now */
 }
 table thead tr th:hover {
-    background-color: #f2f2f2;
+    background-color: var(--color-background-mute);
 }
 </style>