Skip to content

Instantly share code, notes, and snippets.

@hong-duc
Created May 23, 2018 01:58
Show Gist options
  • Save hong-duc/7b6ba184f9965ad07782c002ccc99d62 to your computer and use it in GitHub Desktop.
Save hong-duc/7b6ba184f9965ad07782c002ccc99d62 to your computer and use it in GitHub Desktop.
Why my Router.push not do Client-side transitions
import * as React from 'react'
import { connect } from 'react-redux'
import * as FontAwesome from 'react-fontawesome'
import Router from 'next/router'
import ManageTemplatesTable from './ManageTemplatesTable'
import {
getTemplates,
deleteTemplates,
} from '../../store/module/campaign/actions'
import { notify } from '../../store/module/notification/actions'
function mapStateToProps(state) {
// State reducer @ state.form.createTemplate & state.createTemplate
return {
form: state.form.createTemplate,
isPosting: state.createTemplate.isPosting,
templates: state.manageTemplates.templates,
isGetting: state.manageTemplates.isGetting,
}
}
const mapDispatchToProps = { getTemplates, deleteTemplates, notify }
export interface Props {
form?: any
getTemplates: any
templates: any[]
isGetting: boolean
deleteTemplates: any
notify: any
}
export interface State {}
export class ManageTemplatesComponent extends React.Component<Props, State> {
constructor(props) {
super(props)
}
componentDidMount() {
this.props.getTemplates()
}
render() {
return (
<div>
<div className="content-header">
<h1>
Templates
<small>Create and manage your templates</small>
</h1>
</div>
<section className="content">
<div className="box box-primary">
<div className="box-body">
<ManageTemplatesTable
data={this.props.templates}
deleteRows={this.deleteRows}
getTemplateView={this.getTemplateView}
/>
</div>
{this.props.isGetting && (
<div className="overlay">
<FontAwesome name="refresh" spin />
</div>
)}
</div>
</section>
</div>
)
}
deleteRows = templateIds => {
// templateIds [...Numbers]
this.props.deleteTemplates(templateIds, this.props.templates)
}
getTemplateView = row => {
// Send user to the campaign view container
Router.push(
`/templates/manage/&slug=${row.slug}`,
`/templates/manage/${row.slug}`
)
}
}
export default connect(mapStateToProps, mapDispatchToProps)(
ManageTemplatesComponent as any
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment