Init

Author: cnasikas

x-pack/plugins/security_solution/public/alerts/components/alerts_table/index.tsx

@@ -21,7 +21,6 @@ import { useKibana } from '../../../common/lib/kibana';
 import { inputsSelectors, State, inputsModel } from '../../../common/store';
 import { timelineActions, timelineSelectors } from '../../../timelines/store/timeline';
 import { TimelineModel } from '../../../timelines/store/timeline/model';
-import { timelineDefaults } from '../../../timelines/store/timeline/defaults';
 import { useManageTimeline } from '../../../timelines/components/manage_timeline';
 import { useApolloClient } from '../../../common/utils/apollo_context';
 
@@ -376,7 +375,7 @@ const makeMapStateToProps = () => {
   const getGlobalInputs = inputsSelectors.globalSelector();
   const mapStateToProps = (state: State, ownProps: OwnProps) => {
     const { timelineId } = ownProps;
-    const timeline: TimelineModel = getTimeline(state, timelineId) ?? timelineDefaults;
+    const timeline: TimelineModel = getTimeline(state, timelineId);
     const { deletedEventIds, isSelectAllChecked, loadingEventIds, selectedEventIds } = timeline;
 
     const globalInputs: inputsModel.InputsRange = getGlobalInputs(state);
@@ -394,30 +393,31 @@ const makeMapStateToProps = () => {
 };
 
 const mapDispatchToProps = (dispatch: Dispatch) => ({
-  clearSelected: ({ id }: { id: string }) => dispatch(timelineActions.clearSelected({ id })),
+  clearSelected: ({ id }: { id: TimelineIdLiteral }) =>
+    dispatch(timelineActions.clearSelected({ id })),
   setEventsLoading: ({
     id,
     eventIds,
     isLoading,
   }: {
-    id: string;
+    id: TimelineIdLiteral;
     eventIds: string[];
     isLoading: boolean;
   }) => dispatch(timelineActions.setEventsLoading({ id, eventIds, isLoading })),
-  clearEventsLoading: ({ id }: { id: string }) =>
+  clearEventsLoading: ({ id }: { id: TimelineIdLiteral }) =>
     dispatch(timelineActions.clearEventsLoading({ id })),
   setEventsDeleted: ({
     id,
     eventIds,
     isDeleted,
   }: {
-    id: string;
+    id: TimelineIdLiteral;
     eventIds: string[];
     isDeleted: boolean;
   }) => dispatch(timelineActions.setEventsDeleted({ id, eventIds, isDeleted })),
-  clearEventsDeleted: ({ id }: { id: string }) =>
+  clearEventsDeleted: ({ id }: { id: TimelineIdLiteral }) =>
     dispatch(timelineActions.clearEventsDeleted({ id })),
-  updateTimelineIsLoading: ({ id, isLoading }: { id: string; isLoading: boolean }) =>
+  updateTimelineIsLoading: ({ id, isLoading }: { id: TimelineIdLiteral; isLoading: boolean }) =>
     dispatch(timelineActions.updateIsLoading({ id, isLoading })),
   updateTimeline: dispatchUpdateTimeline(dispatch),
 });

x-pack/plugins/security_solution/public/alerts/constants.ts

@@ -9,6 +9,7 @@ import React, { useCallback } from 'react';
 import styled, { css } from 'styled-components';
 
 import { useDispatch } from 'react-redux';
+import { TimelineIdLiteral } from '../../../../common/types/timeline';
 import * as i18n from '../case_view/translations';
 import { Markdown } from '../../../common/components/markdown';
 import { Form, useForm, UseField } from '../../../shared_imports';
@@ -60,15 +61,15 @@ export const UserActionMarkdown = ({
   }, [id, onChangeEditable]);
 
   const handleTimelineClick = useCallback(
-    (timelineId: string) => {
+    (timelineId: TimelineIdLiteral) => {
       queryTimelineById({
         apolloClient,
         timelineId,
         updateIsLoading: ({
           id: currentTimelineId,
           isLoading,
         }: {
-          id: string;
+          id: TimelineIdLiteral;
           isLoading: boolean;
         }) => dispatch(dispatchUpdateIsLoading({ id: currentTimelineId, isLoading })),
         updateTimeline: dispatchUpdateTimeline(dispatch),

x-pack/plugins/security_solution/public/cases/components/user_action_tree/user_action_markdown.tsx

@@ -8,6 +8,7 @@ import React, { useCallback, useMemo, useEffect } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
 import deepEqual from 'fast-deep-equal';
 
+import { TimelineIdLiteral } from '../../../../common/types/timeline';
 import { DEFAULT_INDEX_KEY } from '../../../../common/constants';
 import { inputsModel, inputsSelectors, State } from '../../store';
 import { inputsActions } from '../../store/actions';
@@ -28,7 +29,7 @@ export interface OwnProps {
   defaultIndices?: string[];
   defaultModel: SubsetTimelineModel;
   end: number;
-  id: string;
+  id: TimelineIdLiteral;
   start: number;
   headerFilterGroup?: React.ReactNode;
   pageFilters?: Filter[];

x-pack/plugins/security_solution/public/common/components/events_viewer/index.tsx

@@ -10,6 +10,7 @@ import { EuiLink, EuiTableRow, EuiTableRowCell, EuiText, EuiToolTip } from '@ela
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
 import styled, { css } from 'styled-components';
+import { TimelineIdLiteral } from '../../../../common/types/timeline';
 import * as i18n from './translations';
 
 const TableHeader = styled.thead`
@@ -38,7 +39,7 @@ const REL_NOREFERRER = 'noreferrer';
 export const Markdown = React.memo<{
   disableLinks?: boolean;
   raw?: string;
-  onClickTimeline?: (timelineId: string) => void;
+  onClickTimeline?: (timelineId: TimelineIdLiteral) => void;
   size?: 'xs' | 's' | 'm';
 }>(({ disableLinks = false, onClickTimeline, raw, size = 's' }) => {
   const markdownRenderers = {
@@ -63,7 +64,8 @@ export const Markdown = React.memo<{
     ),
     link: ({ children, href }: { children: React.ReactNode[]; href?: string }) => {
       if (onClickTimeline != null && href != null && href.indexOf(`timelines?timeline=(id:`) > -1) {
-        const timelineId = href.split('timelines?timeline=(id:')[1].split("'")[1] ?? '';
+        const timelineId = (href.split('timelines?timeline=(id:')[1].split("'")[1] ??
+          '') as TimelineIdLiteral;
         return (
           <EuiToolTip content={i18n.TIMELINE_ID(timelineId)}>
             <EuiLink

x-pack/plugins/security_solution/public/common/components/markdown/index.tsx

@@ -22,6 +22,7 @@ import {
 
 import { OnTimeChangeProps } from '@elastic/eui';
 
+import { TimelineIdLiteral } from '../../../../common/types/timeline';
 import { inputsActions } from '../../store/inputs';
 import { InputsRange } from '../../store/inputs/model';
 import { InputsModelId } from '../../store/inputs/constants';
@@ -309,7 +310,7 @@ interface UpdateReduxSearchBar extends OnTimeChangeProps {
   query?: Query;
   savedQuery?: SavedQuery;
   resetSavedQuery?: boolean;
-  timelineId?: string;
+  timelineId?: TimelineIdLiteral;
   updateTime: boolean;
 }
 

x-pack/plugins/security_solution/public/common/components/search_bar/index.tsx

@@ -17,6 +17,7 @@ import React, { useState, useCallback } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
 import { Dispatch } from 'redux';
 
+import { TimelineIdLiteral } from '../../../../common/types/timeline';
 import { DEFAULT_TIMEPICKER_QUICK_RANGES } from '../../../../common/constants';
 import { timelineActions } from '../../../timelines/store/timeline';
 import { useUiSetting$ } from '../../lib/kibana';
@@ -48,7 +49,7 @@ interface Range {
 interface UpdateReduxTime extends OnTimeChangeProps {
   id: InputsModelId;
   kql?: inputsModel.GlobalKqlQuery | undefined;
-  timelineId?: string;
+  timelineId?: TimelineIdLiteral;
 }
 
 interface ReturnUpdateReduxTime {
@@ -67,7 +68,7 @@ export type DispatchUpdateReduxTime = ({
 interface OwnProps {
   disabled?: boolean;
   id: InputsModelId;
-  timelineId?: string;
+  timelineId?: TimelineIdLiteral;
 }
 
 export type SuperDatePickerProps = OwnProps & PropsFromRedux;

x-pack/plugins/security_solution/public/common/components/super_date_picker/index.tsx

@@ -82,7 +82,7 @@ const state: State = {
     ...mockGlobalState.timeline,
     timelineById: {
       [ACTIVE_TIMELINE_REDUX_ID]: {
-        ...mockGlobalState.timeline.timelineById.test,
+        ...mockGlobalState.timeline.timelineById.test!,
         id: ACTIVE_TIMELINE_REDUX_ID,
         dataProviders: [
           {

x-pack/plugins/security_solution/public/common/components/top_n/index.test.tsx

@@ -7,6 +7,7 @@
 import React, { useMemo } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
 
+import { TimelineId } from '../../../../common/types/timeline';
 import { GlobalTime } from '../../containers/global_time';
 import { BrowserFields, WithSource } from '../../containers/source';
 import { useKibana } from '../../lib/kibana';
@@ -23,7 +24,7 @@ import { TopN } from './top_n';
 import { useManageTimeline } from '../../../timelines/components/manage_timeline';
 
 /** The currently active timeline always has this Redux ID */
-export const ACTIVE_TIMELINE_REDUX_ID = 'timeline-1';
+export const ACTIVE_TIMELINE_REDUX_ID = TimelineId.active;
 
 const EMPTY_FILTERS: Filter[] = [];
 const EMPTY_QUERY: Query = { query: '', language: 'kuery' };

x-pack/plugins/security_solution/public/common/components/top_n/index.tsx

@@ -122,8 +122,8 @@ export const makeMapStateToProps = () => {
 
     const timeline = Object.entries(getTimelines(state)).reduce(
       (obj, [timelineId, timelineObj]) => ({
-        id: timelineObj.savedObjectId != null ? timelineObj.savedObjectId : '',
-        isOpen: timelineObj.show,
+        id: timelineObj?.savedObjectId != null ? timelineObj.savedObjectId : '',
+        isOpen: timelineObj?.show ?? false,
       }),
       { id: '', isOpen: false }
     );