diff --git a/src/actions/index.js b/src/actions/index.js new file mode 100644 index 00000000..2f366aec --- /dev/null +++ b/src/actions/index.js @@ -0,0 +1,2 @@ +export * from './panes.actions'; +export * from './projects.actions'; \ No newline at end of file diff --git a/src/actions/panes.actions.js b/src/actions/panes.actions.js new file mode 100644 index 00000000..bc0d0daa --- /dev/null +++ b/src/actions/panes.actions.js @@ -0,0 +1,17 @@ +export const panesActions = { + ADD_PANE: 'ADD_PANE', + addPane(id, name) { + return { + type: panesActions.ADD_PANE, + data: { id, name } + } + }, + + REMOVE_PANE: 'REMOVE_PANE', + removePane(id) { + return { + type: panesActions.REMOVE_PANE, + data: { id } + } + } +}; diff --git a/src/actions/projects.actions.js b/src/actions/projects.actions.js new file mode 100644 index 00000000..dec91df7 --- /dev/null +++ b/src/actions/projects.actions.js @@ -0,0 +1,6 @@ +export function selectProject(id, name) { + return { + type: 'SELECT_PROJECT', + data: { id, name } + }; +} diff --git a/src/actions/projects.js b/src/actions/projects.js deleted file mode 100644 index 9ee2f50c..00000000 --- a/src/actions/projects.js +++ /dev/null @@ -1,8 +0,0 @@ -export function selectProject(project) { - return { - type: 'SELECT_PROJECT', - data: { - project: project, - } - }; -} diff --git a/src/actions/projects.test.js b/src/actions/projects.test.js index 75e1878c..a084c197 100644 --- a/src/actions/projects.test.js +++ b/src/actions/projects.test.js @@ -1,17 +1,11 @@ import * as actions from './projects'; -import ProjectItem from '../components/projecteditor/control/item/projectItem'; -jest.mock('../components/projecteditor/control/item/projectItem'); // ProjectItem is now a mock constructor describe('actions', () => { it('should create an action to select the projec to open when re-loading the app', () => { - const projectItem = new ProjectItem(); - const expectedAction = { type: 'SELECT_PROJECT', - data: { - project: projectItem - }, + data: { id: 23, name: 'test' }, }; - expect(actions.selectProject(projectItem)).toEqual(expectedAction); + expect(actions.selectProject(23, 'test')).toEqual(expectedAction); }); }); diff --git a/src/actions/view.js b/src/actions/view.js index fd81dd48..17400e12 100644 --- a/src/actions/view.js +++ b/src/actions/view.js @@ -1,4 +1,3 @@ -export const closeAllPanels = () => ({ type: 'CLOSE_ALL_PANELS' }); export const toggleTransactionsHistoryPanel = () => ({ type: 'TOGGLE_TRANSACTIONS_HISTORY_PANEL' }); export const openTransactionsHistoryPanel = () => ({ type: 'OPEN_TRANSACTIONS_HISTORY_PANEL' }); export const closeTransactionsHistoryPanel = () => ({ type: 'CLOSE_TRANSACTIONS_HISTORY_PANEL' }); diff --git a/src/actions/view.test.js b/src/actions/view.test.js index dc82de0e..748246ce 100644 --- a/src/actions/view.test.js +++ b/src/actions/view.test.js @@ -1,13 +1,6 @@ import * as actions from './view'; describe('actions', () => { - it('should create an action to close all the panels', () => { - const expectedAction = { - type: 'CLOSE_ALL_PANELS' - }; - expect(actions.closeAllPanels()).toEqual(expectedAction); - }); - it('should create an action to toggle the transactions history panel', () => { const expectedAction = { type: 'TOGGLE_TRANSACTIONS_HISTORY_PANEL' diff --git a/src/components/projecteditor/control/control.js b/src/components/projecteditor/control/control.js index f07da72c..3f9ea979 100644 --- a/src/components/projecteditor/control/control.js +++ b/src/components/projecteditor/control/control.js @@ -166,7 +166,7 @@ export default class Control extends Component { * if all windows successfully closed then remove project from explorer. */ _closeProject = cb => { - const { router, closeAllPanels } = this.props; + const { router, closeTransactionsHistoryPanel } = this.props; router.panes.closeAll(status => { if (status == 0) { this.setState({ activeProject: null }); @@ -174,7 +174,7 @@ export default class Control extends Component { if (cb) cb(status); }); - closeAllPanels(); + closeTransactionsHistoryPanel(); }; /** @@ -224,7 +224,7 @@ export default class Control extends Component { */ _setProjectActive = project => { this.setState({ activeProject: project }); - this.props.selectProject(project); + this.props.selectProject(project.getInode(), project.getName()); }; /** diff --git a/src/components/projecteditor/control/index.js b/src/components/projecteditor/control/index.js index eb20016d..a26eb0c3 100644 --- a/src/components/projecteditor/control/index.js +++ b/src/components/projecteditor/control/index.js @@ -3,8 +3,8 @@ import { connect } from 'react-redux'; import Control from './control'; import { getAppVersion } from '../../../selectors/app'; import { getSelectedProjectId } from '../../../selectors/projects'; -import { selectProject } from '../../../actions/projects'; -import { closeAllPanels } from '../../../actions/view'; +import { selectProject } from '../../../actions'; +import { closeTransactionsHistoryPanel } from '../../../actions/view'; const mapStateToProps = state => ({ appVersion: getAppVersion(state), @@ -13,11 +13,11 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => { return { - selectProject: project => { - dispatch(selectProject(project)); + selectProject: (id, name) => { + dispatch(selectProject(id, name)); }, - closeAllPanels: () => { - dispatch(closeAllPanels()) + closeTransactionsHistoryPanel: () => { + dispatch(closeTransactionsHistoryPanel()) } }; }; diff --git a/src/components/projecteditor/pane.js b/src/components/projecteditor/pane.js index 0ac6ad54..8ff0de3d 100644 --- a/src/components/projecteditor/pane.js +++ b/src/components/projecteditor/pane.js @@ -135,7 +135,7 @@ export class Pane { } else { this.props.parent.closePane(this.id); } - this.props.parent.redraw(); + // this.props.parent.redraw(); }; focusWindow = (winId, rePerform, cb) => { diff --git a/src/components/projecteditor/panes.js b/src/components/projecteditor/panes.js index 322e9f88..1fe0aecc 100644 --- a/src/components/projecteditor/panes.js +++ b/src/components/projecteditor/panes.js @@ -15,6 +15,8 @@ // along with Superblocks Lab. If not, see . import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import { panesActions } from '../../actions'; import classnames from 'classnames'; import PropTypes from 'prop-types'; import style from './style.less'; @@ -22,7 +24,7 @@ import { Pane, PaneComponent } from './pane'; import { IconClose } from '../icons'; import { DropdownContainer } from '../dropdown'; -export default class Panes extends Component { +class Panes extends Component { constructor(props) { super(props); this.panes = []; @@ -37,7 +39,7 @@ export default class Panes extends Component { } addWindow = (props, paneId) => { - var pane; + var pane, newPaneWasAdded = false; if (paneId) { pane = this.getPane(paneId).pane; } @@ -48,8 +50,12 @@ export default class Panes extends Component { parent: this, }); this.panes.unshift(pane); + newPaneWasAdded = true; } var winId = pane.addWindow(props); + if (newPaneWasAdded) { + this.props.addPane(pane.id, pane.getTitle()); // lifting some state to redux store + } if (winId == null) return {}; return { pane, winId }; }; @@ -69,6 +75,7 @@ export default class Panes extends Component { this.panes = this.panes.filter(pane => { return pane.id != id; }); + this.props.removePane(id); }; getPane = id => { @@ -245,7 +252,9 @@ export default class Panes extends Component { renderHeader = () => { const tab = style.tab; const selected = style.selected; - const html = this.panes.map((pane, index) => { + const html = this.props.panes.map((paneData, index) => { + const pane = this.panes[index]; + const contextMenu = (
@@ -256,7 +265,8 @@ export default class Panes extends Component {
); - var isSelected = pane.id == this.activePaneId; + + var isSelected = paneData.id == this.activePaneId; const cls = {}; cls[tab] = true; cls[selected] = isSelected; @@ -264,8 +274,8 @@ export default class Panes extends Component {
this.tabClicked(e, pane.id)} - onContextMenu={e => this.tabRightClicked(e, pane.id)} + onMouseDown={e => this.tabClicked(e, paneData.id)} + onContextMenu={e => this.tabRightClicked(e, paneData.id)} >
- {pane.getTitle()} + {paneData.name}