From 43dc1cd70c2fcf3d47539f7315290f3e49acb78d Mon Sep 17 00:00:00 2001
From: Meier Lukas <meierschlumpf@gmail.com>
Date: Thu, 30 Mar 2023 21:54:44 +0200
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Change=20rendering=20from=20id=20to?=
 =?UTF-8?q?=20type?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Dashboard/Wrappers/WrapperContent.tsx | 7 ++++---
 src/widgets/WidgetWrapper.tsx                        | 6 +++---
 src/widgets/widgets.ts                               | 3 ++-
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/components/Dashboard/Wrappers/WrapperContent.tsx b/src/components/Dashboard/Wrappers/WrapperContent.tsx
index 1d1d3ad87..6eff1f62c 100644
--- a/src/components/Dashboard/Wrappers/WrapperContent.tsx
+++ b/src/components/Dashboard/Wrappers/WrapperContent.tsx
@@ -42,17 +42,18 @@ export function WrapperContent({ apps, refs, widgets }: WrapperContentProps) {
         );
       })}
       {widgets.map((widget) => {
-        const definition = Widgets[widget.id as keyof typeof Widgets] as
+        const definition = Widgets[widget.type as keyof typeof Widgets] as
           | IWidgetDefinition
           | undefined;
         if (!definition) return null;
+        console.log(definition);
 
         return (
           <GridstackTileWrapper
             type="widget"
             key={widget.id}
             itemRef={refs.items.current[widget.id]}
-            id={definition.id}
+            id={widget.id}
             {...definition.gridstack}
             {...widget.shape[shapeSize]?.location}
             {...widget.shape[shapeSize]?.size}
@@ -60,7 +61,7 @@ export function WrapperContent({ apps, refs, widgets }: WrapperContentProps) {
             <WidgetWrapper
               className="grid-stack-item-content"
               widget={widget}
-              widgetId={widget.id}
+              widgetType={widget.type}
               WidgetComponent={definition.component}
             />
           </GridstackTileWrapper>
diff --git a/src/widgets/WidgetWrapper.tsx b/src/widgets/WidgetWrapper.tsx
index 457890537..b8fa03ced 100644
--- a/src/widgets/WidgetWrapper.tsx
+++ b/src/widgets/WidgetWrapper.tsx
@@ -6,7 +6,7 @@ import ErrorBoundary from './boundary';
 import { IWidget } from './widgets';
 
 interface WidgetWrapperProps {
-  widgetId: string;
+  widgetType: string;
   widget: IWidget<string, any>;
   className: string;
   WidgetComponent: ComponentType<{ widget: IWidget<string, any> }>;
@@ -14,7 +14,7 @@ interface WidgetWrapperProps {
 
 // If a property has no value, set it to the default value
 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(() => {
     const newProps = { ...widget.properties };
@@ -33,7 +33,7 @@ const useWidget = <T extends IWidget<string, any>>(widget: T): T => {
 };
 
 export const WidgetWrapper = ({
-  widgetId,
+  widgetType: widgetId,
   widget,
   className,
   WidgetComponent,
diff --git a/src/widgets/widgets.ts b/src/widgets/widgets.ts
index d6559ed25..998413fea 100644
--- a/src/widgets/widgets.ts
+++ b/src/widgets/widgets.ts
@@ -13,7 +13,8 @@ import { ShapeType } from '../types/shape';
 
 // Type of widgets which are saved to config
 export type IWidget<TKey extends string, TDefinition extends IWidgetDefinition> = {
-  id: TKey;
+  id: string;
+  type: TKey;
   properties: {
     [key in keyof TDefinition['options']]: MakeLessSpecific<
       TDefinition['options'][key]['defaultValue']