add a containers folder and files

This commit is contained in:
Connor Turland 2017-10-25 22:40:40 -04:00
parent 1b2f7717ef
commit 355a0f014e
24 changed files with 157 additions and 61 deletions

View file

@ -4,7 +4,7 @@ import React from 'react'
import ReactDOM from 'react-dom' import ReactDOM from 'react-dom'
import outdent from 'outdent' import outdent from 'outdent'
import ImportDialogBox from '../../routes/MapView/ImportDialogBox' import ImportDialogBox from '../../components/ImportDialogBox'
import PasteInput from '../PasteInput' import PasteInput from '../PasteInput'
import Map from '../Map' import Map from '../Map'

View file

@ -1,7 +1,7 @@
import React, { Component } from 'react' import React, { Component } from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import MapInfoBox from '../routes/MapView/MapInfoBox' import MapInfoBox from './MapInfoBox'
class InfoAndHelp extends Component { class InfoAndHelp extends Component {
static propTypes = { static propTypes = {

View file

@ -1,6 +1,6 @@
import React from 'react' import React from 'react'
import Autolinker from 'autolinker' import Autolinker from 'autolinker'
import Util from '../../../Metamaps/Util' import Util from '../../Metamaps/Util'
const linker = new Autolinker({ newWindow: true, truncate: 50, email: false, phone: false }) const linker = new Autolinker({ newWindow: true, truncate: 50, email: false, phone: false })

View file

@ -4,7 +4,7 @@ import Unread from './Unread'
import Participant from './Participant' import Participant from './Participant'
import Message from './Message' import Message from './Message'
import NewMessage from './NewMessage' import NewMessage from './NewMessage'
import Util from '../../../Metamaps/Util' import Util from '../../Metamaps/Util'
function makeList(messages) { function makeList(messages) {
let currentHeader let currentHeader

View file

@ -0,0 +1,5 @@
import { connect } from 'react-redux'
import { mapStateToProps, mapDispatchToProps } from './UpperOptions.store'
import UpperOptions from '../components/UpperOptions'
export default connect(mapStateToProps, mapDispatchToProps)(UpperOptions)

View file

@ -0,0 +1,24 @@
// import { } from '../actions'
export const mapStateToProps = (state, ownProps) => {
return {
map: ownProps.map,
currentUser: ownProps.currentUser,
openImportLightbox: ownProps.openImportLightbox,
forkMap: ownProps.forkMap,
canEditMap: ownProps.canEditMap,
filterData: ownProps.filterData,
allForFiltering: ownProps.allForFiltering,
visibleForFiltering: ownProps.visibleForFiltering,
toggleMetacode: ownProps.toggleMetacode,
toggleMapper: ownProps.toggleMapper,
toggleSynapse: ownProps.toggleSynapse,
filterAllMetacodes: ownProps.filterAllMetacodes,
filterAllMappers: ownProps.filterAllMappers,
filterAllSynapses: ownProps.filterAllSynapses
}
}
export const mapDispatchToProps = (dispatch, ownProps) => {
return {}
}

View file

@ -0,0 +1,5 @@
import { connect } from 'react-redux'
import { mapStateToProps, mapDispatchToProps } from './InfoAndHelp.store'
import InfoAndHelp from '../components/InfoAndHelp'
export default connect(mapStateToProps, mapDispatchToProps)(InfoAndHelp)

View file

@ -0,0 +1,18 @@
// import { } from '../actions'
export const mapStateToProps = (state, ownProps) => {
return {
mapIsStarred: ownProps.mapIsStarred,
currentUser: ownProps.currentUser,
map: ownProps.map,
onInfoClick: ownProps.toggleMapInfoBox,
onMapStar: ownProps.onMapStar,
onMapUnstar: ownProps.onMapUnstar,
onHelpClick: ownProps.openHelpLightbox,
infoBoxHtml: ownProps.infoBoxHtml
}
}
export const mapDispatchToProps = (dispatch, ownProps) => {
return {}
}

View file

@ -0,0 +1,5 @@
import { connect } from 'react-redux'
import { mapStateToProps, mapDispatchToProps } from './TopicCard.store'
import TopicCard from '../components/TopicCard'
export default connect(mapStateToProps, mapDispatchToProps)(TopicCard)

View file

@ -0,0 +1,24 @@
// import { } from '../actions'
export const mapStateToProps = (state, ownProps) => {
return {
map: ownProps.map,
currentUser: ownProps.currentUser,
openImportLightbox: ownProps.openImportLightbox,
forkMap: ownProps.forkMap,
canEditMap: ownProps.canEditMap,
filterData: ownProps.filterData,
allForFiltering: ownProps.allForFiltering,
visibleForFiltering: ownProps.visibleForFiltering,
toggleMetacode: ownProps.toggleMetacode,
toggleMapper: ownProps.toggleMapper,
toggleSynapse: ownProps.toggleSynapse,
filterAllMetacodes: ownProps.filterAllMetacodes,
filterAllMappers: ownProps.filterAllMappers,
filterAllSynapses: ownProps.filterAllSynapses
}
}
export const mapDispatchToProps = (dispatch, ownProps) => {
return {}
}

View file

@ -0,0 +1,5 @@
import { connect } from 'react-redux'
import { mapStateToProps, mapDispatchToProps } from './UpperOptions.store'
import UpperOptions from '../components/UpperOptions'
export default connect(mapStateToProps, mapDispatchToProps)(UpperOptions)

View file

@ -0,0 +1,24 @@
// import { } from '../actions'
export const mapStateToProps = (state, ownProps) => {
return {
map: ownProps.map,
currentUser: ownProps.currentUser,
openImportLightbox: ownProps.openImportLightbox,
forkMap: ownProps.forkMap,
canEditMap: ownProps.canEditMap,
filterData: ownProps.filterData,
allForFiltering: ownProps.allForFiltering,
visibleForFiltering: ownProps.visibleForFiltering,
toggleMetacode: ownProps.toggleMetacode,
toggleMapper: ownProps.toggleMapper,
toggleSynapse: ownProps.toggleSynapse,
filterAllMetacodes: ownProps.filterAllMetacodes,
filterAllMappers: ownProps.filterAllMappers,
filterAllSynapses: ownProps.filterAllSynapses
}
}
export const mapDispatchToProps = (dispatch, ownProps) => {
return {}
}

View file

@ -0,0 +1,5 @@
import { connect } from 'react-redux'
import { mapStateToProps, mapDispatchToProps } from './VisualizationControls.store'
import VisualizationControls from '../components/VisualizationControls'
export default connect(mapStateToProps, mapDispatchToProps)(VisualizationControls)

View file

@ -0,0 +1,15 @@
// import { } from '../actions'
export const mapStateToProps = (state, ownProps) => {
return {
topic: ownProps.topic,
map: ownProps.map,
onClickZoomExtents: ownProps.onZoomExtents,
onClickZoomIn: ownProps.onZoomIn,
onClickZoomOut: ownProps.onZoomOut
}
}
export const mapDispatchToProps = (dispatch, ownProps) => {
return {}
}

View file

@ -1,14 +1,15 @@
import React, { Component } from 'react' import React, { Component } from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import ContextMenu from '../../components/ContextMenu' import UpperOptions from '../../containers/UpperOptions'
import InfoAndHelp from '../../containers/InfoAndHelp'
import VisualizationControls from '../../containers/VisualizationControls'
import ContextMenu from '../../containers/ContextMenu'
import TopicCard from '../../containers/TopicCard'
import Instructions from '../../components/Instructions'
import MapChat from '../../components/MapChat'
import MapVis from '../../components/MapVis' import MapVis from '../../components/MapVis'
import UpperOptions from '../../components/UpperOptions'
import InfoAndHelp from '../../components/InfoAndHelp'
import Instructions from './Instructions'
import VisualizationControls from '../../components/VisualizationControls'
import MapChat from './MapChat'
import TopicCard from '../../components/TopicCard'
export default class MapView extends Component { export default class MapView extends Component {
@ -53,6 +54,7 @@ export default class MapView extends Component {
endMap() { endMap() {
this.props.closeChat() this.props.closeChat()
this.mapChat.reset() this.mapChat.reset()
// TODO: fix upperOptions ref
this.upperOptions.reset() this.upperOptions.reset()
this.props.endActiveMap() this.props.endActiveMap()
} }
@ -80,38 +82,14 @@ export default class MapView extends Component {
const canEditMap = map && map.authorizeToEdit(currentUser) const canEditMap = map && map.authorizeToEdit(currentUser)
// TODO: stop using {...this.props} and make explicit // TODO: stop using {...this.props} and make explicit
return <div className="mapWrapper"> return <div className="mapWrapper">
<UpperOptions ref={x => this.upperOptions = x} <UpperOptions ref={x => this.upperOptions = x} {...this.props} />
map={map}
currentUser={currentUser}
onImportClick={openImportLightbox}
onForkClick={forkMap}
canEditMap={canEditMap}
filterData={filterData}
allForFiltering={allForFiltering}
visibleForFiltering={visibleForFiltering}
toggleMetacode={toggleMetacode}
toggleMapper={toggleMapper}
toggleSynapse={toggleSynapse}
filterAllMetacodes={filterAllMetacodes}
filterAllMappers={filterAllMappers}
filterAllSynapses={filterAllSynapses} />
<MapVis map={map} DataModel={DataModel} /> <MapVis map={map} DataModel={DataModel} />
{openTopic && <TopicCard {...this.props} />} {openTopic && <TopicCard {...this.props} />}
{contextMenu && <ContextMenu {...this.props} />} {contextMenu && <ContextMenu {...this.props} />}
{currentUser && <Instructions mobile={mobile} hasLearnedTopicCreation={hasLearnedTopicCreation} />} {currentUser && <Instructions mobile={mobile} hasLearnedTopicCreation={hasLearnedTopicCreation} />}
{currentUser && <MapChat {...this.props} onOpen={openChat} onClose={closeChat} chatOpen={chatIsOpen} ref={x => this.mapChat = x} />} {currentUser && <MapChat {...this.props} onOpen={openChat} onClose={closeChat} chatOpen={chatIsOpen} ref={x => this.mapChat = x} />}
<VisualizationControls map={map} <VisualizationControls {...this.props} />
onClickZoomExtents={onZoomExtents} <InfoAndHelp {...this.props} />
onClickZoomIn={onZoomIn}
onClickZoomOut={onZoomOut} />
<InfoAndHelp mapIsStarred={mapIsStarred}
currentUser={currentUser}
map={map}
onInfoClick={toggleMapInfoBox}
onMapStar={onMapStar}
onMapUnstar={onMapUnstar}
onHelpClick={openHelpLightbox}
infoBoxHtml={infoBoxHtml} />
</div> </div>
} }
} }

View file

@ -1,5 +1,5 @@
import { connect } from 'react-redux' import { connect } from 'react-redux'
import { mapStateToProps, mapDispatchToProps } from './store' import { mapStateToProps, mapDispatchToProps } from './MapView.store'
import MapView from './MapView' import MapView from './MapView'
export default connect(mapStateToProps, mapDispatchToProps)(MapView) export default connect(mapStateToProps, mapDispatchToProps)(MapView)

View file

@ -1,12 +1,13 @@
import React, { Component } from 'react' import React, { Component } from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import ContextMenu from '../components/ContextMenu' import ContextMenu from '../containers/ContextMenu'
import UpperOptions from '../containers/UpperOptions'
import InfoAndHelp from '../containers/InfoAndHelp'
import VisualizationControls from '../containers/VisualizationControls'
import TopicCard from '../containers/TopicCard'
import TopicVis from '../components/TopicVis' import TopicVis from '../components/TopicVis'
import UpperOptions from '../components/UpperOptions'
import InfoAndHelp from '../components/InfoAndHelp'
import VisualizationControls from '../components/VisualizationControls'
import TopicCard from '../components/TopicCard'
export default class TopicView extends Component { export default class TopicView extends Component {
@ -38,6 +39,7 @@ export default class TopicView extends Component {
} }
endTopic() { endTopic() {
// TODO: fix upperOptions ref
this.upperOptions.reset() this.upperOptions.reset()
this.props.endActiveTopic() this.props.endActiveTopic()
} }
@ -60,26 +62,12 @@ export default class TopicView extends Component {
openHelpLightbox, onZoomIn, onZoomOut, contextMenu } = this.props openHelpLightbox, onZoomIn, onZoomOut, contextMenu } = this.props
// TODO: stop using {...this.props} and make explicit // TODO: stop using {...this.props} and make explicit
return <div className="topicWrapper"> return <div className="topicWrapper">
<UpperOptions ref={x => this.upperOptions = x} <UpperOptions ref={x => this.upperOptions = x} {...this.props} />
currentUser={currentUser}
topic={topic}
onForkClick={forkMap}
filterData={filterData}
allForFiltering={allForFiltering}
visibleForFiltering={visibleForFiltering}
toggleMetacode={toggleMetacode}
toggleMapper={toggleMapper}
toggleSynapse={toggleSynapse}
filterAllMetacodes={filterAllMetacodes}
filterAllMappers={filterAllMappers}
filterAllSynapses={filterAllSynapses} />
<TopicVis /> <TopicVis />
<TopicCard {...this.props} /> <TopicCard {...this.props} />
{contextMenu && <ContextMenu {...this.props} />} {contextMenu && <ContextMenu {...this.props} />}
<VisualizationControls onClickZoomIn={onZoomIn} <VisualizationControls {...this.props} />
onClickZoomOut={onZoomOut} /> <InfoAndHelp {...this.props} />
<InfoAndHelp topic={topic}
onHelpClick={openHelpLightbox} />
</div> </div>
} }
} }