refactor controls out of NarrativeCard

This commit is contained in:
Lachlan Kermode
2019-01-08 16:59:42 +00:00
parent 002447e707
commit 51d7dd8191
5 changed files with 78 additions and 45 deletions

View File

@@ -2,35 +2,34 @@ import React from 'react'
import { connect } from 'react-redux'
import { selectActiveNarrative } from '../../selectors'
function NarrativeCard ({ narrative, methods }) {
const { onSelectNarrative, onNext, onPrev } = methods
function renderClose() {
return (
<button
className='side-menu-burg is-active'
onClick={() => { onSelectNarrative(null) }}
>
<span></span>
</button>
)
}
function NarrativeCard ({ narrative }) {
// function renderClose() {
// return (
// <button
// className='side-menu-burg is-active'
// onClick={() => { onSelectNarrative(null) }}
// >
// <span></span>
// </button>
// )
// }
function _renderActions(current, steps) {
const prevExists = current !== 0
const nextExists = current < steps.length - 1
return (
<div className='actions'>
<div
className={`${prevExists ? '' : 'disabled'} action`}
onClick={prevExists ? onPrev : null}>&larr;
</div>
<div
className={`${nextExists ? '' : 'disabled'} action`}
onClick={nextExists ? onNext : null}>&rarr;
</div>
</div>
)
}
// function _renderActions(current, steps) {
// const prevExists = current !== 0
// const nextExists = current < steps.length - 1
// return (
// <div className='actions'>
// <div
// className={`${prevExists ? '' : 'disabled'} action`}
// onClick={prevExists ? onPrev : null}>&larr;
// </div>
// <div
// className={`${nextExists ? '' : 'disabled'} action`}
// onClick={nextExists ? onNext : null}>&rarr;
// </div>
// </div>
// )
// }
// no display if no narrative
if (!narrative) return null

View File

@@ -0,0 +1,40 @@
import React from 'react'
import NarrativeCard from './NarrativeCard'
export default ({ narrative, methods }) => {
// function renderClose() {
// return (
// <button
// className='side-menu-burg is-active'
// onClick={() => { onSelectNarrative(null) }}
// >
// <span></span>
// </button>
// )
// }
// function _renderActions(current, steps) {
// const prevExists = current !== 0
// const nextExists = current < steps.length - 1
// return (
// <div className='actions'>
// <div
// className={`${prevExists ? '' : 'disabled'} action`}
// onClick={prevExists ? onPrev : null}>&larr;
// </div>
// <div
// className={`${nextExists ? '' : 'disabled'} action`}
// onClick={nextExists ? onNext : null}>&rarr;
// </div>
// </div>
// )
// }
return (
<React.Fragment>
<NarrativeCard narrative={narrative} />
</React.Fragment>
)
}