Implemented clone for groups

ioBroker · Jul 10, 2024 · 72c81b6 · 72c81b6
1 parent 26cf81f
commit 72c81b6
Show file tree

Hide file tree

Showing 12 changed files with 84 additions and 21 deletions.
diff --git a/packages/iobroker.vis-2/src/src/Attributes/Widget/index.tsx b/packages/iobroker.vis-2/src/src/Attributes/Widget/index.tsx
@@ -18,7 +18,7 @@ import {
     Delete,
     Add,
     LinkOff,
-    Link as LinkIcon,
+    Link as LinkIcon, ContentCopy,
 } from '@mui/icons-material';
 
 import { I18n, Icon, Utils } from '@iobroker/adapter-react-v5';
@@ -59,6 +59,8 @@ const ICONS: Record<string, React.JSX.Element> = {
     locked: <LockIcon fontSize="small" />,
 };
 
+type GroupAction = 'add' | 'delete' | 'down' | 'up' | 'clone';
+
 const styles: Record<string, any> = {
     accordionRoot: {
         p: 0,
@@ -756,6 +758,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
                 label: group.label,
                 index: group.index,
                 iterable: group.iterable,
+                singleName: group.singleName,
             }));
 
             newState.fields = [
@@ -955,7 +958,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
         e: React.MouseEvent,
         index: number,
         iterable: WidgetAttributeIterable,
-        direction: 0 | -1 | 1 | true,
+        direction: GroupAction,
     ) {
         e.stopPropagation();
         const project = deepClone(store.getState().visProject);
@@ -964,7 +967,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
         const accordionOpen = { ...this.state.accordionOpen };
 
         // if deletion
-        if (!direction) {
+        if (direction === 'delete') {
             if (iterable.indexTo) {
                 const lastGroup = this.state.fields.find(f => f.singleName  === iterable.group && f.iterable?.isLast);
                 for (let idx = index; idx < lastGroup.index; idx++) {
@@ -1011,8 +1014,48 @@ class Widget extends Component<WidgetProps, WidgetState> {
             return;
         }
 
-        if (direction === true) {
-            const lastGroup = this.state.fields.find(f => f.singleName  === iterable.group && f.iterable?.isLast);
+        if (direction === 'clone') {
+            const lastGroup = this.state.fields.find(f => f.singleName === iterable.group && f.iterable?.isLast);
+            // move all indexes after the current one
+            // add one line
+            const maxIndex = lastGroup.index;
+            this.props.selectedWidgets.forEach(wid => {
+                // order all attributes for better readability
+                const widgetData = _widgets[wid].data;
+                for (let i = maxIndex; i > index; i--) {
+                    lastGroup.fields.forEach(attr => {
+                        const oldName = attr.name.replace(/\d?\d+$/, i.toString());
+                        widgetData[oldName.replace(/\d?\d+$/, (i + 1).toString())] = widgetData[oldName];
+                    });
+
+                    // move group-used flag
+                    widgetData[`g_${iterable.group}-${i + 1}`] = widgetData[`g_${iterable.group}-${i}`];
+
+                    // move the opened flag
+                    accordionOpen[`${iterable.group}-${i + 1}`] = accordionOpen[`${iterable.group}-${i}`];
+                }
+                // copy current into index + 1
+                lastGroup.fields.forEach(attr => {
+                    const oldName = attr.name.replace(/\d?\d+$/, index.toString());
+                    widgetData[oldName.replace(/\d?\d+$/, (index + 1).toString())] = widgetData[oldName];
+                });
+
+                // enable group-used flag
+                widgetData[`g_${iterable.group}-${index + 1}`] = true;
+
+                // enable the opened flag
+                accordionOpen[`${iterable.group}-${index + 1}`] = 1; // open
+                widgetData[iterable.indexTo] = maxIndex + 1;
+            });
+            this.setAccordionState(accordionOpen, () => {
+                this.props.changeProject(project);
+                store.dispatch(recalculateFields(true));
+            });
+            return;
+        }
+
+        if (direction === 'add') {
+            const lastGroup = this.state.fields.find(f => f.singleName === iterable.group && f.iterable?.isLast);
             // add one line
             const newIndex = lastGroup.index + 1;
             this.props.selectedWidgets.forEach(wid => {
@@ -1036,7 +1079,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
                 store.dispatch(recalculateFields(true));
             });
         } else {
-            const newIndex = index + direction;
+            const newIndex = index + (direction === 'up' ? -1 : 1);
             const newGroup = this.state.fields.find(f => f.name === `${iterable.group}-${newIndex}`);
 
             // for every selected widget
@@ -1111,11 +1154,20 @@ class Widget extends Component<WidgetProps, WidgetState> {
                 </div>
                 {group.iterable ? <>
                     <div style={styles.grow} />
+                    {group.iterable.indexTo ? <Tooltip title={I18n.t('Clone')} componentsProps={{ popper: { sx: commonStyles.tooltip } }}>
+                        <IconButton
+                            style={styles.groupButton}
+                            size="small"
+                            onClick={e => this.onGroupMove(e, group.index, group.iterable, 'clone')}
+                        >
+                            <ContentCopy />
+                        </IconButton>
+                    </Tooltip> : null}
                     {group.iterable.indexTo ? <Tooltip title={I18n.t('Delete')} componentsProps={{ popper: { sx: commonStyles.tooltip } }}>
                         <IconButton
                             style={styles.groupButton}
                             size="small"
-                            onClick={e => this.onGroupMove(e, group.index, group.iterable, 0)}
+                            onClick={e => this.onGroupMove(e, group.index, group.iterable, 'delete')}
                         >
                             <Delete />
                         </IconButton>
@@ -1126,7 +1178,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
                             <IconButton
                                 style={styles.groupButton}
                                 size="small"
-                                onClick={e => this.onGroupMove(e, group.index, group.iterable, -1)}
+                                onClick={e => this.onGroupMove(e, group.index, group.iterable, 'up')}
                             >
                                 <ArrowUpward />
                             </IconButton>
@@ -1136,7 +1188,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
                             <IconButton
                                 style={styles.groupButton}
                                 size="small"
-                                onClick={e => this.onGroupMove(e, group.index, group.iterable, true)}
+                                onClick={e => this.onGroupMove(e, group.index, group.iterable, 'add')}
                             >
                                 <Add />
                             </IconButton>
@@ -1146,7 +1198,7 @@ class Widget extends Component<WidgetProps, WidgetState> {
                             <IconButton
                                 style={styles.groupButton}
                                 size="small"
-                                onClick={e => this.onGroupMove(e, group.index, group.iterable, 1)}
+                                onClick={e => this.onGroupMove(e, group.index, group.iterable, 'down')}
                             >
                                 <ArrowDownward />
                             </IconButton>

diff --git a/packages/iobroker.vis-2/src/src/i18n/de.json b/packages/iobroker.vis-2/src/src/i18n/de.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Frag nicht nochmal",
   "vis-2-widgets-basic-input_value": "Eingegebener Wert",
   "vis-2-widgets-basic-autoSetDelay": "Verzögerung für automatisches Schreiben",
-  "vis-2-widgets-basic-noStyle": "Kein Style"
+  "vis-2-widgets-basic-noStyle": "Kein Style",
+  "Clone": "Klonen"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/en.json b/packages/iobroker.vis-2/src/src/i18n/en.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Do not ask again",
   "vis-2-widgets-basic-input_value": "Input value",
   "vis-2-widgets-basic-autoSetDelay": "Delay for auto-write",
-  "vis-2-widgets-basic-noStyle": "No style"
+  "vis-2-widgets-basic-noStyle": "No style",
+  "Clone": "Clone"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/es.json b/packages/iobroker.vis-2/src/src/i18n/es.json
@@ -744,5 +744,6 @@
   "Do not ask again": "No preguntes de nuevo",
   "vis-2-widgets-basic-input_value": "Valor de entrada",
   "vis-2-widgets-basic-autoSetDelay": "Retraso para la escritura automática",
-  "vis-2-widgets-basic-noStyle": "Sin estilo"
+  "vis-2-widgets-basic-noStyle": "Sin estilo",
+  "Clone": "Clon"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/fr.json b/packages/iobroker.vis-2/src/src/i18n/fr.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Ne demande plus",
   "vis-2-widgets-basic-input_value": "Valeur d'entrée",
   "vis-2-widgets-basic-autoSetDelay": "Délai d'écriture automatique",
-  "vis-2-widgets-basic-noStyle": "Aucun style"
+  "vis-2-widgets-basic-noStyle": "Aucun style",
+  "Clone": "Cloner"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/it.json b/packages/iobroker.vis-2/src/src/i18n/it.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Non chiedere di nuovo",
   "vis-2-widgets-basic-input_value": "Valore immesso",
   "vis-2-widgets-basic-autoSetDelay": "Ritardo per la scrittura automatica",
-  "vis-2-widgets-basic-noStyle": "Nessuno stile"
+  "vis-2-widgets-basic-noStyle": "Nessuno stile",
+  "Clone": "Clone"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/nl.json b/packages/iobroker.vis-2/src/src/i18n/nl.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Niet meer vragen",
   "vis-2-widgets-basic-input_value": "Invoerwaarde",
   "vis-2-widgets-basic-autoSetDelay": "Vertraging voor automatisch schrijven",
-  "vis-2-widgets-basic-noStyle": "Geen stijl"
+  "vis-2-widgets-basic-noStyle": "Geen stijl",
+  "Clone": "Kloon"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/pl.json b/packages/iobroker.vis-2/src/src/i18n/pl.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Nie pytaj ponownie",
   "vis-2-widgets-basic-input_value": "Wartość wejściowa",
   "vis-2-widgets-basic-autoSetDelay": "Opóźnienie automatycznego zapisu",
-  "vis-2-widgets-basic-noStyle": "Brak stylu"
+  "vis-2-widgets-basic-noStyle": "Brak stylu",
+  "Clone": "Klon"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/pt.json b/packages/iobroker.vis-2/src/src/i18n/pt.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Não pergunte novamente",
   "vis-2-widgets-basic-input_value": "Valor de entrada",
   "vis-2-widgets-basic-autoSetDelay": "Atraso para gravação automática",
-  "vis-2-widgets-basic-noStyle": "Sem estilo"
+  "vis-2-widgets-basic-noStyle": "Sem estilo",
+  "Clone": "Clone"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/ru.json b/packages/iobroker.vis-2/src/src/i18n/ru.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Не спрашивай снова",
   "vis-2-widgets-basic-input_value": "Входное значение",
   "vis-2-widgets-basic-autoSetDelay": "Задержка для автозаписи",
-  "vis-2-widgets-basic-noStyle": "Нет стиля"
+  "vis-2-widgets-basic-noStyle": "Нет стиля",
+  "Clone": "Клонировать"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/uk.json b/packages/iobroker.vis-2/src/src/i18n/uk.json
@@ -744,5 +744,6 @@
   "Do not ask again": "Не запитуй знову",
   "vis-2-widgets-basic-input_value": "Вхідне значення",
   "vis-2-widgets-basic-autoSetDelay": "Затримка для автозапису",
-  "vis-2-widgets-basic-noStyle": "Ніякого стилю"
+  "vis-2-widgets-basic-noStyle": "Ніякого стилю",
+  "Clone": "Клон"
 }
diff --git a/packages/iobroker.vis-2/src/src/i18n/zh-cn.json b/packages/iobroker.vis-2/src/src/i18n/zh-cn.json
@@ -744,5 +744,6 @@
   "Do not ask again": "不要再问了",
   "vis-2-widgets-basic-input_value": "输入值",
   "vis-2-widgets-basic-autoSetDelay": "自动写入延迟",
-  "vis-2-widgets-basic-noStyle": "没有风格"
+  "vis-2-widgets-basic-noStyle": "没有风格",
+  "Clone": "克隆"
 }