Moved add panel panel and renamed it to add panel widget

This commit is contained in:
Torkel Ödegaard 2019-01-24 09:23:48 +01:00
parent 11c306abde
commit e713b0f029
5 changed files with 19 additions and 18 deletions

View File

@ -1,23 +1,23 @@
import React from 'react'; import React from 'react';
import _ from 'lodash'; import _ from 'lodash';
import config from 'app/core/config'; import config from 'app/core/config';
import { PanelModel } from '../panel_model'; import { PanelModel } from '../../panel_model';
import { DashboardModel } from '../dashboard_model'; import { DashboardModel } from '../../dashboard_model';
import store from 'app/core/store'; import store from 'app/core/store';
import { LS_PANEL_COPY_KEY } from 'app/core/constants'; import { LS_PANEL_COPY_KEY } from 'app/core/constants';
import { updateLocation } from 'app/core/actions'; import { updateLocation } from 'app/core/actions';
import { store as reduxStore } from 'app/store/store'; import { store as reduxStore } from 'app/store/store';
export interface AddPanelPanelProps { export interface Props {
panel: PanelModel; panel: PanelModel;
dashboard: DashboardModel; dashboard: DashboardModel;
} }
export interface AddPanelPanelState { export interface State {
copiedPanelPlugins: any[]; copiedPanelPlugins: any[];
} }
export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelPanelState> { export class AddPanelWidget extends React.Component<Props, State> {
constructor(props) { constructor(props) {
super(props); super(props);
this.handleCloseAddPanel = this.handleCloseAddPanel.bind(this); this.handleCloseAddPanel = this.handleCloseAddPanel.bind(this);
@ -133,15 +133,15 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
} }
return ( return (
<div className="panel-container add-panel-container"> <div className="panel-container add-panel-widget-container">
<div className="add-panel"> <div className="add-panel-widget">
<div className="add-panel__header grid-drag-handle"> <div className="add-panel-widget__header grid-drag-handle">
<i className="gicon gicon-add-panel" /> <i className="gicon gicon-add-panel" />
<button className="add-panel__close" onClick={this.handleCloseAddPanel}> <button className="add-panel-widget__close" onClick={this.handleCloseAddPanel}>
<i className="fa fa-close" /> <i className="fa fa-close" />
</button> </button>
</div> </div>
<div className="add-panel-btn-container"> <div className="add-panel-widget__btn-container">
<button className="btn-success btn btn-large" onClick={this.onCreateNewPanel}> <button className="btn-success btn btn-large" onClick={this.onCreateNewPanel}>
Edit Panel Edit Panel
</button> </button>

View File

@ -1,12 +1,12 @@
.add-panel-container { .add-panel-widget-container {
height: 100%; height: 100%;
} }
.add-panel { .add-panel-widget {
height: 100%; height: 100%;
} }
.add-panel__header { .add-panel-widget__header {
top: 0; top: 0;
position: absolute; position: absolute;
padding: 0 15px; padding: 0 15px;
@ -26,7 +26,7 @@
} }
} }
.add-panel__close { .add-panel-widget__close {
margin-left: auto; margin-left: auto;
background-color: transparent; background-color: transparent;
border: 0; border: 0;
@ -34,7 +34,7 @@
margin-right: -10px; margin-right: -10px;
} }
.add-panel-btn-container { .add-panel-widget__btn-container {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

View File

@ -0,0 +1 @@
export { AddPanelWidget } from './AddPanelWidget';

View File

@ -5,7 +5,7 @@ import classNames from 'classnames';
import { getAngularLoader, AngularComponent } from 'app/core/services/AngularLoader'; import { getAngularLoader, AngularComponent } from 'app/core/services/AngularLoader';
import { importPluginModule } from 'app/features/plugins/plugin_loader'; import { importPluginModule } from 'app/features/plugins/plugin_loader';
import { AddPanelPanel } from './AddPanelPanel'; import { AddPanelWidget } from '../components/AddPanelWidget';
import { getPanelPluginNotFound } from './PanelPluginNotFound'; import { getPanelPluginNotFound } from './PanelPluginNotFound';
import { DashboardRow } from './DashboardRow'; import { DashboardRow } from './DashboardRow';
import { PanelChrome } from './PanelChrome'; import { PanelChrome } from './PanelChrome';
@ -53,7 +53,7 @@ export class DashboardPanel extends PureComponent<Props, State> {
} }
renderAddPanel() { renderAddPanel() {
return <AddPanelPanel panel={this.props.panel} dashboard={this.props.dashboard} />; return <AddPanelWidget panel={this.props.panel} dashboard={this.props.dashboard} />;
} }
onPluginTypeChanged = (plugin: PanelPlugin) => { onPluginTypeChanged = (plugin: PanelPlugin) => {

View File

@ -39,6 +39,7 @@
@import 'layout/page'; @import 'layout/page';
// COMPONENTS // COMPONENTS
@import '../app/features/dashboard/components/AddPanelWidget/AddPanelWidget';
@import 'components/scrollbar'; @import 'components/scrollbar';
@import 'components/cards'; @import 'components/cards';
@import 'components/buttons'; @import 'components/buttons';
@ -58,7 +59,6 @@
@import 'components/panel_table'; @import 'components/panel_table';
@import 'components/panel_text'; @import 'components/panel_text';
@import 'components/panel_heatmap'; @import 'components/panel_heatmap';
@import 'components/panel_add_panel';
@import 'components/panel_logs'; @import 'components/panel_logs';
@import 'components/settings_permissions'; @import 'components/settings_permissions';
@import 'components/tagsinput'; @import 'components/tagsinput';