Merge branch 'master' into issue-211-2

Signed-off-by: Max Hauser <[email protected]>

README.md

@@ -232,6 +232,7 @@ E.g., if it was used in a menu and the menu is red, the circle would be red.
 ### **WORK IN PROGRESS**
 * (foxriver76) fixed reactivity in custom components
 * (foxriver76) after creating a group it is now pre-selected
+* (foxriver76) fields are now updated when moved via keyboard
 
 ### 2.9.1 (2023-11-28)
 * (foxriver76) recalculate fields after moving widgets

src/.eslintrc.js

@@ -23,6 +23,11 @@ module.exports = {
         'only-warn',
         'react-hooks',
     ],
+    settings: {
+        'import/resolver': {
+            typescript: {}, // this loads <rootdir>/tsconfig.json to eslint
+        },
+    },
     rules: {
         'arrow-parens': [1, 'as-needed'],
         'react/jsx-indent': 'off',

src/package.json

@@ -26,6 +26,7 @@
         "echarts-for-react": "^3.0.2",
         "eslint": "^8.54.0",
         "eslint-config-airbnb": "^19.0.4",
+        "eslint-import-resolver-typescript": "^3.6.1",
         "eslint-plugin-eqeqeq-fix": "^1.0.3",
         "eslint-plugin-import": "^2.29.0",
         "eslint-plugin-jsx-a11y": "^6.8.0",
@@ -70,4 +71,4 @@
         "not ie <= 11",
         "not op_mini all"
     ]
-}
+}

src/src/App.jsx

@@ -32,10 +32,10 @@ import {
     Message as MessageDialog,
     SelectFile as SelectFileDialog, Icon,
 } from '@iobroker/adapter-react-v5';
+import { recalculateFields, store, updateProject } from './Store';
 import {
     isGroup, getNewWidgetId, getNewGroupId, pasteGroup, unsyncMultipleWidgets, deepClone,
 } from './Utils/utils';
-import { recalculateFields, store, updateProject } from './Store';
 
 import Attributes from './Attributes';
 import Palette from './Palette';

src/src/Toolbar/WidgetImportDialog.jsx

@@ -27,10 +27,12 @@ const WidgetImportDialog = props => {
         const project = JSON.parse(JSON.stringify(visProject));
         const widgets = JSON.parse(data);
         const newWidgets = {};
+        let groupOffset = 0;
+        let widgetOffset = 0;
 
-        widgets.forEach(widget => {
+        for (const widget of widgets) {
             if (isGroup(widget)) {
-                const newKey = getNewGroupId(visProject);
+                const newKey = getNewGroupId(visProject, groupOffset++);
                 newWidgets[newKey] = widget;
                 // find all widgets that belong to this group and change groupid
                 let w;
@@ -41,7 +43,7 @@ const WidgetImportDialog = props => {
                     }
                 } while (w);
             } else {
-                const newKey = getNewWidgetId(visProject);
+                const newKey = getNewWidgetId(visProject, widgetOffset++);
                 newWidgets[newKey] = widget;
                 if (widget.grouped && newWidgets[widget.groupid] && newWidgets[widget.groupid].data && newWidgets[widget.groupid].data.members) {
                     // find group
@@ -51,7 +53,7 @@ const WidgetImportDialog = props => {
                     }
                 }
             }
-        });
+        }
 
         Object.keys(newWidgets).forEach(wid => delete newWidgets[wid]._id);
 

src/src/Vis/Widgets/Basic/BasicScreenResolution.tsx

@@ -2,14 +2,14 @@ import React from 'react';
 
 import { I18n } from '@iobroker/adapter-react-v5';
 
-// eslint-disable-next-line import/no-cycle
-import VisRxWidget from '../../visRxWidget';
-
 import {
     RxRenderWidgetProps, VisLegacy,
     RxWidgetState, RxWidgetProps,
 } from '@/types';
 
+// eslint-disable-next-line import/no-cycle
+import VisRxWidget from '../../visRxWidget';
+
 declare global {
     interface Window {
         vis: VisLegacy;

src/src/Vis/Widgets/Basic/BasicSvgShape.tsx

@@ -1,10 +1,9 @@
 import React from 'react';
 
+import { RxRenderWidgetProps } from '@/types';
 // eslint-disable-next-line import/no-cycle
 import VisRxWidget from '../../visRxWidget';
 
-import { RxRenderWidgetProps } from '@/types';
-
 export default class BasicSvgShape extends VisRxWidget {
     /**
      * Returns the widget info which is rendered in the edit mode

src/src/Vis/visView.jsx

@@ -983,6 +983,7 @@ class VisView extends React.Component {
         this.moveTimer = setTimeout(() => {
             this.moveTimer = null;
             this.showRulers(true);
+            store.dispatch(recalculateFields(true));
 
             this.props.selectedWidgets.forEach(wid => {
                 if (this.widgetsRefs[wid]?.onMove) {