Move MessageTable and MessageDetail component into components/common. (#25258)

* Move `MessageTable` component into common dir.

* Move `MessageTableEntry` to common dir.

* Move messagelist dir into message dir.

* Move `MessageDetail` component into components/common.

* Move components related to message details into message details dir.

* Move message details fields component into message details dir.

* Update imports.

* Move futher components into common dir.

* Cleanup exports.

* Fixing linter hints

* Remove `MessageTable` and `MessageList` from `common/index` for now, since it causes unrelated tests to fail.

* Cleanup

* Remove not needed file.

graylog2-web-interface/src/components/common/message/details/DefaultMessageFields.tsx

@@ -19,8 +19,9 @@ import * as React from 'react';
 import MessageField from 'views/components/messagelist/MessageField';
 import FieldType from 'views/logic/fieldtypes/FieldType';
 import FieldTypeMapping from 'views/logic/fieldtypes/FieldTypeMapping';
-import type { MessageFieldsComponentProps } from 'views/components/messagelist/MessageFields/types';
-import { MessageDetailsDL } from 'views/components/messagelist/MessageFields/MessageFieldsViewModeList';
+
+import type { MessageFieldsComponentProps } from './fields/types';
+import { MessageDetailsDL } from './fields/MessageFieldsViewModeList';
 
 export const DefaultMessageFields = ({ message, fields }: MessageFieldsComponentProps) => {
   const formattedFields = message.formatted_fields;

graylog2-web-interface/src/components/common/message/details/MessageActions.tsx

@@ -26,9 +26,10 @@ import usePluginEntities from 'hooks/usePluginEntities';
 import { TELEMETRY_EVENT_TYPE } from 'logic/telemetry/Constants';
 import useSendTelemetry from 'logic/telemetry/useSendTelemetry';
 import MessagePermalinkButton from 'views/components/common/MessagePermalinkButton';
-import MessageEditFieldConfigurationAction from 'views/components/messagelist/MessageFields/MessageEditFieldConfigurationAction';
 import useFeature from 'hooks/useFeature';
 
+import MessageEditFieldConfigurationAction from './fields/MessageEditFieldConfigurationAction';
+
 const TestAgainstStreamButton = ({
   streams,
   index,

graylog2-web-interface/src/components/common/message/details/MessageDetail.tsx

@@ -19,25 +19,28 @@ import { useState, useContext, useCallback } from 'react';
 import Immutable from 'immutable';
 import styled from 'styled-components';
 
-import { Link, Icon, Spinner, Timestamp } from 'components/common';
+import Link from 'components/common/Link';
+import Icon from 'components/common/Icon';
+import Spinner from 'components/common/Spinner';
+import Timestamp from 'components/common/Timestamp';
 import { Col, Label, Row } from 'components/bootstrap';
-import { MessageFields } from 'views/components/messagelist';
 import MessageDetailsTitle from 'components/search/MessageDetailsTitle';
 import Routes from 'routing/Routes';
 import type { Message } from 'views/components/messagelist/Types';
 import type { Input } from 'components/messageloaders/Types';
 import type { Stream } from 'views/stores/StreamsStore';
 import type { FieldTypeMappingsList } from 'views/logic/fieldtypes/types';
-import FormatReceivedBy from 'views/components/messagelist/FormatReceivedBy';
-import FormatAssetList from 'views/components/messagelist/FormatAssetList';
 import useIsLocalNode from 'views/hooks/useIsLocalNode';
 import FieldTypesContext from 'views/components/contexts/FieldTypesContext';
 import useSearchConfiguration from 'hooks/useSearchConfiguration';
-import MessageFavoriteFieldsProvider from 'views/components/contexts/MessageFavoriteFieldsProvider';
-import MessageDetailAdditionalContextProvider from 'views/components/contexts/MessageDetailAdditionalContextProvider';
 import useFeature from 'hooks/useFeature';
-import DefaultMessageFields from 'views/components/messagelist/MessageFields/DefaultMessageFields';
 
+import MessageFavoriteFieldsProvider from './context/MessageFavoriteFieldsProvider';
+import MessageDetailAdditionalContextProvider from './context/MessageDetailAdditionalContextProvider';
+import MessageFields from './fields/MessageFields';
+import DefaultMessageFields from './DefaultMessageFields';
+import FormatReceivedBy from './FormatReceivedBy';
+import FormatAssetList from './FormatAssetList';
 import MessageDetailProviders from './MessageDetailProviders';
 import MessageActions from './MessageActions';
 import MessageAugmentations from './MessageAugmentations';

graylog2-web-interface/src/components/common/message/details/MessageDetailProviders.tsx

@@ -18,8 +18,7 @@ import * as React from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 
 import usePluginEntities from 'hooks/usePluginEntities';
-
-import type { Message } from './Types';
+import type { Message } from 'views/components/messagelist/Types';
 
 type Props = {
   children: React.ReactElement;

graylog2-web-interface/src/components/common/message/details/context/MessageFavoriteFieldsProvider.test.tsx

@@ -21,9 +21,7 @@ import userEvent from '@testing-library/user-event';
 import Immutable from 'immutable';
 
 import { asMock, StoreMock as MockStore } from 'helpers/mocking';
-import MessageFavoriteFieldsProvider from 'views/components/contexts/MessageFavoriteFieldsProvider';
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
-import useMessageFavoriteFieldsMutation from 'views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsMutation';
 import { Button } from 'components/bootstrap';
 import FieldTypeMapping from 'views/logic/fieldtypes/FieldTypeMapping';
 import { FieldTypes } from 'views/logic/fieldtypes/FieldType';
@@ -31,15 +29,16 @@ import { StreamsActions } from 'views/stores/StreamsStore';
 import mockAction from 'helpers/mocking/MockAction';
 import type { Stream } from 'logic/streams/types';
 
+import MessageFavoriteFieldsProvider from './MessageFavoriteFieldsProvider';
+
+import useMessageFavoriteFieldsMutation from '../fields/hooks/useMessageFavoriteFieldsMutation';
+
 const mockSaveFields = jest.fn();
 const mockToggleField = jest.fn();
 
 jest.mock('views/stores/StreamsStore');
 
-jest.mock('views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsMutation', () => ({
-  __esModule: true,
-  default: jest.fn(),
-}));
+jest.mock('../fields/hooks/useMessageFavoriteFieldsMutation');
 
 jest.mock('views/stores/StreamsStore', () => ({
   StreamsActions: { refresh: jest.fn() },

graylog2-web-interface/src/components/common/message/details/context/MessageFavoriteFieldsProvider.tsx

@@ -23,14 +23,15 @@ import flattenDeep from 'lodash/flattenDeep';
 import type { Message } from 'views/components/messagelist/Types';
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
 import type { FieldTypeMappingsList } from 'views/logic/fieldtypes/types';
-import useMessageFavoriteFieldsMutation from 'views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsMutation';
 import { useStore } from 'stores/connect';
 import { StreamsStore } from 'views/stores/StreamsStore';
 import type { Stream } from 'logic/streams/types';
-import { DEFAULT_FIELDS } from 'views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsForEditing';
 import { isPermitted } from 'util/PermissionsMixin';
 import useCurrentUser from 'hooks/useCurrentUser';
 
+import { DEFAULT_FIELDS } from '../fields/hooks/useMessageFavoriteFieldsForEditing';
+import useMessageFavoriteFieldsMutation from '../fields/hooks/useMessageFavoriteFieldsMutation';
+
 type OriginalProps = React.PropsWithChildren<{
   message: Message;
   messageFields: FieldTypeMappingsList;

graylog2-web-interface/src/components/common/message/details/fields/MessageEditFieldConfigurationAction.tsx

@@ -18,8 +18,9 @@
 import React, { useState, useCallback } from 'react';
 
 import { Button } from 'components/bootstrap';
-import MessageFieldsEditModal from 'views/components/messagelist/MessageFields/MessageFieldsEditModal';
-import useSendFavoriteFieldTelemetry from 'views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry';
+
+import MessageFieldsEditModal from './MessageFieldsEditModal';
+import useSendFavoriteFieldTelemetry from './hooks/useSendFavoriteFieldTelemetry';
 
 const MessageEditFieldConfigurationAction = () => {
   const [showModal, setShowModal] = useState(false);

graylog2-web-interface/src/components/common/message/details/fields/MessageFields.tsx

@@ -18,13 +18,14 @@
 import React, { useContext, useState, useCallback } from 'react';
 import styled, { css } from 'styled-components';
 
-import MessageFieldsViewModeList from 'views/components/messagelist/MessageFields/MessageFieldsViewModeList';
-import useFormattedFields from 'views/components/messagelist/MessageFields/hooks/useFormattedFields';
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
 import { Icon } from 'components/common';
 import Store from 'logic/local-storage/Store';
 import StringUtils from 'util/StringUtils';
-import useSendFavoriteFieldTelemetry from 'views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry';
+
+import useFormattedFields from './hooks/useFormattedFields';
+import MessageFieldsViewModeList from './MessageFieldsViewModeList';
+import useSendFavoriteFieldTelemetry from './hooks/useSendFavoriteFieldTelemetry';
 
 const Line = styled.div(
   ({ theme }) => css`

graylog2-web-interface/src/components/common/message/details/fields/MessageFieldsEditModal.test.tsx

@@ -28,9 +28,9 @@ import Search from 'views/logic/search/Search';
 import View from 'views/logic/views/View';
 import useViewsPlugin from 'views/test/testViewsPlugin';
 import suppressConsole from 'helpers/suppressConsole';
-import useFormattedFields from 'views/components/messagelist/MessageFields/hooks/useFormattedFields';
-import useMessageFavoriteFieldsForEditing from 'views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsForEditing';
 
+import useFormattedFields from './hooks/useFormattedFields';
+import useMessageFavoriteFieldsForEditing from './hooks/useMessageFavoriteFieldsForEditing';
 import MessageFieldsEditModal from './MessageFieldsEditModal';
 
 const reorderFavoriteFields = jest.fn();
@@ -44,9 +44,9 @@ jest.mock('views/stores/StreamsStore', () => ({
   StreamsStore: MockStore(['getInitialState', () => ({ streams: [{ id: 'streamId', title: 'Stream' }] })]),
 }));
 
-jest.mock('views/components/messagelist/MessageFields/hooks/useFormattedFields');
-jest.mock('views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsForEditing');
-jest.mock('views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry', () => jest.fn);
+jest.mock('./hooks/useFormattedFields');
+jest.mock('./hooks/useMessageFavoriteFieldsForEditing');
+jest.mock('./hooks/useSendFavoriteFieldTelemetry', () => jest.fn);
 
 const formattedFavorites = [
   {

graylog2-web-interface/src/components/common/message/details/fields/MessageFieldsEditModal.tsx

@@ -24,12 +24,11 @@ import { useStore } from 'stores/connect';
 import { StreamsStore } from 'views/stores/StreamsStore';
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
 import StringUtils from 'util/StringUtils';
-import useMessageFavoriteFieldsForEditing, {
-  DEFAULT_FIELDS,
-} from 'views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsForEditing';
 import { ModalSubmit } from 'components/common';
-import MessageFieldsEditModeLists from 'views/components/messagelist/MessageFields/MessageFieldsEditModeLists';
-import useSendFavoriteFieldTelemetry from 'views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry';
+
+import useMessageFavoriteFieldsForEditing, { DEFAULT_FIELDS } from './hooks/useMessageFavoriteFieldsForEditing';
+import MessageFieldsEditModeLists from './MessageFieldsEditModeLists';
+import useSendFavoriteFieldTelemetry from './hooks/useSendFavoriteFieldTelemetry';
 
 const FieldsContainer = styled.div(
   ({ theme }) => css`

graylog2-web-interface/src/components/common/message/details/fields/MessageFieldsEditModeLists.tsx

@@ -18,10 +18,11 @@
 import React, { useCallback } from 'react';
 import styled, { css } from 'styled-components';
 
-import MessageFieldEditModeListItem from 'views/components/messagelist/MessageFields/MessageFieldEditModeListItem';
-import type { MessageFieldsListProps, FormattedField } from 'views/components/messagelist/MessageFields/types';
 import { SortableList } from 'components/common';
-import useFormattedFields from 'views/components/messagelist/MessageFields/hooks/useFormattedFields';
+
+import MessageFieldEditModeListItem from './MessageFieldEditModeListItem';
+import type { MessageFieldsListProps, FormattedField } from './types';
+import useFormattedFields from './hooks/useFormattedFields';
 
 const Container = styled.div(
   ({ theme }) => css`

graylog2-web-interface/src/components/common/message/details/fields/MessageFieldsViewModeList.tsx

@@ -18,11 +18,12 @@
 import React, { useContext } from 'react';
 import styled, { css } from 'styled-components';
 
-import type { MessageFieldsListProps } from 'views/components/messagelist/MessageFields/types';
 import MessageField from 'views/components/messagelist/MessageField';
 import { MessageDetailsDefinitionList } from 'components/common';
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
 
+import type { MessageFieldsListProps } from './types';
+
 export const MessageDetailsDL = styled(MessageDetailsDefinitionList)(
   ({ theme }) => css`
     color: ${theme.colors.text.primary};

graylog2-web-interface/src/components/common/message/details/fields/hooks/useMessageFavoriteFieldsForEditing.test.tsx

@@ -18,14 +18,17 @@ import React from 'react';
 import { renderHook, act } from 'wrappedTestingLibrary';
 import Immutable from 'immutable';
 
-import useMessageFavoriteFieldsForEditing from 'views/components/messagelist/MessageFields/hooks/useMessageFavoriteFieldsForEditing';
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
-import type { FormattedField } from 'views/components/messagelist/MessageFields/types';
 import FieldType from 'views/logic/fieldtypes/FieldType';
 
+import useMessageFavoriteFieldsForEditing from './useMessageFavoriteFieldsForEditing';
+
+import type { FormattedField } from '../types';
+
+
 const DEFAULT_FIELDS = ['source', 'destination_ip', 'usernames'];
 
-jest.mock('views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry', () => jest.fn);
+jest.mock('./useSendFavoriteFieldTelemetry', () => jest.fn);
 
 type ProviderProps = {
   initialFavorites?: Array<string>;

graylog2-web-interface/src/components/common/message/details/fields/hooks/useMessageFavoriteFieldsForEditing.ts

@@ -18,8 +18,10 @@ import { useState, useCallback, useContext } from 'react';
 import uniq from 'lodash/uniq';
 
 import MessageFavoriteFieldsContext from 'views/components/contexts/MessageFavoriteFieldsContext';
-import type { FormattedField } from 'views/components/messagelist/MessageFields/types';
-import useSendFavoriteFieldTelemetry from 'views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry';
+
+import useSendFavoriteFieldTelemetry from './useSendFavoriteFieldTelemetry';
+
+import type { FormattedField } from '../types';
 
 export const DEFAULT_FIELDS = ['source', 'destination_ip', 'usernames'];
 

graylog2-web-interface/src/components/common/message/details/fields/hooks/useMessageFavoriteFieldsMutation.test.tsx

@@ -48,7 +48,7 @@ jest.mock('util/UserNotification', () => ({
   error: jest.fn(),
 }));
 
-jest.mock('views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry', () => jest.fn);
+jest.mock('./useSendFavoriteFieldTelemetry', () => jest.fn);
 
 jest.mock('hooks/useCurrentUser');
 

graylog2-web-interface/src/components/common/message/details/fields/hooks/useMessageFavoriteFieldsMutation.ts

@@ -22,7 +22,8 @@ import { FavoriteFields } from '@graylog/server-api';
 import { StreamsActions } from 'views/stores/StreamsStore';
 import UserNotification from 'util/UserNotification';
 import type { Stream } from 'logic/streams/types';
-import useSendFavoriteFieldTelemetry from 'views/components/messagelist/MessageFields/hooks/useSendFavoriteFieldTelemetry';
+
+import useSendFavoriteFieldTelemetry from './useSendFavoriteFieldTelemetry';
 
 interface FavoriteFieldRequest {
   readonly field: string;

graylog2-web-interface/src/components/common/message/details/index.ts

@@ -0,0 +1,21 @@
+/*
+ * Copyright (C) 2020 Graylog, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the Server Side Public License, version 1,
+ * as published by MongoDB, Inc.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * Server Side Public License for more details.
+ *
+ * You should have received a copy of the Server Side Public License
+ * along with this program. If not, see
+ * <http://www.mongodb.com/licensing/server-side-public-license>.
+ */
+export { default as MessageDetail } from './MessageDetail';
+export { default as MessageFavoriteFieldsProvider } from './context/MessageFavoriteFieldsProvider';
+export { default as MessageFieldsEditModal } from './fields/MessageFieldsEditModal';
+export { default as useFormattedFields } from './fields/hooks/useFormattedFields';
+export { default as useSendFavoriteFieldTelemetry } from './fields/hooks/useSendFavoriteFieldTelemetry';

graylog2-web-interface/src/components/common/message/messagetable/FieldSortIcon.tsx

@@ -20,7 +20,7 @@ import type MessagesWidgetConfig from 'views/logic/widgets/MessagesWidgetConfig'
 import { defaultSortDirection } from 'views/logic/widgets/MessagesWidgetConfig';
 import Direction from 'views/logic/aggregationbuilder/Direction';
 import SortConfig from 'views/logic/aggregationbuilder/SortConfig';
-import { SortIcon } from 'components/common';
+import SortIcon from 'components/common/SortIcon';
 
 type Props = {
   config: MessagesWidgetConfig;

graylog2-web-interface/src/components/common/message/messagetable/MessageFieldRow.tsx

@@ -20,11 +20,9 @@ import styled from 'styled-components';
 import type { Message } from 'views/components/messagelist/Types';
 import { MESSAGE_FIELD } from 'views/Constants';
 import type FieldType from 'views/logic/fieldtypes/FieldType';
-
-import DecoratedValue from './decoration/DecoratedValue';
-
-import CustomHighlighting from '../highlighting/CustomHighlighting';
-import TypeSpecificValue from '../TypeSpecificValue';
+import DecoratedValue from 'views/components/messagelist/decoration/DecoratedValue';
+import CustomHighlighting from 'views/components/highlighting/CustomHighlighting';
+import TypeSpecificValue from 'views/components/TypeSpecificValue';
 
 export const MessageWrapper = styled.div`
   white-space: pre-line;

graylog2-web-interface/src/components/common/message/messagetable/MessagePreview.tsx

@@ -21,7 +21,8 @@ import type MessagesWidgetConfig from 'views/logic/widgets/MessagesWidgetConfig'
 import type FieldType from 'views/logic/fieldtypes/FieldType';
 import type { Message } from 'views/components/messagelist/Types';
 import usePluginEntities from 'hooks/usePluginEntities';
-import MessageFieldRow from 'views/components/messagelist/MessageFieldRow';
+
+import MessageFieldRow from './MessageFieldRow';
 
 const TableRow = styled.tr(
   ({ theme }) => css`

graylog2-web-interface/src/components/common/message/messagetable/MessageTable.tsx

@@ -24,15 +24,16 @@ import FieldType from 'views/logic/fieldtypes/FieldType';
 import type FieldTypeMapping from 'views/logic/fieldtypes/FieldTypeMapping';
 import type MessagesWidgetConfig from 'views/logic/widgets/MessagesWidgetConfig';
 import type SortConfig from 'views/logic/aggregationbuilder/SortConfig';
-import { MessageTableEntry } from 'views/components/messagelist';
 import type { BackendMessage, Message } from 'views/components/messagelist/Types';
-import FieldSortIcon from 'views/components/widgets/FieldSortIcon';
 import Field from 'views/components/Field';
-import MessageTableProviders from 'views/components/messagelist/MessageTableProviders';
 import useAutoRefresh from 'views/hooks/useAutoRefresh';
 import { TableHeaderCell, TableHead } from 'views/components/datatable';
 import InteractiveContext from 'views/components/contexts/InteractiveContext';
 
+import FieldSortIcon from './FieldSortIcon';
+import MessageTableEntry from './MessageTableEntry';
+import MessageTableProviders from './MessageTableProviders';
+
 const Table = styled.table(
   ({ theme }) => css`
     position: relative;

graylog2-web-interface/src/components/common/message/messagetable/MessageTableEntry.tsx

@@ -32,15 +32,14 @@ import { InputsStore } from 'stores/inputs/InputsStore';
 import useSendTelemetry from 'logic/telemetry/useSendTelemetry';
 import { TELEMETRY_EVENT_TYPE } from 'logic/telemetry/Constants';
 import { TableDataCell } from 'views/components/datatable';
+import MessageDetail from 'components/common/message/details/MessageDetail';
+import DecoratedValue from 'views/components/messagelist/decoration/DecoratedValue';
+import type { Message } from 'views/components/messagelist/Types';
+import CustomHighlighting from 'views/components/highlighting/CustomHighlighting';
+import TypeSpecificValue from 'views/components/TypeSpecificValue';
+import HighlightMessageContext from 'views/components/contexts/HighlightMessageContext';
 
-import MessageDetail from './MessageDetail';
-import DecoratedValue from './decoration/DecoratedValue';
 import MessagePreview from './MessagePreview';
-import type { Message } from './Types';
-
-import CustomHighlighting from '../highlighting/CustomHighlighting';
-import TypeSpecificValue from '../TypeSpecificValue';
-import HighlightMessageContext from '../contexts/HighlightMessageContext';
 
 export const TableBody = styled.tbody<{ $expanded?: boolean; $highlighted?: boolean }>(
   ({ $expanded, $highlighted, theme }) => `

graylog2-web-interface/src/components/common/message/messagetable/index.ts

@@ -14,7 +14,4 @@
  * along with this program. If not, see
  * <http://www.mongodb.com/licensing/server-side-public-license>.
  */
-export { default as MessageDetail } from './MessageDetail';
-export { default as MessageField } from './MessageField';
-export { default as MessageFields } from './MessageFields/MessageFields';
-export { default as MessageTableEntry } from './MessageTableEntry';
+export { default as MessageTable } from './MessageTable';

graylog2-web-interface/src/pages/ShowMessagePage.test.tsx

@@ -33,7 +33,9 @@ import { usePlugin } from 'views/test/testPlugins';
 import ShowMessagePage from './ShowMessagePage';
 import { message, event, input } from './ShowMessagePage.fixtures';
 
-jest.mock('views/components/messagelist/MessageDetail', () => (props) => <span>{JSON.stringify(props, null, 2)}</span>);
+jest.mock('components/common/message/details/MessageDetail', () => (props) => (
+  <span>{JSON.stringify(props, null, 2)}</span>
+));
 
 const mockGetInput = jest.fn();
 const mockListNodes = jest.fn();

graylog2-web-interface/src/pages/ShowMessagePage.tsx

@@ -19,11 +19,11 @@ import * as Immutable from 'immutable';
 import styled from 'styled-components';
 
 import useMessage from 'views/hooks/useMessage';
+import MessageDetail from 'components/common/message/details/MessageDetail';
 import DocumentTitle from 'components/common/DocumentTitle';
 import Spinner from 'components/common/Spinner';
 import { Col, Row } from 'components/bootstrap';
 import InteractiveContext from 'views/components/contexts/InteractiveContext';
-import MessageDetail from 'views/components/messagelist/MessageDetail';
 import withParams from 'routing/withParams';
 import type { Input } from 'components/messageloaders/Types';
 import WindowDimensionsContextProvider from 'contexts/WindowDimensionsContextProvider';

graylog2-web-interface/src/views/components/widgets/MessageList.tsx

@@ -23,7 +23,7 @@ import { Messages } from 'views/Constants';
 import type MessagesWidgetConfig from 'views/logic/widgets/MessagesWidgetConfig';
 import type { SearchTypeOptions } from 'views/logic/search/GlobalOverride';
 import { PaginatedList } from 'components/common';
-import MessageTable from 'views/components/widgets/MessageTable';
+import MessageTable from 'components/common/message/messagetable/MessageTable';
 import ErrorWidget from 'views/components/widgets/ErrorWidget';
 import type SortConfig from 'views/logic/aggregationbuilder/SortConfig';
 import type { BackendMessage } from 'views/components/messagelist/Types';

graylog2-web-interface/src/views/components/widgets/MessageTable.test.tsx

@@ -24,8 +24,7 @@ import MockAction from 'helpers/mocking/MockAction';
 import FieldTypeMapping from 'views/logic/fieldtypes/FieldTypeMapping';
 import FieldType from 'views/logic/fieldtypes/FieldType';
 import MessagesWidgetConfig from 'views/logic/widgets/MessagesWidgetConfig';
-
-import MessageTable from './MessageTable';
+import MessageTable from 'components/common/message/messagetable/MessageTable';
 
 import InteractiveContext from '../contexts/InteractiveContext';
 import HighlightMessageContext from '../contexts/HighlightMessageContext';