Adds shared context and simplifies app structure

src/plugins/data_explorer/public/components/app_container.tsx

@@ -18,19 +18,21 @@ export const AppContainer = ({ view, params }: { view?: View; params: AppMountPa
     return <NoView />;
   }
 
-  const { Canvas, Panel } = view;
+  const { Canvas, Panel, Context } = view;
 
   // Render the application DOM.
   return (
     <EuiPage className="dePage eui-fullHeight" paddingSize="none">
       {/* TODO: improve loading state */}
       <Suspense fallback={<div>Loading...</div>}>
-        <Sidebar>
-          <Panel {...params} />
-        </Sidebar>
-        <EuiPageBody className="eui-fullHeight">
-          <Canvas {...params} />
-        </EuiPageBody>
+        <Context {...params}>
+          <Sidebar>
+            <Panel {...params} />
+          </Sidebar>
+          <EuiPageBody className="eui-fullHeight">
+            <Canvas {...params} />
+          </EuiPageBody>
+        </Context>
       </Suspense>
     </EuiPage>
   );

src/plugins/data_explorer/public/services/view_service/types.ts

@@ -23,6 +23,9 @@ export interface ViewDefinition<T = any> {
   };
   readonly Canvas: LazyExoticComponent<(props: ViewProps) => React.ReactElement>;
   readonly Panel: LazyExoticComponent<(props: ViewProps) => React.ReactElement>;
+  readonly Context: LazyExoticComponent<
+    (props: React.PropsWithChildren<ViewProps>) => React.ReactElement
+  >;
   readonly defaultPath: string;
   readonly appExtentions: {
     savedObject: {

src/plugins/data_explorer/public/services/view_service/view.ts

@@ -15,6 +15,7 @@ export class View implements IView {
   readonly shouldShow?: (state: any) => boolean;
   readonly Canvas: IView['Canvas'];
   readonly Panel: IView['Panel'];
+  readonly Context: IView['Context'];
 
   constructor(options: ViewDefinition) {
     this.id = options.id;
@@ -25,5 +26,6 @@ export class View implements IView {
     this.shouldShow = options.shouldShow;
     this.Canvas = options.Canvas;
     this.Panel = options.Panel;
+    this.Context = options.Context;
   }
 }

src/plugins/data_explorer/public/utils/state_management/store.ts

@@ -14,6 +14,7 @@ const commonReducers = {
 };
 
 let dynamicReducers: {
+  metadata: typeof metadataReducer;
   [key: string]: Reducer;
 } = {
   ...commonReducers,

src/plugins/discover/public/application/utils/columns.test.ts

@@ -0,0 +1,24 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { buildColumns } from './columns';
+
+describe('buildColumns', () => {
+  it('returns ["_source"] if columns is empty', () => {
+    expect(buildColumns([])).toEqual(['_source']);
+  });
+
+  it('returns columns if there is only one column', () => {
+    expect(buildColumns(['foo'])).toEqual(['foo']);
+  });
+
+  it('removes "_source" if there are more than one columns', () => {
+    expect(buildColumns(['foo', '_source', 'bar'])).toEqual(['foo', 'bar']);
+  });
+
+  it('returns columns if there are more than one columns but no "_source"', () => {
+    expect(buildColumns(['foo', 'bar'])).toEqual(['foo', 'bar']);
+  });
+});

src/plugins/discover/public/application/utils/columns.ts

@@ -0,0 +1,43 @@
+/*
+ * SPDX-License-Identifier: Apache-2.0
+ *
+ * The OpenSearch Contributors require contributions made to
+ * this file be licensed under the Apache-2.0 license or a
+ * compatible open source license.
+ *
+ * Any modifications Copyright OpenSearch Contributors. See
+ * GitHub history for details.
+ */
+
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+/**
+ * Helper function to provide a fallback to a single _source column if the given array of columns
+ * is empty, and removes _source if there are more than 1 columns given
+ * @param columns
+ */
+export function buildColumns(columns: string[]) {
+  if (columns.length > 1 && columns.indexOf('_source') !== -1) {
+    return columns.filter((col) => col !== '_source');
+  } else if (columns.length !== 0) {
+    return columns;
+  }
+  return ['_source'];
+}

src/plugins/discover/public/application/utils/state_management/discover_slice.test.tsx

@@ -0,0 +1,67 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { discoverSlice, DiscoverState } from './discover_slice';
+
+describe('discoverSlice', () => {
+  let initialState: DiscoverState;
+
+  beforeEach(() => {
+    initialState = {
+      columns: [],
+      sort: [],
+    };
+  });
+
+  it('should handle setState', () => {
+    const newState = {
+      columns: ['column1', 'column2'],
+      sort: [['field1', 'asc']],
+    };
+    const action = { type: 'discover/setState', payload: newState };
+    const result = discoverSlice.reducer(initialState, action);
+    expect(result).toEqual(newState);
+  });
+
+  it('should handle addColumn', () => {
+    const action1 = { type: 'discover/addColumn', payload: { column: 'column1' } };
+    const result1 = discoverSlice.reducer(initialState, action1);
+    expect(result1.columns).toEqual(['column1']);
+
+    const action2 = { type: 'discover/addColumn', payload: { column: 'column2', index: 0 } };
+    const result2 = discoverSlice.reducer(result1, action2);
+    expect(result2.columns).toEqual(['column2', 'column1']);
+  });
+
+  it('should handle removeColumn', () => {
+    initialState = {
+      columns: ['column1', 'column2'],
+      sort: [],
+    };
+    const action = { type: 'discover/removeColumn', payload: 'column1' };
+    const result = discoverSlice.reducer(initialState, action);
+    expect(result.columns).toEqual(['column2']);
+  });
+
+  it('should handle reorderColumn', () => {
+    initialState = {
+      columns: ['column1', 'column2', 'column3'],
+      sort: [],
+    };
+    const action = { type: 'discover/reorderColumn', payload: { source: 0, destination: 2 } };
+    const result = discoverSlice.reducer(initialState, action);
+    expect(result.columns).toEqual(['column2', 'column3', 'column1']);
+  });
+
+  it('should handle updateState', () => {
+    initialState = {
+      columns: ['column1', 'column2'],
+      sort: [['field1', 'asc']],
+    };
+    const action = { type: 'discover/updateState', payload: { sort: [['field2', 'desc']] } };
+    const result = discoverSlice.reducer(initialState, action);
+    expect(result.sort).toEqual([['field2', 'desc']]);
+  });
+});

src/plugins/discover/public/application/utils/state_management/discover_slice.tsx

@@ -7,6 +7,7 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import { Filter, Query } from '../../../../../data/public';
 import { DiscoverServices } from '../../../build_services';
 import { RootState } from '../../../../../data_explorer/public';
+import { buildColumns } from '../columns';
 
 export interface DiscoverState {
   /**
@@ -57,54 +58,35 @@ export const discoverSlice = createSlice({
     setState(state, action: PayloadAction<DiscoverState>) {
       return action.payload;
     },
-    addColumn(
-      state,
-      action: PayloadAction<{
-        column: string;
-        index?: number;
-      }>
-    ) {
+    addColumn(state, action: PayloadAction<{ column: string; index?: number }>) {
       const { column, index } = action.payload;
       const columns = [...(state.columns || [])];
-      if (index !== undefined) {
-        columns.splice(index, 0, column);
-      } else {
-        columns.push(column);
-      }
-      state = {
-        ...state,
-        columns,
-      };
-
-      return state;
+      if (index !== undefined) columns.splice(index, 0, column);
+      else columns.push(column);
+      return { ...state, columns: buildColumns(columns) };
     },
     removeColumn(state, action: PayloadAction<string>) {
-      state = {
+      const columns = (state.columns || []).filter((column) => column !== action.payload);
+      return {
         ...state,
-        columns: (state.columns || []).filter((column) => column !== action.payload),
+        columns: buildColumns(columns),
       };
-
-      return state;
     },
     reorderColumn(state, action: PayloadAction<{ source: number; destination: number }>) {
       const { source, destination } = action.payload;
       const columns = [...(state.columns || [])];
       const [removed] = columns.splice(source, 1);
       columns.splice(destination, 0, removed);
-      state = {
+      return {
         ...state,
         columns,
       };
-
-      return state;
     },
     updateState(state, action: PayloadAction<Partial<DiscoverState>>) {
-      state = {
+      return {
         ...state,
         ...action.payload,
       };
-
-      return state;
     },
   },
 });