Skip to content

Commit

Permalink
Migrate save top nav in Discover and Visualize to EUI (elastic#23190) (
Browse files Browse the repository at this point in the history
…elastic#23380)

* extract reusable save component from DashboardSaveModal

* update discover search to use SavedObjectSaveModal

* create generic show_save_model that works for both discover and dashboard

* fix last bits of discover save

* remove old save functionallity

* migrate visualize save to EUI

* fix functional tests

* disable save button if title is empty

* mark title input as invalid when title is not provided

* fix funtional tests
  • Loading branch information
nreese authored Sep 21, 2018
1 parent f750ab7 commit fe1b90f
Show file tree
Hide file tree
Showing 12 changed files with 449 additions and 422 deletions.
23 changes: 14 additions & 9 deletions src/core_plugins/kibana/public/dashboard/dashboard_app.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
*/

import _ from 'lodash';
import React from 'react';
import angular from 'angular';
import { uiModules } from 'ui/modules';
import chrome from 'ui/chrome';
Expand All @@ -40,7 +41,8 @@ import { VisualizeConstants } from '../visualize/visualize_constants';
import { DashboardStateManager } from './dashboard_state_manager';
import { saveDashboard } from './lib';
import { showCloneModal } from './top_nav/show_clone_modal';
import { showSaveModal } from './top_nav/show_save_modal';
import { showSaveModal } from 'ui/saved_objects/show_saved_object_save_modal';
import { DashboardSaveModal } from './top_nav/save_modal';
import { showAddPanel } from './top_nav/show_add_panel';
import { showOptionsPopover } from './top_nav/show_options_popover';
import { showShareContextMenu, ShareContextMenuExtensionsRegistryProvider } from 'ui/share';
Expand Down Expand Up @@ -271,7 +273,6 @@ app.directive('dashboardApp', function ($injector) {
function save(saveOptions) {
return saveDashboard(angular.toJson, timefilter, dashboardStateManager, saveOptions)
.then(function (id) {
$scope.kbnTopNav.close('save');
if (id) {
toastNotifications.addSuccess({
title: `Dashboard '${dash.title}' was saved`,
Expand Down Expand Up @@ -335,13 +336,17 @@ app.directive('dashboardApp', function ($injector) {
});
};

showSaveModal({
onSave,
title: currentTitle,
description: currentDescription,
timeRestore: currentTimeRestore,
showCopyOnSave: dash.id ? true : false,
});
const dashboardSaveModal = (
<DashboardSaveModal
onSave={onSave}
onClose={() => {}}
title={currentTitle}
description={currentDescription}
timeRestore={currentTimeRestore}
showCopyOnSave={dash.id ? true : false}
/>
);
showSaveModal(dashboardSaveModal);
};
navActions[TopNavIds.CLONE] = () => {
const currentTitle = dashboardStateManager.getTitle();
Expand Down
Original file line number Diff line number Diff line change
@@ -1,102 +1,43 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`renders DashboardSaveModal 1`] = `
<EuiOverlayMask>
<EuiModal
className="dshSaveModal"
data-test-subj="dashboardSaveModal"
maxWidth={true}
onClose={[Function]}
>
<EuiModalHeader>
<EuiModalHeaderTitle>
Save Dashboard
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm>
<EuiFormRow
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
label="Save as a new dashboard"
>
<EuiSwitch
checked={false}
data-test-subj="saveAsNewCheckbox"
onChange={[Function]}
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
label="Title"
>
<EuiFieldText
autoFocus={true}
compressed={false}
data-test-subj="dashboardTitle"
fullWidth={false}
isInvalid={false}
isLoading={false}
onChange={[Function]}
value="dash title"
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
label="Description"
>
<EuiTextArea
compressed={true}
data-test-subj="dashboardDescription"
fullWidth={false}
onChange={[Function]}
resize="vertical"
value="dash description"
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
helpText="This changes the time filter to the currently selected time each time this dashboard is loaded."
label="Store time with dashboard"
>
<EuiSwitch
checked={true}
data-test-subj="storeTimeWithDashboard"
onChange={[Function]}
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButton
color="primary"
data-test-subj="saveCancelButton"
fill={false}
iconSide="left"
onClick={[Function]}
type="button"
<SavedObjectSaveModal
objectType="dashboard"
onClose={[Function]}
onSave={[Function]}
options={
<React.Fragment>
<EuiFormRow
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
label="Description"
>
Cancel
</EuiButton>
<EuiButton
color="primary"
data-test-subj="confirmSaveDashboardButton"
fill={true}
iconSide="left"
isLoading={false}
onClick={[Function]}
type="button"
<EuiTextArea
compressed={true}
data-test-subj="dashboardDescription"
fullWidth={false}
onChange={[Function]}
resize="vertical"
value="dash description"
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
helpText="This changes the time filter to the currently selected time each time this dashboard is loaded."
label="Store time with dashboard"
>
Confirm Save
</EuiButton>
</EuiModalFooter>
</EuiModal>
</EuiOverlayMask>
<EuiSwitch
checked={true}
data-test-subj="storeTimeWithDashboard"
onChange={[Function]}
/>
</EuiFormRow>
</React.Fragment>
}
showCopyOnSave={true}
title="dash title"
/>
`;
Loading

0 comments on commit fe1b90f

Please sign in to comment.