From 9a65938e1d8c28c76201cb7d4f6f7c2ac2e932e3 Mon Sep 17 00:00:00 2001 From: Delmer Date: Wed, 10 Oct 2018 12:28:54 -0400 Subject: [PATCH] feat(logs/actions): Add getConfig action (#1027) feat(logs/actions): Add getConfig action Adds getConfig and cleans up log imports --- chronograf/ui/src/logs/actions/index.ts | 45 ++++++- .../logs/containers/logs_page/LogsPage.tsx | 110 ++++++++++-------- 2 files changed, 105 insertions(+), 50 deletions(-) diff --git a/chronograf/ui/src/logs/actions/index.ts b/chronograf/ui/src/logs/actions/index.ts index 10ddd221c8..579792c2aa 100644 --- a/chronograf/ui/src/logs/actions/index.ts +++ b/chronograf/ui/src/logs/actions/index.ts @@ -1,13 +1,30 @@ -import {Namespace} from 'src/types' -import {Source} from 'src/types/v2' -import {getSource} from 'src/sources/apis/v2' +// Utils import {getDeep} from 'src/utils/wrappers' +import {serverToUIConfig} from 'src/logs/utils/config' import AJAX from 'src/utils/ajax' -import {Filter, LogConfig, SearchStatus} from 'src/types/logs' +// APIs +import {readViews as readViewsAJAX} from 'src/dashboards/apis/v2/view' +import {getSource} from 'src/sources/apis/v2' + +// Data +import {logViewData as defaultLogView} from 'src/logs/data/logViewData' + +// Types +import {Dispatch} from 'redux' +import {View, ViewType} from 'src/types/v2/dashboards' +import {Filter, LogConfig, SearchStatus, LogsState} from 'src/types/logs' +import {Namespace} from 'src/types' +import {Source} from 'src/types/v2' export const INITIAL_LIMIT = 1000 +interface State { + logs: LogsState +} + +type GetState = () => State + export enum ActionTypes { SetSource = 'LOGS_SET_SOURCE', SetNamespaces = 'LOGS_SET_NAMESPACES', @@ -20,6 +37,9 @@ export enum ActionTypes { SetSearchStatus = 'SET_SEARCH_STATUS', } +const getIsTruncated = (state: State): boolean => + state.logs.logConfig.isTruncated + export interface AddFilterAction { type: ActionTypes.AddFilter payload: { @@ -194,6 +214,23 @@ export const getSourceAndPopulateNamespacesAsync = ( } } +export const getLogConfigAsync = (url: string) => async ( + dispatch: Dispatch, + getState: GetState +) => { + const state = getState() + const isTruncated = getIsTruncated(state) + const views = await readViewsAJAX(url, {type: ViewType.LogViewer}) + const logView: View = getDeep(views, '0', defaultLogView) + + const logConfig = { + ...serverToUIConfig(logView), + isTruncated, + } + + await dispatch(setConfig(logConfig)) +} + export const setConfig = (logConfig: LogConfig): SetConfigAction => { return { type: ActionTypes.SetConfig, diff --git a/chronograf/ui/src/logs/containers/logs_page/LogsPage.tsx b/chronograf/ui/src/logs/containers/logs_page/LogsPage.tsx index 2c5ec0787a..54155f8f2c 100644 --- a/chronograf/ui/src/logs/containers/logs_page/LogsPage.tsx +++ b/chronograf/ui/src/logs/containers/logs_page/LogsPage.tsx @@ -1,52 +1,61 @@ +// Libraries import React, {Component} from 'react' import {connect} from 'react-redux' import {withRouter, InjectedRouter} from 'react-router' -import {searchToFilters} from 'src/logs/utils/search' -import {notify as notifyAction} from 'src/shared/actions/notifications' - -import {NOW} from 'src/logs/constants' - -import { - getSourceAndPopulateNamespacesAsync, - setNamespaceAsync, - addFilter, - removeFilter, - changeFilter, - clearFilters, - setSearchStatus, - setConfig, -} from 'src/logs/actions' -import {getSourcesAsync} from 'src/shared/actions/sources' +// Components import LogsHeader from 'src/logs/components/LogsHeader' import LoadingStatus from 'src/logs/components/loading_status/LoadingStatus' import SearchBar from 'src/logs/components/LogsSearchBar' import FilterBar from 'src/logs/components/logs_filter_bar/LogsFilterBar' -import {Source} from 'src/types/v2' -import {Namespace} from 'src/types' +// Actions +import * as logActions from 'src/logs/actions' +import {getSourcesAsync} from 'src/shared/actions/sources' +import {notify as notifyAction} from 'src/shared/actions/notifications' + +// Utils +import {searchToFilters} from 'src/logs/utils/search' + +// Constants +import {NOW} from 'src/logs/constants' + +// Types +import {Source, Links} from 'src/types/v2' +import {Namespace} from 'src/types' import {Filter, LogConfig, SearchStatus} from 'src/types/logs' -interface Props { +interface StateProps { + links: Links sources: Source[] - currentSource: Source | null - currentNamespaces: Namespace[] - currentNamespace: Namespace - getSourceAndPopulateNamespaces: typeof getSourceAndPopulateNamespacesAsync - getSources: () => void - setNamespaceAsync: (namespace: Namespace) => void - addFilter: (filter: Filter) => void - removeFilter: (id: string) => void - changeFilter: (id: string, operator: string, value: string) => void - clearFilters: () => void - updateConfig: typeof setConfig - router: InjectedRouter filters: Filter[] logConfig: LogConfig searchStatus: SearchStatus - setSearchStatus: typeof setSearchStatus + currentNamespace: Namespace + currentSource: Source | null + currentNamespaces: Namespace[] } +interface PassedProps { + router: InjectedRouter +} + +interface DispatchProps { + notify: typeof notifyAction + getConfig: typeof logActions.getLogConfigAsync + getSources: typeof getSourcesAsync + addFilter: typeof logActions.addFilter + updateConfig: typeof logActions.setConfig + removeFilter: typeof logActions.removeFilter + changeFilter: typeof logActions.changeFilter + clearFilters: typeof logActions.clearFilters + setSearchStatus: typeof logActions.setSearchStatus + setNamespaceAsync: typeof logActions.setNamespaceAsync + getSourceAndPopulateNamespaces: typeof logActions.getSourceAndPopulateNamespacesAsync +} + +type Props = StateProps & PassedProps & DispatchProps + interface State { liveUpdating: boolean } @@ -70,9 +79,14 @@ class LogsPage extends Component { } public async componentDidMount() { + const { + links: {views: viewsLink}, + } = this.props + try { await this.props.getSources() await this.setCurrentSource() + await this.props.getConfig(viewsLink) } catch (e) { console.error('Failed to get sources and namespaces for logs') } @@ -248,6 +262,7 @@ class LogsPage extends Component { const mapStateToProps = ({ sources, + links, logs: { currentSource, currentNamespaces, @@ -256,27 +271,30 @@ const mapStateToProps = ({ logConfig, searchStatus, }, -}) => ({ +}): StateProps => ({ + links, sources, - currentSource, - currentNamespaces, - currentNamespace, filters, logConfig, searchStatus, + currentSource, + currentNamespace, + currentNamespaces, }) -const mapDispatchToProps = { - getSourceAndPopulateNamespaces: getSourceAndPopulateNamespacesAsync, - getSources: getSourcesAsync, - setNamespaceAsync, - setSearchStatus, - addFilter, - removeFilter, - changeFilter, - clearFilters, - updateConfig: setConfig, +const mapDispatchToProps: DispatchProps = { notify: notifyAction, + getSources: getSourcesAsync, + addFilter: logActions.addFilter, + updateConfig: logActions.setConfig, + removeFilter: logActions.removeFilter, + changeFilter: logActions.changeFilter, + clearFilters: logActions.clearFilters, + getConfig: logActions.getLogConfigAsync, + setSearchStatus: logActions.setSearchStatus, + setNamespaceAsync: logActions.setNamespaceAsync, + getSourceAndPopulateNamespaces: + logActions.getSourceAndPopulateNamespacesAsync, } export default withRouter(