mirror of
https://github.com/ajnart/homarr.git
synced 2025-11-11 16:05:47 +01:00
✨ Change rendering from id to type
This commit is contained in:
@@ -42,17 +42,18 @@ export function WrapperContent({ apps, refs, widgets }: WrapperContentProps) {
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
{widgets.map((widget) => {
|
{widgets.map((widget) => {
|
||||||
const definition = Widgets[widget.id as keyof typeof Widgets] as
|
const definition = Widgets[widget.type as keyof typeof Widgets] as
|
||||||
| IWidgetDefinition
|
| IWidgetDefinition
|
||||||
| undefined;
|
| undefined;
|
||||||
if (!definition) return null;
|
if (!definition) return null;
|
||||||
|
console.log(definition);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<GridstackTileWrapper
|
<GridstackTileWrapper
|
||||||
type="widget"
|
type="widget"
|
||||||
key={widget.id}
|
key={widget.id}
|
||||||
itemRef={refs.items.current[widget.id]}
|
itemRef={refs.items.current[widget.id]}
|
||||||
id={definition.id}
|
id={widget.id}
|
||||||
{...definition.gridstack}
|
{...definition.gridstack}
|
||||||
{...widget.shape[shapeSize]?.location}
|
{...widget.shape[shapeSize]?.location}
|
||||||
{...widget.shape[shapeSize]?.size}
|
{...widget.shape[shapeSize]?.size}
|
||||||
@@ -60,7 +61,7 @@ export function WrapperContent({ apps, refs, widgets }: WrapperContentProps) {
|
|||||||
<WidgetWrapper
|
<WidgetWrapper
|
||||||
className="grid-stack-item-content"
|
className="grid-stack-item-content"
|
||||||
widget={widget}
|
widget={widget}
|
||||||
widgetId={widget.id}
|
widgetType={widget.type}
|
||||||
WidgetComponent={definition.component}
|
WidgetComponent={definition.component}
|
||||||
/>
|
/>
|
||||||
</GridstackTileWrapper>
|
</GridstackTileWrapper>
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import ErrorBoundary from './boundary';
|
|||||||
import { IWidget } from './widgets';
|
import { IWidget } from './widgets';
|
||||||
|
|
||||||
interface WidgetWrapperProps {
|
interface WidgetWrapperProps {
|
||||||
widgetId: string;
|
widgetType: string;
|
||||||
widget: IWidget<string, any>;
|
widget: IWidget<string, any>;
|
||||||
className: string;
|
className: string;
|
||||||
WidgetComponent: ComponentType<{ widget: IWidget<string, any> }>;
|
WidgetComponent: ComponentType<{ widget: IWidget<string, any> }>;
|
||||||
@@ -14,7 +14,7 @@ interface WidgetWrapperProps {
|
|||||||
|
|
||||||
// If a property has no value, set it to the default value
|
// If a property has no value, set it to the default value
|
||||||
const useWidget = <T extends IWidget<string, any>>(widget: T): T => {
|
const useWidget = <T extends IWidget<string, any>>(widget: T): T => {
|
||||||
const definition = Widgets[widget.id as keyof typeof Widgets];
|
const definition = Widgets[widget.type as keyof typeof Widgets];
|
||||||
|
|
||||||
return useMemo(() => {
|
return useMemo(() => {
|
||||||
const newProps = { ...widget.properties };
|
const newProps = { ...widget.properties };
|
||||||
@@ -33,7 +33,7 @@ const useWidget = <T extends IWidget<string, any>>(widget: T): T => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const WidgetWrapper = ({
|
export const WidgetWrapper = ({
|
||||||
widgetId,
|
widgetType: widgetId,
|
||||||
widget,
|
widget,
|
||||||
className,
|
className,
|
||||||
WidgetComponent,
|
WidgetComponent,
|
||||||
|
|||||||
@@ -13,7 +13,8 @@ import { ShapeType } from '../types/shape';
|
|||||||
|
|
||||||
// Type of widgets which are saved to config
|
// Type of widgets which are saved to config
|
||||||
export type IWidget<TKey extends string, TDefinition extends IWidgetDefinition> = {
|
export type IWidget<TKey extends string, TDefinition extends IWidgetDefinition> = {
|
||||||
id: TKey;
|
id: string;
|
||||||
|
type: TKey;
|
||||||
properties: {
|
properties: {
|
||||||
[key in keyof TDefinition['options']]: MakeLessSpecific<
|
[key in keyof TDefinition['options']]: MakeLessSpecific<
|
||||||
TDefinition['options'][key]['defaultValue']
|
TDefinition['options'][key]['defaultValue']
|
||||||
|
|||||||
Reference in New Issue
Block a user