add renewIDs method

x-pack/plugins/lens/public/indexpattern_datasource/indexpattern.tsx

@@ -66,6 +66,7 @@ import {
   getTSDBRollupWarningMessages,
   getVisualDefaultsForLayer,
   isColumnInvalid,
+  cloneLayer,
 } from './utils';
 import { normalizeOperationDataType, isDraggedField } from './pure_utils';
 import { LayerPanel } from './layerpanel';
@@ -190,15 +191,9 @@ export function getIndexPatternDatasource({
     },
 
     cloneLayer(state: IndexPatternPrivateState, layerId: string, newLayerId: string) {
-      // @todo: wip
       return {
         ...state,
-        layers: {
-          ...state.layers,
-          [newLayerId]: {
-            ...state.layers[layerId],
-          },
-        },
+        layers: cloneLayer(state.layers, layerId, newLayerId),
       };
     },
 

x-pack/plugins/lens/public/indexpattern_datasource/utils.test.tsx

@@ -8,14 +8,15 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 import { createDatatableUtilitiesMock } from '@kbn/data-plugin/common/mocks';
-import { getPrecisionErrorWarningMessages } from './utils';
+import { getPrecisionErrorWarningMessages, cloneLayer } from './utils';
 import type { IndexPatternPrivateState, GenericIndexPatternColumn } from './types';
 import type { FramePublicAPI } from '../types';
 import type { DocLinksStart } from '@kbn/core/public';
 import { EuiButton } from '@elastic/eui';
 import { TermsIndexPatternColumn } from './operations';
 import { mountWithIntl } from '@kbn/test-jest-helpers';
 import { FormattedMessage } from '@kbn/i18n-react';
+import { IndexPatternLayer } from './types';
 
 describe('indexpattern_datasource utils', () => {
   describe('getPrecisionErrorWarningMessages', () => {
@@ -196,4 +197,53 @@ describe('indexpattern_datasource utils', () => {
       });
     });
   });
+
+  describe('cloneLayer', () => {
+    test('should replace ids', () => {
+      expect(
+        cloneLayer(
+          {
+            a: {
+              columns: {
+                '899ee4b6-3147-4d45-94bf-ea9c02e55d28': {
+                  params: {
+                    orderBy: {
+                      type: 'column',
+                      columnId: 'ae62cfc8-faa5-4096-a30c-f92ac59922a0',
+                    },
+                    orderDirection: 'desc',
+                  },
+                },
+                'ae62cfc8-faa5-4096-a30c-f92ac59922a0': {
+                  params: {
+                    emptyAsNull: true,
+                    justForTest: [
+                      '899ee4b6-3147-4d45-94bf-ea9c02e55d28',
+                      'ae62cfc8-faa5-4096-a30c-f92ac59922a0',
+                    ],
+                    justForTest2: [
+                      {
+                        a: '899ee4b6-3147-4d45-94bf-ea9c02e55d28',
+                        ['899ee4b6-3147-4d45-94bf-ea9c02e55d28']: [
+                          { c: 'ae62cfc8-faa5-4096-a30c-f92ac59922a0' },
+                        ],
+                      },
+                    ],
+                  },
+                },
+              },
+              columnOrder: [
+                '899ee4b6-3147-4d45-94bf-ea9c02e55d28',
+                'ae62cfc8-faa5-4096-a30c-f92ac59922a0',
+              ],
+              incompleteColumns: {},
+              indexPatternId: 'ff959d40-b880-11e8-a6d9-e546fe2bba5f',
+            },
+          } as unknown as Record<string, IndexPatternLayer>,
+          'a',
+          'b'
+        )
+      ).toMatchSnapshot();
+    });
+  });
 });

x-pack/plugins/lens/public/indexpattern_datasource/utils.tsx

@@ -18,6 +18,7 @@ import { groupBy, escape, uniq } from 'lodash';
 import type { Query } from '@kbn/data-plugin/common';
 import { SearchResponseWarning } from '@kbn/data-plugin/public/search/types';
 import type { FramePublicAPI, IndexPattern, StateSetter } from '../types';
+import { renewIDs } from '../utils';
 import type {
   IndexPatternLayer,
   IndexPatternPersistedState,
@@ -622,3 +623,16 @@ export function getFiltersInLayer(
     },
   };
 }
+
+export const cloneLayer = (
+  layers: Record<string, IndexPatternLayer>,
+  layerId: string,
+  newLayerId: string
+): Record<string, IndexPatternLayer> => ({
+  ...layers,
+  [newLayerId]: renewIDs(
+    Object.keys(layers[layerId]?.columns ?? {}),
+    layers[layerId],
+    (k: string) => k + 'C'
+  ),
+});

x-pack/plugins/lens/public/utils.ts

@@ -4,9 +4,10 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import { uniq } from 'lodash';
+import { set, uniq, cloneDeep } from 'lodash';
 import { i18n } from '@kbn/i18n';
 import moment from 'moment-timezone';
+import type { Serializable } from '@kbn/utility-types';
 
 import type { TimefilterContract } from '@kbn/data-plugin/public';
 import type { IUiSettingsClient, SavedObjectReference } from '@kbn/core/public';
@@ -195,6 +196,46 @@ export function inferTimeField(
     .find(Boolean);
 }
 
+export function renewIDs<T = unknown>(
+  forRenewIds: string[],
+  obj: T,
+  getNewId: (id: string) => string
+): T {
+  obj = cloneDeep(obj);
+  const recursiveFn = (
+    item: Serializable,
+    parent?: Record<string, Serializable> | Serializable[],
+    key?: string | number
+  ) => {
+    if (typeof item === 'object') {
+      if (Array.isArray(item)) {
+        item.forEach((a, k, ref) => recursiveFn(a, ref, k));
+      } else {
+        if (item) {
+          Object.keys(item).forEach((k) => {
+            let newId = k;
+            if (forRenewIds.includes(k)) {
+              newId = getNewId(k);
+              item[newId] = item[k];
+              delete item[k];
+            }
+            recursiveFn(item[newId], item, newId);
+          });
+        }
+      }
+    } else if (
+      parent &&
+      key !== undefined &&
+      typeof item === 'string' &&
+      forRenewIds.includes(item)
+    ) {
+      set(parent, key, getNewId(item));
+    }
+  };
+  recursiveFn(obj as unknown as Serializable);
+  return obj;
+}
+
 /**
  * The dimension container is set up to close when it detects a click outside it.
  * Use this CSS class to exclude particular elements from this behavior.