🐛 Fix some issues with change position modal

src/components/Dashboard/Modals/ChangePosition/ChangePositionModal.tsx

@@ -44,10 +44,6 @@ export const ChangePositionModal = ({
     onSubmit(form.values.x, form.values.y, form.values.width, form.values.height);
   };
 
-  console.log(`Initial: (${form.values.width} / ${form.values.height})`);
-  console.log(widthData);
-  console.log(heightData);
-
   return (
     <form onSubmit={form.onSubmit(handleSubmit)}>
       <Grid>

src/components/Dashboard/Modals/ChangePosition/ChangeWidgetPositionModal.tsx

@@ -2,12 +2,11 @@ import { SelectItem } from '@mantine/core';
 import { closeModal, ContextModalProps } from '@mantine/modals';
 import { useConfigContext } from '../../../../config/provider';
 import { useConfigStore } from '../../../../config/store';
-import { WidgetChangePositionModalInnerProps } from '../../Tiles/Widgets/WidgetsMenu';
-import { Tiles } from '../../Tiles/tilesDefinitions';
-import { ChangePositionModal } from './ChangePositionModal';
 import widgets from '../../../../widgets';
+import { WidgetChangePositionModalInnerProps } from '../../Tiles/Widgets/WidgetsMenu';
+import { ChangePositionModal } from './ChangePositionModal';
 
-export const ChangeIntegrationPositionModal = ({
+export const ChangeWidgetPositionModal = ({
   context,
   id,
   innerProps,
@@ -20,25 +19,25 @@ export const ChangeIntegrationPositionModal = ({
       return;
     }
 
-    updateConfig(configName, (prev) => ({
-      ...prev,
-      widgets: {
-        ...prev.widgets,
-        [innerProps.integration]: {
-          ...prev.widgets[innerProps.integration],
-          shape: {
-            location: {
-              x,
-              y,
-            },
-            size: {
-              height,
-              width,
-            },
-          },
+    updateConfig(configName, (prev) => {
+      let currentWidget = prev.widgets.find((x) => x.id === innerProps.widgetId);
+      currentWidget!.shape = {
+        location: {
+          x,
+          y,
         },
-      },
-    }));
+        size: {
+          height,
+          width,
+        },
+      };
+
+      return {
+        ...prev,
+        widgets: [...prev.widgets.filter((x) => x.id !== innerProps.widgetId), currentWidget!],
+      };
+    });
+
     context.closeModal(id);
   };
 
@@ -46,8 +45,8 @@ export const ChangeIntegrationPositionModal = ({
     closeModal(id);
   };
 
-  const widthData = useWidthData(innerProps.integration);
-  const heightData = useHeightData(innerProps.integration);
+  const widthData = useWidthData(innerProps.widgetId);
+  const heightData = useHeightData(innerProps.widgetId);
 
   return (
     <ChangePositionModal

src/components/Dashboard/Modals/EditAppModal/Tabs/IntegrationTab/Components/InputElements/IntegrationSelector.tsx

@@ -55,13 +55,13 @@ export const IntegrationSelector = ({ form }: IntegrationSelectorProps) => {
 
   const getNewProperties = (value: string | null): AppIntegrationPropertyType[] => {
     if (!value) return [];
-    const integrationType = value as AppIntegrationType['type'];
+    const integrationType = value as Exclude<AppIntegrationType['type'], null>;
     if (integrationType === null) {
       return [];
     }
 
     const requiredProperties = Object.entries(integrationFieldDefinitions).filter(([k, v]) => {
-      const val = integrationFieldProperties[integrationType['type']];
+      const val = integrationFieldProperties[integrationType];
       return val.includes(k as IntegrationField);
     })!;
     return requiredProperties.map(([k, value]) => ({
@@ -97,7 +97,6 @@ export const IntegrationSelector = ({ form }: IntegrationSelectorProps) => {
       }
       onChange={(value) => {
         form.setFieldValue('integration.properties', getNewProperties(value));
-        console.log(`changed to value ${value}`);
         inputProps.onChange(value);
       }}
       {...inputProps}

src/components/Dashboard/Tiles/Widgets/WidgetsMenu.tsx

@@ -7,7 +7,7 @@ import { WidgetEditModalInnerProps } from './WidgetsEditModal';
 import { WidgetsRemoveModalInnerProps } from './WidgetsRemoveModal';
 
 export type WidgetChangePositionModalInnerProps = {
-  integration: string;
+  widgetId: string;
   widget: IWidget<string, any>;
 };
 
@@ -37,7 +37,7 @@ export const WidgetsMenu = ({ integration, widget }: WidgetsMenuProps) => {
       size: 'xl',
       title: null,
       innerProps: {
-        integration,
+        widgetId: integration,
         widget: widget,
       },
     });

src/components/Dashboard/Wrappers/gridstack/init-gridstack.ts

@@ -60,7 +60,6 @@ export const initializeGridstack = (
     ({ id }) =>
       itemRefs.current[id] && grid.makeWidget(itemRefs.current[id].current as HTMLDivElement)
   );
-  console.log('widgets', widgets, itemRefs.current);
   widgets.forEach(
     ({ id }) =>
       itemRefs.current[id] && grid.makeWidget(itemRefs.current[id].current as HTMLDivElement)