Skip to content

Commit

Permalink
Show flyout after editing or creating a pipeline
Browse files Browse the repository at this point in the history
  • Loading branch information
jloleysens committed Apr 24, 2020
1 parent eba5305 commit 0c8917c
Show file tree
Hide file tree
Showing 4 changed files with 28 additions and 6 deletions.
2 changes: 2 additions & 0 deletions x-pack/plugins/ingest_pipelines/public/application/app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ export const AppWithoutRouter = () => (
<Route exact path={`${BASE_PATH}/create/:sourceName`} component={PipelinesClone} />
<Route exact path={`${BASE_PATH}/create`} component={PipelinesCreate} />
<Route exact path={`${BASE_PATH}/edit/:name`} component={PipelinesEdit} />
// Catch all
<Route component={PipelinesList} />
</Switch>
);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export const PipelinesCreate: React.FunctionComponent<RouteComponentProps & Prop
return;
}

history.push(BASE_PATH);
history.push(BASE_PATH + `?pipeline=${pipeline.name}`);
};

const onCancel = () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ export const PipelinesEdit: React.FunctionComponent<RouteComponentProps<MatchPar
return;
}

history.push(BASE_PATH);
history.push(BASE_PATH + `?pipeline=${updatedPipeline.name}`);
};

const onCancel = () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ import React, { useEffect, useState } from 'react';
import { RouteComponentProps } from 'react-router-dom';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
import { Location } from 'history';
import { parse } from 'query-string';

import {
EuiPageBody,
Expand All @@ -31,21 +33,37 @@ import { PipelineTable } from './table';
import { PipelineDetails } from './details';
import { PipelineDeleteModal } from './delete_modal';

export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({ history }) => {
const getPipelineNameFromLocation = (location: Location) => {
const { pipeline } = parse(location.search.substring(1));
return pipeline;
};

export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({
history,
location,
}) => {
const { services } = useKibana();
const pipelineNameFromLocation = getPipelineNameFromLocation(location);

const [selectedPipeline, setSelectedPipeline] = useState<Pipeline | undefined>(undefined);
const [pipelinesToDelete, setPipelinesToDelete] = useState<string[]>([]);

const { data, isLoading, error, sendRequest } = services.api.useLoadPipelines();

// Track component loaded
useEffect(() => {
services.metric.trackUiMetric(UIM_PIPELINES_LIST_LOAD);
services.breadcrumbs.setBreadcrumbs('home');
}, [services.metric, services.breadcrumbs]);

const { data, isLoading, error, sendRequest } = services.api.useLoadPipelines();

let content: React.ReactNode;
useEffect(() => {
if (pipelineNameFromLocation && data?.length) {
const pipeline = data.find(p => p.name === pipelineNameFromLocation);
if (pipeline) {
setSelectedPipeline(pipeline);
}
}
}, [pipelineNameFromLocation, data]);

const editPipeline = (name: string) => {
history.push(encodeURI(`${BASE_PATH}/edit/${encodeURIComponent(name)}`));
Expand All @@ -55,6 +73,8 @@ export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({ hi
history.push(encodeURI(`${BASE_PATH}/create/${encodeURIComponent(name)}`));
};

let content: React.ReactNode;

if (isLoading) {
content = (
<SectionLoading>
Expand Down

0 comments on commit 0c8917c

Please sign in to comment.