UI: Convert widget style to camel case

This commit is contained in:
Artem Dzhereleiko 2023-11-09 15:37:49 +02:00
parent 3bc89c35af
commit d52f745909
2 changed files with 17 additions and 4 deletions

View File

@ -817,3 +817,7 @@ export const getOS = (): string => {
export const camelCase = (str: string): string => { export const camelCase = (str: string): string => {
return _.camelCase(str); return _.camelCase(str);
}; };
export const convertKeysToCamelCase = (obj: Record<string, any>): Record<string, any> => {
return _.mapKeys(obj, (value, key) => _.camelCase(key));
};

View File

@ -27,7 +27,15 @@ import { WidgetLayout, WidgetLayouts } from '@app/shared/models/dashboard.models
import { IDashboardWidget, WidgetAction, WidgetContext, WidgetHeaderAction } from './widget-component.models'; import { IDashboardWidget, WidgetAction, WidgetContext, WidgetHeaderAction } from './widget-component.models';
import { Timewindow } from '@shared/models/time/time.models'; import { Timewindow } from '@shared/models/time/time.models';
import { Observable, of, Subject } from 'rxjs'; import { Observable, of, Subject } from 'rxjs';
import { formattedDataFormDatasourceData, guid, isDefined, isEqual, isUndefined } from '@app/core/utils'; import {
convertKeysToCamelCase,
formattedDataFormDatasourceData,
guid,
isDefined,
isEmpty,
isEqual,
isUndefined
} from '@app/core/utils';
import { IterableDiffer, KeyValueDiffer } from '@angular/core'; import { IterableDiffer, KeyValueDiffer } from '@angular/core';
import { IAliasController, IStateController } from '@app/core/api/widget-api.models'; import { IAliasController, IStateController } from '@app/core/api/widget-api.models';
import { enumerable } from '@shared/decorators/enumerable'; import { enumerable } from '@shared/decorators/enumerable';
@ -479,9 +487,10 @@ export class DashboardWidget implements GridsterItem, IDashboardWidget {
backgroundColor: this.backgroundColor, backgroundColor: this.backgroundColor,
padding: this.padding, padding: this.padding,
margin: this.margin, margin: this.margin,
borderRadius: this.borderRadius || 'unset' }; borderRadius: this.borderRadius };
if (this.widget.config.widgetStyle) { if (this.widget.config.widgetStyle && !isEmpty(this.widget.config.widgetStyle)) {
this.style = {...this.style, ...this.widget.config.widgetStyle}; const convertedStyle = convertKeysToCamelCase(this.widget.config.widgetStyle);
this.style = {...this.style, ...convertedStyle};
} }
this.showWidgetTitlePanel = this.widgetContext.hideTitlePanel ? false : this.showWidgetTitlePanel = this.widgetContext.hideTitlePanel ? false :