Skip to content

Commit

Permalink
View edit 5 (#10585) (#10875)
Browse files Browse the repository at this point in the history 
* Start at view/edit mode 4

* Revert back to save panel

- Get rid of `clone`
- Get rid of rename

* Move order of top nav component around so no chance of hitting Edit -> Cancel

* Update "lose changes" confirmation dialog

- Change the string and button text
- Set default focus on the cancel button.

* Remove DashboardViewMode

It was previously used when viewMode wasn’t stored in appState, in
order to keep an unsaved dashboard, that was just saved, in Edit mode.
This is unnecessary in the latest iteration.

* Pull time filter out of dashboard_state

* Fix edit controls bug, add more tests, make other tests more stable.

* Remove unnecessary logic, unapplied query bug fix, code clean up

* Fix bug on filter reloading, add tests & clean up

* Fix issue with move and remove icons showing up in expanded panel mode

and add tests to catch it.

* Fix issue with lose changes not resetting panel state

and add tests.

* General Clean Up

- Merge function only used in one spot inline.

Add comments

* address code review comments

* Stop using static + class to namespace functions

Instead, export each function individually.

* Show dashed border on maximized panels in edit mode.

* Be more methodical about ensuring the modal dialog hides before continuing.

* abide by new no unused vars rule
  • Loading branch information
@stacey-gammon
stacey-gammon authored Mar 24, 2017
1 parent 6e89d68 commit 6e4e1a3
Show file tree
Hide file tree
Showing 29 changed files with 1,171 additions and 247 deletions.
3 changes: 2 additions & 1 deletion src/core_plugins/kibana/public/dashboard/__tests__/dashboard_panels.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@ describe('dashboard panels', function () {
$route.current = {
locals: {
dash: dashboard
}
},
params: {}
};

$el = angular.element(`
Expand Down
91 changes: 38 additions & 53 deletions src/core_plugins/kibana/public/dashboard/__tests__/dashboard_state.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,14 @@ import { DashboardState } from '../dashboard_state';

describe('DashboardState', function () {
let AppState;
let dashboardState;
let savedDashboard;
let SavedDashboard;
let timefilter;
let quickTimeRanges;

function initDashboardState() {
new DashboardState(savedDashboard, timefilter, true, quickTimeRanges, AppState);
dashboardState = new DashboardState(savedDashboard, AppState);
}

beforeEach(ngMock.module('kibana'));
Expand All @@ -23,72 +24,56 @@ describe('DashboardState', function () {
savedDashboard = new SavedDashboard();
}));

describe('timefilter', function () {

describe('when timeRestore is true', function () {
it('syncs quick time', function () {
savedDashboard.timeRestore = true;
savedDashboard.timeFrom = 'now/w';
savedDashboard.timeTo = 'now/w';

timefilter.time.from = '2015-09-19 06:31:44.000';
timefilter.time.to = '2015-09-29 06:31:44.000';
timefilter.time.mode = 'absolute';

initDashboardState();

expect(timefilter.time.mode).to.equal('quick');
expect(timefilter.time.to).to.equal('now/w');
expect(timefilter.time.from).to.equal('now/w');
});

it('syncs relative time', function () {
savedDashboard.timeRestore = true;
savedDashboard.timeFrom = 'now-13d';
savedDashboard.timeTo = 'now';
describe('syncTimefilterWithDashboard', function () {
it('syncs quick time', function () {
savedDashboard.timeRestore = true;
savedDashboard.timeFrom = 'now/w';
savedDashboard.timeTo = 'now/w';

timefilter.time.from = '2015-09-19 06:31:44.000';
timefilter.time.to = '2015-09-29 06:31:44.000';
timefilter.time.mode = 'absolute';
timefilter.time.from = '2015-09-19 06:31:44.000';
timefilter.time.to = '2015-09-29 06:31:44.000';
timefilter.time.mode = 'absolute';

initDashboardState();
initDashboardState();
dashboardState.syncTimefilterWithDashboard(timefilter, quickTimeRanges);

expect(timefilter.time.mode).to.equal('relative');
expect(timefilter.time.to).to.equal('now');
expect(timefilter.time.from).to.equal('now-13d');
});
expect(timefilter.time.mode).to.equal('quick');
expect(timefilter.time.to).to.equal('now/w');
expect(timefilter.time.from).to.equal('now/w');
});

it('syncs absolute time', function () {
savedDashboard.timeRestore = true;
savedDashboard.timeFrom = '2015-09-19 06:31:44.000';
savedDashboard.timeTo = '2015-09-29 06:31:44.000';
it('syncs relative time', function () {
savedDashboard.timeRestore = true;
savedDashboard.timeFrom = 'now-13d';
savedDashboard.timeTo = 'now';

timefilter.time.from = 'now/w';
timefilter.time.to = 'now/w';
timefilter.time.mode = 'quick';
timefilter.time.from = '2015-09-19 06:31:44.000';
timefilter.time.to = '2015-09-29 06:31:44.000';
timefilter.time.mode = 'absolute';

initDashboardState();
initDashboardState();
dashboardState.syncTimefilterWithDashboard(timefilter, quickTimeRanges);

expect(timefilter.time.mode).to.equal('absolute');
expect(timefilter.time.to).to.equal(savedDashboard.timeTo);
expect(timefilter.time.from).to.equal(savedDashboard.timeFrom);
});
expect(timefilter.time.mode).to.equal('relative');
expect(timefilter.time.to).to.equal('now');
expect(timefilter.time.from).to.equal('now-13d');
});

it('is not synced when timeRestore is false', function () {
savedDashboard.timeRestore = false;
savedDashboard.timeFrom = 'now/w';
savedDashboard.timeTo = 'now/w';
it('syncs absolute time', function () {
savedDashboard.timeRestore = true;
savedDashboard.timeFrom = '2015-09-19 06:31:44.000';
savedDashboard.timeTo = '2015-09-29 06:31:44.000';

timefilter.time.timeFrom = '2015-09-19 06:31:44.000';
timefilter.time.timeTo = '2015-09-29 06:31:44.000';
timefilter.time.mode = 'absolute';
timefilter.time.from = 'now/w';
timefilter.time.to = 'now/w';
timefilter.time.mode = 'quick';

initDashboardState();
dashboardState.syncTimefilterWithDashboard(timefilter, quickTimeRanges);

expect(timefilter.time.mode).to.equal('absolute');
expect(timefilter.time.timeFrom).to.equal('2015-09-19 06:31:44.000');
expect(timefilter.time.timeTo).to.equal('2015-09-29 06:31:44.000');
expect(timefilter.time.to).to.equal(savedDashboard.timeTo);
expect(timefilter.time.from).to.equal(savedDashboard.timeFrom);
});
});
});
11 changes: 10 additions & 1 deletion src/core_plugins/kibana/public/dashboard/dashboard.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@
ng-model="model.query"
placeholder="Filter..."
aria-label="Filter input"
data-test-subj="dashboardQuery"
type="text"
class="kuiLocalSearchInput"
ng-class="{'kuiLocalSearchInput-isInvalid': queryInput.$invalid}"
Expand All @@ -41,6 +42,7 @@
type="submit"
aria-label="Filter Dashboards"
class="kuiLocalSearchButton"
data-test-subj="dashboardQueryFilterButton"
ng-disabled="queryInput.$invalid"
>
<span class="fa fa-search" aria-hidden="true"></span>
Expand All @@ -55,14 +57,20 @@
<!-- Filters. -->
<filter-bar state="state"></filter-bar>

<div ng-show="showEditHelpText()" class="text-center start-screen">
<div ng-show="getShouldShowEditHelp()" class="text-center start-screen">
<h2>This dashboard is empty. Let's fill it up!</h2>
<p>Click the <a class="btn btn-xs navbtn-inverse" ng-click="kbnTopNav.open('add'); toggleAddVisualization = !toggleAddVisualization" aria-label="Add visualization">Add</a> button in the menu bar above to add a visualization to the dashboard. <br/>If you haven't setup a visualization yet visit <a href="#/visualize" title="Visualize">"Visualize"</a> to create your first visualization.</p>
</div>

<div ng-show="getShouldShowViewHelp()" class="text-center start-screen">
<h2>This dashboard is empty. Let's fill it up!</h2>
<p>Click the <a class="btn btn-xs navbtn-inverse" ng-click="kbnTopNav.open('edit');" aria-label="Edit">Edit</a> button in the menu bar above to start working on your new dashboard.
</div>

<dashboard-grid
ng-show="!hasExpandedPanel()"
on-panel-removed="onPanelRemoved"
dashboard-view-mode="dashboardViewMode"
panels="panels"
get-vis-click-handler="getFilterBarClickHandler"
get-vis-brush-handler="getBrushEvent"
Expand All @@ -77,6 +85,7 @@ <h2>This dashboard is empty. Let's fill it up!</h2>
panel="expandedPanel"
is-full-screen-mode="!chrome.getVisible()"
is-expanded="true"
dashboard-view-mode="dashboardViewMode"
get-vis-click-handler="getFilterBarClickHandler"
get-vis-brush-handler="getBrushEvent"
save-state="saveState"
Expand Down
Loading

0 comments on commit 6e4e1a3

Please sign in to comment.