@@ -24,10 +24,10 @@ import {
24
24
EuiLoadingSpinner ,
25
25
EuiButton ,
26
26
} from '@elastic/eui' ;
27
- import { CoreStart } from '../../../../../../src/core/public' ;
27
+ import { CoreStart , MountPoint } from '../../../../../../src/core/public' ;
28
28
import { CoreServicesContext } from '../../../components/CoreServices/CoreServices' ;
29
29
import { get , isEmpty } from 'lodash' ;
30
- import { RouteComponentProps , Switch , Route , Redirect } from 'react-router-dom' ;
30
+ import { RouteComponentProps , Switch , Route , Redirect , useLocation } from 'react-router-dom' ;
31
31
import { useDispatch , useSelector } from 'react-redux' ;
32
32
import { useFetchDetectorInfo } from '../../CreateDetectorSteps/hooks/useFetchDetectorInfo' ;
33
33
import { useHideSideNavBar } from '../../main/hooks/useHideSideNavBar' ;
@@ -58,12 +58,16 @@ import {
58
58
import { DETECTOR_STATE } from '../../../../server/utils/constants' ;
59
59
import { CatIndex } from '../../../../server/models/types' ;
60
60
import { containsIndex } from '../utils/helpers' ;
61
+ import { DataSourceManagementPluginSetup , DataSourceViewConfig } from '../../../../../../src/plugins/data_source_management/public' ;
61
62
62
63
export interface DetectorRouterProps {
63
64
detectorId ?: string ;
64
65
}
65
- interface DetectorDetailProps
66
- extends RouteComponentProps < DetectorRouterProps > { }
66
+ interface DetectorDetailProps extends RouteComponentProps < DetectorRouterProps > {
67
+ dataSourceEnabled : boolean ;
68
+ dataSourceManagement : DataSourceManagementPluginSetup ;
69
+ setActionMenu : ( menuMount : MountPoint | undefined ) => void ;
70
+ }
67
71
68
72
const tabs = [
69
73
{
@@ -103,6 +107,11 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
103
107
const core = React . useContext ( CoreServicesContext ) as CoreStart ;
104
108
const dispatch = useDispatch ( ) ;
105
109
const detectorId = get ( props , 'match.params.detectorId' , '' ) as string ;
110
+
111
+ const location = useLocation ( ) ;
112
+ const queryParams = new URLSearchParams ( location . search ) ;
113
+ const dataSourceId = queryParams . get ( 'dataSourceId' ) as string ;
114
+
106
115
const { detector, hasError, isLoadingDetector, errorMessage } =
107
116
useFetchDetectorInfo ( detectorId ) ;
108
117
const { monitor, fetchMonitorError, isLoadingMonitor } =
@@ -156,7 +165,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
156
165
// detector starts, result index recreated or user switches tabs to re-fetch detector)
157
166
useEffect ( ( ) => {
158
167
const getInitialIndices = async ( ) => {
159
- await dispatch ( getIndices ( '' ) ) . catch ( ( error : any ) => {
168
+ await dispatch ( getIndices ( '' , dataSourceId ) ) . catch ( ( error : any ) => {
160
169
console . error ( error ) ;
161
170
core . notifications . toasts . addDanger ( 'Error getting all indices' ) ;
162
171
} ) ;
@@ -201,23 +210,23 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
201
210
...detectorDetailModel ,
202
211
selectedTab : DETECTOR_DETAIL_TABS . CONFIGURATIONS ,
203
212
} ) ;
204
- props . history . push ( `/detectors/${ detectorId } /configurations` ) ;
213
+ props . history . push ( `/detectors/${ detectorId } /configurations?dataSourceId= ${ dataSourceId } ` ) ;
205
214
} , [ ] ) ;
206
215
207
216
const handleSwitchToHistoricalTab = useCallback ( ( ) => {
208
217
setDetectorDetailModel ( {
209
218
...detectorDetailModel ,
210
219
selectedTab : DETECTOR_DETAIL_TABS . HISTORICAL ,
211
220
} ) ;
212
- props . history . push ( `/detectors/${ detectorId } /historical` ) ;
221
+ props . history . push ( `/detectors/${ detectorId } /historical?dataSourceId= ${ dataSourceId } ` ) ;
213
222
} , [ ] ) ;
214
223
215
224
const handleTabChange = ( route : DETECTOR_DETAIL_TABS ) => {
216
225
setDetectorDetailModel ( {
217
226
...detectorDetailModel ,
218
227
selectedTab : route ,
219
228
} ) ;
220
- props . history . push ( `/detectors/${ detectorId } /${ route } ` ) ;
229
+ props . history . push ( `/detectors/${ detectorId } /${ route } ?dataSourceId= ${ dataSourceId } ` ) ;
221
230
} ;
222
231
223
232
const hideMonitorCalloutModal = ( ) => {
@@ -261,8 +270,8 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
261
270
// Await for the start detector call to succeed before displaying toast.
262
271
// Don't wait for get detector call; the page will be updated
263
272
// via hooks automatically when the new detector info is returned.
264
- await dispatch ( startDetector ( detectorId ) ) ;
265
- dispatch ( getDetector ( detectorId ) ) ;
273
+ await dispatch ( startDetector ( detectorId , dataSourceId ) ) ;
274
+ dispatch ( getDetector ( detectorId , dataSourceId ) ) ;
266
275
core . notifications . toasts . addSuccess (
267
276
`Successfully started the detector job`
268
277
) ;
@@ -278,10 +287,10 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
278
287
const handleStopAdJob = async ( detectorId : string , listener ?: Listener ) => {
279
288
try {
280
289
if ( isRTJobRunning ) {
281
- await dispatch ( stopDetector ( detectorId ) ) ;
290
+ await dispatch ( stopDetector ( detectorId , dataSourceId ) ) ;
282
291
}
283
292
if ( isHistoricalJobRunning ) {
284
- await dispatch ( stopHistoricalDetector ( detectorId ) ) ;
293
+ await dispatch ( stopHistoricalDetector ( detectorId , dataSourceId ) ) ;
285
294
}
286
295
core . notifications . toasts . addSuccess (
287
296
`Successfully stopped the ${ runningJobsAsString } `
@@ -302,7 +311,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
302
311
303
312
const handleDelete = useCallback ( async ( detectorId : string ) => {
304
313
try {
305
- await dispatch ( deleteDetector ( detectorId ) ) ;
314
+ await dispatch ( deleteDetector ( detectorId , dataSourceId ) ) ;
306
315
core . notifications . toasts . addSuccess ( `Successfully deleted the detector` ) ;
307
316
hideDeleteDetectorModal ( ) ;
308
317
props . history . push ( '/detectors' ) ;
@@ -350,6 +359,8 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
350
359
> </ EuiCallOut >
351
360
) : null ;
352
361
362
+ const DataSourceMenu = props . dataSourceManagement . ui . getDataSourceMenu < DataSourceViewConfig > ( ) ;
363
+
353
364
return (
354
365
< React . Fragment >
355
366
{ ! isEmpty ( detector ) && ! hasError ? (
@@ -361,6 +372,18 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
361
372
: { ...lightStyles , flexGrow : 'unset' } ) ,
362
373
} }
363
374
>
375
+
376
+ { props . dataSourceEnabled && (
377
+ < DataSourceMenu
378
+ setMenuMountPoint = { props . setActionMenu }
379
+ componentType = { 'DataSourceView' }
380
+ componentConfig = { {
381
+ // give a placeholder label for now, will update it once neo team allows empty label field
382
+ activeOption : [ { label : 'labelPlaceHolder' , id : dataSourceId } ] ,
383
+ fullWidth : true
384
+ } }
385
+ />
386
+ ) }
364
387
< EuiFlexGroup
365
388
justifyContent = "spaceBetween"
366
389
style = { { padding : '10px' } }
@@ -542,6 +565,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
542
565
< AnomalyResults
543
566
{ ...resultsProps }
544
567
detectorId = { detectorId }
568
+ dataSourceId = { dataSourceId }
545
569
onStartDetector = { ( ) => handleStartAdJob ( detectorId ) }
546
570
onStopDetector = { ( ) => handleStopAdJob ( detectorId ) }
547
571
onSwitchToConfiguration = { handleSwitchToConfigurationTab }
@@ -556,6 +580,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
556
580
< HistoricalDetectorResults
557
581
{ ...configProps }
558
582
detectorId = { detectorId }
583
+ dataSourceId = { dataSourceId }
559
584
/>
560
585
) }
561
586
/>
@@ -566,6 +591,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
566
591
< DetectorConfig
567
592
{ ...configProps }
568
593
detectorId = { detectorId }
594
+ dataSourceId = { dataSourceId }
569
595
onEditFeatures = { handleEditFeature }
570
596
onEditDetector = { handleEditDetector }
571
597
/>
0 commit comments