[7.x] [ML] Moving file data vizualizer to its own plugin (#96408)

docs/developer/plugin-list.asciidoc

@@ -392,6 +392,10 @@ actitivies.
 |The features plugin enhance Kibana with a per-feature privilege system.
 
 
+|{kib-repo}blob/{branch}/x-pack/plugins/file_data_visualizer[fileDataVisualizer]
+|WARNING: Missing README.
+
+
 |{kib-repo}blob/{branch}/x-pack/plugins/file_upload[fileUpload]
 |WARNING: Missing README.
 

packages/kbn-optimizer/limits.yml

@@ -106,6 +106,7 @@ pageLoadAssetSize:
   indexPatternFieldEditor: 90489
   osquery: 107090
   fileUpload: 25664
+  fileDataVisualizer: 27530
   banners: 17946
   mapsEms: 26072
   timelines: 28613

x-pack/.i18nrc.json

@@ -20,6 +20,7 @@
     "xpack.endpoint": "plugins/endpoint",
     "xpack.enterpriseSearch": "plugins/enterprise_search",
     "xpack.features": "plugins/features",
+    "xpack.fileDataVisualizer": "plugins/file_data_visualizer",
     "xpack.fileUpload": "plugins/file_upload",
     "xpack.globalSearch": ["plugins/global_search"],
     "xpack.globalSearchBar": ["plugins/global_search_bar"],

x-pack/plugins/file_data_visualizer/common/constants.ts

@@ -0,0 +1,31 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+export const UI_SETTING_MAX_FILE_SIZE = 'fileUpload:maxFileSize';
+
+export const MB = Math.pow(2, 20);
+export const MAX_FILE_SIZE = '100MB';
+export const MAX_FILE_SIZE_BYTES = 104857600; // 100MB
+
+export const ABSOLUTE_MAX_FILE_SIZE_BYTES = 1073741274; // 1GB
+export const FILE_SIZE_DISPLAY_FORMAT = '0,0.[0] b';
+
+// Value to use in the Elasticsearch index mapping meta data to identify the
+// index as having been created by the File Data Visualizer.
+export const INDEX_META_DATA_CREATED_BY = 'file-data-visualizer';
+
+export const JOB_FIELD_TYPES = {
+  BOOLEAN: 'boolean',
+  DATE: 'date',
+  GEO_POINT: 'geo_point',
+  GEO_SHAPE: 'geo_shape',
+  IP: 'ip',
+  KEYWORD: 'keyword',
+  NUMBER: 'number',
+  TEXT: 'text',
+  UNKNOWN: 'unknown',
+} as const;

x-pack/plugins/ml/public/application/datavisualizer/file_based/components/utils/index.ts → x-pack/plugins/file_data_visualizer/common/index.ts

@@ -5,4 +5,5 @@
  * 2.0.
  */
 
-export { createUrlOverrides, processResults, readFile, DEFAULT_LINES_TO_SAMPLE } from './utils';
+export * from './constants';
+export * from './types';

x-pack/plugins/file_data_visualizer/common/types.ts

@@ -0,0 +1,22 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { JOB_FIELD_TYPES } from './constants';
+
+export type InputData = any[];
+
+export type JobFieldType = typeof JOB_FIELD_TYPES[keyof typeof JOB_FIELD_TYPES];
+
+export interface DataVisualizerTableState {
+  pageSize: number;
+  pageIndex: number;
+  sortField: string;
+  sortDirection: string;
+  visibleFieldTypes: string[];
+  visibleFieldNames: string[];
+  showDistributions: boolean;
+}

x-pack/plugins/file_data_visualizer/jest.config.js

@@ -0,0 +1,12 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+module.exports = {
+  preset: '@kbn/test',
+  rootDir: '../../..',
+  roots: ['<rootDir>/x-pack/plugins/file_data_visualizer'],
+};

x-pack/plugins/file_data_visualizer/kibana.json

@@ -0,0 +1,27 @@
+{
+  "id": "fileDataVisualizer",
+  "version": "8.0.0",
+  "kibanaVersion": "kibana",
+  "server": true,
+  "ui": true,
+  "requiredPlugins": [
+    "data",
+    "usageCollection",
+    "embeddable",
+    "share",
+    "discover",
+    "fileUpload"
+  ],
+  "optionalPlugins": [
+    "security",
+    "maps"
+  ],
+  "requiredBundles": [
+    "kibanaReact",
+    "maps",
+    "esUiShared"
+  ],
+  "extraPublicDirs": [
+    "common"
+  ]
+}

x-pack/plugins/file_data_visualizer/public/api/index.ts

@@ -0,0 +1,14 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { lazyLoadModules } from '../lazy_load_bundle';
+import { FileDataVisualizer } from '../application';
+
+export async function getFileDataVisualizerComponent(): Promise<typeof FileDataVisualizer> {
+  const modules = await lazyLoadModules();
+  return modules.FileDataVisualizer;
+}

x-pack/plugins/ml/public/application/datavisualizer/file_based/components/about_panel/about_panel.tsx → x-pack/plugins/file_data_visualizer/public/application/components/about_panel/about_panel.tsx

@@ -43,7 +43,7 @@ export const AboutPanel: FC<Props> = ({ onFilePickerChange }) => {
                 <EuiFilePicker
                   id="filePicker"
                   initialPromptText={i18n.translate(
-                    'xpack.ml.fileDatavisualizer.aboutPanel.selectOrDragAndDropFileDescription',
+                    'xpack.fileDataVisualizer.aboutPanel.selectOrDragAndDropFileDescription',
                     {
                       defaultMessage: 'Select or drag and drop a file',
                     }
@@ -70,7 +70,7 @@ export const LoadingPanel: FC = () => {
             <EuiTitle size="s">
               <h1 role="alert">
                 <FormattedMessage
-                  id="xpack.ml.fileDatavisualizer.aboutPanel.analyzingDataTitle"
+                  id="xpack.fileDataVisualizer.aboutPanel.analyzingDataTitle"
                   defaultMessage="Analyzing data"
                 />
               </h1>

x-pack/plugins/ml/public/application/datavisualizer/file_based/components/about_panel/welcome_content.tsx → x-pack/plugins/file_data_visualizer/public/application/components/about_panel/welcome_content.tsx

@@ -21,26 +21,22 @@ import {
 
 import { ExperimentalBadge } from '../experimental_badge';
 
-import { useMlKibana } from '../../../../contexts/kibana';
+import { useFileDataVisualizerKibana } from '../../kibana_context';
 
 export const WelcomeContent: FC = () => {
   const toolTipContent = i18n.translate(
-    'xpack.ml.fileDatavisualizer.welcomeContent.experimentalFeatureTooltip',
+    'xpack.fileDataVisualizer.welcomeContent.experimentalFeatureTooltip',
     {
       defaultMessage: "Experimental feature. We'd love to hear your feedback.",
     }
   );
 
   const {
-    services: { fileUpload },
-  } = useMlKibana();
-
-  if (fileUpload === undefined) {
-    // eslint-disable-next-line no-console
-    console.error('File upload plugin not available');
-    return null;
-  }
-  const maxFileSize = fileUpload.getMaxBytesFormatted();
+    services: {
+      fileUpload: { getMaxBytesFormatted },
+    },
+  } = useFileDataVisualizerKibana();
+  const maxFileSize = getMaxBytesFormatted();
 
   return (
     <EuiFlexGroup gutterSize="xl" alignItems="center">
@@ -51,7 +47,7 @@ export const WelcomeContent: FC = () => {
         <EuiTitle size="m">
           <h1>
             <FormattedMessage
-              id="xpack.ml.fileDatavisualizer.welcomeContent.visualizeDataFromLogFileTitle"
+              id="xpack.fileDataVisualizer.welcomeContent.visualizeDataFromLogFileTitle"
               defaultMessage="Visualize data from a log file&nbsp;{experimentalBadge}"
               values={{
                 experimentalBadge: <ExperimentalBadge tooltipContent={toolTipContent} />,
@@ -63,7 +59,7 @@ export const WelcomeContent: FC = () => {
         <EuiText>
           <p>
             <FormattedMessage
-              id="xpack.ml.fileDatavisualizer.welcomeContent.visualizeDataFromLogFileDescription"
+              id="xpack.fileDataVisualizer.welcomeContent.visualizeDataFromLogFileDescription"
               defaultMessage="The File Data Visualizer helps you understand the fields and metrics in a log file.
               Upload your file, analyze its data, and then choose whether to import the data into an Elasticsearch index."
             />
@@ -73,7 +69,7 @@ export const WelcomeContent: FC = () => {
         <EuiText>
           <p>
             <FormattedMessage
-              id="xpack.ml.fileDatavisualizer.welcomeContent.supportedFileFormatDescription"
+              id="xpack.fileDataVisualizer.welcomeContent.supportedFileFormatDescription"
               defaultMessage="The File Data Visualizer supports these file formats:"
             />
           </p>
@@ -87,7 +83,7 @@ export const WelcomeContent: FC = () => {
             <EuiText>
               <p>
                 <FormattedMessage
-                  id="xpack.ml.fileDatavisualizer.welcomeContent.delimitedTextFilesDescription"
+                  id="xpack.fileDataVisualizer.welcomeContent.delimitedTextFilesDescription"
                   defaultMessage="Delimited text files, such as CSV and TSV"
                 />
               </p>
@@ -103,7 +99,7 @@ export const WelcomeContent: FC = () => {
             <EuiText>
               <p>
                 <FormattedMessage
-                  id="xpack.ml.fileDatavisualizer.welcomeContent.newlineDelimitedJsonDescription"
+                  id="xpack.fileDataVisualizer.welcomeContent.newlineDelimitedJsonDescription"
                   defaultMessage="Newline-delimited JSON"
                 />
               </p>
@@ -119,7 +115,7 @@ export const WelcomeContent: FC = () => {
             <EuiText>
               <p>
                 <FormattedMessage
-                  id="xpack.ml.fileDatavisualizer.welcomeContent.logFilesWithCommonFormatDescription"
+                  id="xpack.fileDataVisualizer.welcomeContent.logFilesWithCommonFormatDescription"
                   defaultMessage="Log files with a common format for the timestamp"
                 />
               </p>
@@ -130,7 +126,7 @@ export const WelcomeContent: FC = () => {
         <EuiText>
           <p>
             <FormattedMessage
-              id="xpack.ml.fileDatavisualizer.welcomeContent.uploadedFilesAllowedSizeDescription"
+              id="xpack.fileDataVisualizer.welcomeContent.uploadedFilesAllowedSizeDescription"
               defaultMessage="You can upload files up to {maxFileSize}."
               values={{ maxFileSize }}
             />
@@ -140,7 +136,7 @@ export const WelcomeContent: FC = () => {
         <EuiText>
           <p>
             <FormattedMessage
-              id="xpack.ml.fileDatavisualizer.welcomeContent.experimentalFeatureDescription"
+              id="xpack.fileDataVisualizer.welcomeContent.experimentalFeatureDescription"
               defaultMessage="This feature is experimental. Got feedback? Please create an issue in&nbsp;{githubLink}."
               values={{
                 githubLink: (

x-pack/plugins/ml/public/application/datavisualizer/file_based/components/analysis_summary/analysis_summary.tsx → x-pack/plugins/file_data_visualizer/public/application/components/analysis_summary/analysis_summary.tsx

@@ -9,7 +9,7 @@ import { FormattedMessage } from '@kbn/i18n/react';
 import React, { FC } from 'react';
 
 import { EuiTitle, EuiSpacer, EuiDescriptionList } from '@elastic/eui';
-import { FindFileStructureResponse } from '../../../../../../../file_upload/common';
+import { FindFileStructureResponse } from '../../../../../file_upload/common';
 
 export const AnalysisSummary: FC<{ results: FindFileStructureResponse }> = ({ results }) => {
   const items = createDisplayItems(results);
@@ -19,7 +19,7 @@ export const AnalysisSummary: FC<{ results: FindFileStructureResponse }> = ({ re
       <EuiTitle size="s">
         <h2>
           <FormattedMessage
-            id="xpack.ml.fileDatavisualizer.analysisSummary.summaryTitle"
+            id="xpack.fileDataVisualizer.analysisSummary.summaryTitle"
             defaultMessage="Summary"
           />
         </h2>
@@ -37,7 +37,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
     {
       title: (
         <FormattedMessage
-          id="xpack.ml.fileDatavisualizer.analysisSummary.analyzedLinesNumberTitle"
+          id="xpack.fileDataVisualizer.analysisSummary.analyzedLinesNumberTitle"
           defaultMessage="Number of lines analyzed"
         />
       ),
@@ -53,7 +53,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
     items.push({
       title: (
         <FormattedMessage
-          id="xpack.ml.fileDatavisualizer.analysisSummary.formatTitle"
+          id="xpack.fileDataVisualizer.analysisSummary.formatTitle"
           defaultMessage="Format"
         />
       ),
@@ -64,7 +64,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
       items.push({
         title: (
           <FormattedMessage
-            id="xpack.ml.fileDatavisualizer.analysisSummary.delimiterTitle"
+            id="xpack.fileDataVisualizer.analysisSummary.delimiterTitle"
             defaultMessage="Delimiter"
           />
         ),
@@ -74,7 +74,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
       items.push({
         title: (
           <FormattedMessage
-            id="xpack.ml.fileDatavisualizer.analysisSummary.hasHeaderRowTitle"
+            id="xpack.fileDataVisualizer.analysisSummary.hasHeaderRowTitle"
             defaultMessage="Has header row"
           />
         ),
@@ -87,7 +87,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
     items.push({
       title: (
         <FormattedMessage
-          id="xpack.ml.fileDatavisualizer.analysisSummary.grokPatternTitle"
+          id="xpack.fileDataVisualizer.analysisSummary.grokPatternTitle"
           defaultMessage="Grok pattern"
         />
       ),
@@ -99,7 +99,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
     items.push({
       title: (
         <FormattedMessage
-          id="xpack.ml.fileDatavisualizer.analysisSummary.timeFieldTitle"
+          id="xpack.fileDataVisualizer.analysisSummary.timeFieldTitle"
           defaultMessage="Time field"
         />
       ),
@@ -111,7 +111,7 @@ function createDisplayItems(results: FindFileStructureResponse) {
     items.push({
       title: (
         <FormattedMessage
-          id="xpack.ml.fileDatavisualizer.analysisSummary.timeFormatTitle"
+          id="xpack.fileDataVisualizer.analysisSummary.timeFormatTitle"
           defaultMessage="Time {timestampFormats, plural, zero {format} one {format} other {formats}}"
           values={{
             timestampFormats: results.java_timestamp_formats.length,

x-pack/plugins/ml/public/application/datavisualizer/file_based/components/bottom_bar/bottom_bar.tsx → x-pack/plugins/file_data_visualizer/public/application/components/bottom_bar/bottom_bar.tsx

@@ -39,7 +39,7 @@ export const BottomBar: FC<BottomBarProps> = ({ mode, onChangeMode, onCancel, di
               content={
                 disableImport ? (
                   <FormattedMessage
-                    id="xpack.ml.fileDatavisualizer.bottomBar.missingImportPrivilegesMessage"
+                    id="xpack.fileDataVisualizer.bottomBar.missingImportPrivilegesMessage"
                     defaultMessage="You require the ingest_admin role to enable data importing"
                   />
                 ) : null
@@ -52,7 +52,7 @@ export const BottomBar: FC<BottomBarProps> = ({ mode, onChangeMode, onCancel, di
                 data-test-subj="mlFileDataVisOpenImportPageButton"
               >
                 <FormattedMessage
-                  id="xpack.ml.fileDatavisualizer.bottomBar.readMode.importButtonLabel"
+                  id="xpack.fileDataVisualizer.bottomBar.readMode.importButtonLabel"
                   defaultMessage="Import"
                 />
               </EuiButton>
@@ -61,7 +61,7 @@ export const BottomBar: FC<BottomBarProps> = ({ mode, onChangeMode, onCancel, di
           <EuiFlexItem grow={false}>
             <EuiButtonEmpty color="ghost" onClick={() => onCancel()}>
               <FormattedMessage
-                id="xpack.ml.fileDatavisualizer.bottomBar.readMode.cancelButtonLabel"
+                id="xpack.fileDataVisualizer.bottomBar.readMode.cancelButtonLabel"
                 defaultMessage="Cancel"
               />
             </EuiButtonEmpty>
@@ -76,15 +76,15 @@ export const BottomBar: FC<BottomBarProps> = ({ mode, onChangeMode, onCancel, di
           <EuiFlexItem grow={false}>
             <EuiButton color="ghost" onClick={() => onChangeMode(DATAVISUALIZER_MODE.READ)}>
               <FormattedMessage
-                id="xpack.ml.fileDatavisualizer.bottomBar.backButtonLabel"
+                id="xpack.fileDataVisualizer.bottomBar.backButtonLabel"
                 defaultMessage="Back"
               />
             </EuiButton>
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiButtonEmpty color="ghost" onClick={() => onCancel()}>
               <FormattedMessage
-                id="xpack.ml.fileDatavisualizer.bottomBar.cancelButtonLabel"
+                id="xpack.fileDataVisualizer.bottomBar.cancelButtonLabel"
                 defaultMessage="Cancel"
               />
             </EuiButtonEmpty>