Skip to content

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor(typescript): containers
Browse files Browse the repository at this point in the history
akameco committed Mar 11, 2019
1 parent 6e6abd0 commit 9f22833
Showing 61 changed files with 583 additions and 582 deletions.
1 change: 1 addition & 0 deletions app/components/A/tests/index.test.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import * as React from 'react'
import { mount } from 'enzyme' // eslint-disable-next-line import/no-unassigned-import

// eslint-disable-next-line import/no-unassigned-import
import 'jest-styled-components'
import A from '..'

7 changes: 4 additions & 3 deletions app/components/AutoLockScroll/index.tsx
Original file line number Diff line number Diff line change
@@ -11,6 +11,8 @@ function getElementBody() {
}

class AutoLockScroll extends React.Component<Props> {
locked: boolean = false

componentDidMount() {
if (this.props.lock === true) {
this.preventScrolling()
@@ -33,8 +35,6 @@ class AutoLockScroll extends React.Component<Props> {
this.allowScrolling()
}

locked: boolean = false

preventScrolling() {
if (this.locked) {
return
@@ -61,8 +61,9 @@ class AutoLockScroll extends React.Component<Props> {
body.style.overflow = originalBodyOverflow || ''
originalBodyOverflow = null
}
} // eslint-disable-next-line class-methods-use-this
}

// eslint-disable-next-line class-methods-use-this
render() {
return null
}
11 changes: 7 additions & 4 deletions app/components/Chip/index.tsx
Original file line number Diff line number Diff line change
@@ -3,10 +3,11 @@ import styled from 'styled-components'
import DeleteIcon from '../Icons/DeleteIcon'

export interface Props {
children?: React.Node | null | undefined
onClick?: Function
onRequestDelete?: Function
children?: React.ReactNode
onClick?: any
onRequestDelete?: any
}

const StyledChip = styled.div`
display: flex;
box-sizing: border-box;
@@ -22,6 +23,7 @@ const StyledChip = styled.div`
vertical-align: baseline;
border-radius: 16px;
`

const InnerChip = styled.span`
color: rgba(0, 0, 0, 0.87);
font-size: 14px;
@@ -32,13 +34,14 @@ const InnerChip = styled.span`
user-select: none;
white-space: nowrap;
`

const icnonStyle = {
cursor: 'pointer',
margin: '4px 4px 0px -8px',
}

class Chip extends React.PureComponent<Props> {
handleRequestDelete = (e: Event) => {
handleRequestDelete = (e: any) => {
e.stopPropagation()

if (this.props.onRequestDelete) {
10 changes: 6 additions & 4 deletions app/components/ColumnHeaderBookmark/index.tsx
Original file line number Diff line number Diff line change
@@ -18,22 +18,23 @@ class ColumnHeaderSetting extends React.PureComponent<Props, State> {
minBookmarks: 0,
}

_sendBookmark = debounce(() => {
this.props.setMinBookmarks(this.state.minBookmarks)
}, 400)

componentWillMount() {
this.setState({
minBookmarks: this.props.minBookmarks,
})
}

handleSlider = (event: Event, value: number) => {
handleSlider = (event: any, value: number) => {
this.setState({
minBookmarks: value,
})

this._sendBookmark()
}
_sendBookmark = debounce(() => {
this.props.setMinBookmarks(this.state.minBookmarks)
}, 400)

render() {
const { minBookmarks } = this.state
@@ -59,4 +60,5 @@ const Wrap = styled.div`
flex-direction: column;
color: #eee;
`

export default ColumnHeaderSetting
Original file line number Diff line number Diff line change
@@ -1,26 +1,24 @@
// @flow
import * as React from 'react'
import { injectIntl, FormattedMessage, type IntlShape } from 'react-intl'
import type { Mode } from 'containers/ColumnRanking/reducer'
import { injectIntl, FormattedMessage, IntlShape } from 'react-intl'
import { Mode } from 'containers/ColumnRanking/reducer'
import rankingMessages from 'containers/ColumnRanking/messages'
import type { R18Mode } from 'containers/ColumnRankingR18/reducer'
import { R18Mode } from 'containers/ColumnRankingR18/reducer'
import rankingR18Messages from 'containers/ColumnRankingR18/messages'
import Card from './Card'
import LinkButton from './LinkButton'
import messages from './messages'
import { Content, Header, Wrap } from './styles'

export type Props = {
addRecommended: () => void,
addBookmark: () => void,
addBookmarkPrivate: () => void,
addFollow: () => void,
addFollowPrivate: () => void,
addHistory: () => void,
addIllustRanking: (mode: Mode) => void,
addIllustR18Ranking: (mode: R18Mode) => void,
export interface Props {
addRecommended: () => undefined
addBookmark: () => undefined
addBookmarkPrivate: () => undefined
addFollow: () => undefined
addFollowPrivate: () => undefined
addHistory: () => undefined
addIllustRanking: (mode: Mode) => undefined
addIllustR18Ranking: (mode: R18Mode) => undefined
}

const rankingMode = [
'day',
'week',
@@ -30,7 +28,6 @@ const rankingMode = [
'week_original',
'week_rookie',
]

const rankingR18Mode = [
'day_r18',
'week_r18',
@@ -39,9 +36,14 @@ const rankingR18Mode = [
'week_r18g',
]

function SelectColumnModal(props: Props & { intl: IntlShape }) {
function SelectColumnModal(
props: Props & {
intl: IntlShape
}
) {
const IllustRankingLinks = rankingMode.map(v => {
const handleClick = () => props.addIllustRanking(v)

return (
<LinkButton
text={props.intl.formatMessage(rankingMessages[v])}
@@ -50,9 +52,9 @@ function SelectColumnModal(props: Props & { intl: IntlShape }) {
/>
)
})

const IllustR18RankingLinks = rankingR18Mode.map(v => {
const handleClick = () => props.addIllustR18Ranking(v)

return (
<LinkButton
text={props.intl.formatMessage(rankingR18Messages[v])}
@@ -61,7 +63,6 @@ function SelectColumnModal(props: Props & { intl: IntlShape }) {
/>
)
})

const {
addBookmark,
addBookmarkPrivate,
@@ -70,7 +71,6 @@ function SelectColumnModal(props: Props & { intl: IntlShape }) {
addHistory,
addRecommended,
} = props

return (
<Wrap>
<Header>
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// @flow
import * as React from 'react'
import styled from 'styled-components'

@@ -16,7 +15,6 @@ const Wrap = styled.div`
background: #fff;
overflow-y: auto;
`

const Title = styled.div`
font-size: 14px;
padding-left: 16px;
@@ -26,7 +24,6 @@ const Title = styled.div`
box-sizing: border-box;
line-height: 40px;
`

const ListWrap = styled.div`
padding: 0;
margin: 0;
@@ -38,8 +35,8 @@ const List = ({ children }: { children?: React.Node }) => (
)

interface Props {
title: string | React.Element<any>;
children?: React.Node;
title: string | React.Element
children?: React.Node
}

const Card = ({ title, children }: Props) => (
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// @flow
import * as React from 'react'
import styled from 'styled-components'

@@ -18,14 +17,12 @@ const Wrap = styled.div`
background-color: rgba(0, 0, 0, 0.098);
}
`

const InnerButton = styled.div`
padding: 10px 16px 10px 17px;
`

interface Props {
text: string | React.Element<any>;
onClick: () => void;
text: string | React.Element
onClick: () => undefined
}

const LinkButton = ({ text, onClick }: Props) => (
Original file line number Diff line number Diff line change
@@ -1,40 +1,46 @@
// @flow
import { connect, type Connector } from 'react-redux'
import type { Dispatch } from 'types'
import { connect, Connector } from 'react-redux'
import { Dispatch } from 'types'
import { addColumn as addRankingColumn } from 'containers/ColumnRanking/actions'
import { addColumn as addRankingR18Column } from 'containers/ColumnRankingR18/actions'
import { addColumn as addBookmarkColumn } from 'containers/ColumnBookmark/actions'
import { addColumn as addFollowColumn } from 'containers/ColumnFollow/actions'
import { addColumn as addRecommendedColumn } from 'containers/ColumnRecommended/actions'
import { addColumnHistory } from 'containers/ColumnHistory/actions'
import type { Mode } from 'containers/ColumnRanking/reducer'
import type { R18Mode } from 'containers/ColumnRankingR18/reducer'
import { Mode } from 'containers/ColumnRanking/reducer'
import { R18Mode } from 'containers/ColumnRankingR18/reducer'
import Modal from './AddColumnModal'
import type { Props } from './AddColumnModal'
import { Props } from './AddColumnModal'

function mapDispatchToProps(dispatch: Dispatch) {
return {
addRecommended() {
dispatch(addRecommendedColumn('recommended'))
},

addHistory() {
dispatch(addColumnHistory())
},

addBookmark() {
dispatch(addBookmarkColumn('public'))
},

addBookmarkPrivate() {
dispatch(addBookmarkColumn('private'))
},

addFollow() {
dispatch(addFollowColumn('public'))
},

addFollowPrivate() {
dispatch(addFollowColumn('private'))
},

addIllustRanking(mode: Mode) {
dispatch(addRankingColumn(mode))
},

addIllustR18Ranking(mode: R18Mode) {
dispatch(addRankingR18Column(mode))
},
@@ -45,5 +51,4 @@ const connector: Connector<{}, Props> = connect(
undefined,
mapDispatchToProps
)

export default connector(Modal)
Original file line number Diff line number Diff line change
@@ -1,15 +1,19 @@
// @flow
import * as React from 'react'
import { FormattedMessage } from 'react-intl'
import Button from 'components/common/Button'
import messages from './messages'

export interface Props {
onClick: () => void;
onClick: () => undefined
}

const AddColumnButton = ({ onClick }: Props) => (
<a style={{ margin: '0 10px' }} onClick={onClick}>
<a
style={{
margin: '0 10px',
}}
onClick={onClick}
>
<Button label={<FormattedMessage {...messages.addColumn} />} />
</a>
)
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
// @flow
import { connect, type Connector } from 'react-redux'
import type { Dispatch } from 'types'
import type { User } from 'types/user'
import { connect, Connector } from 'react-redux'
import { Dispatch } from 'types'
import { User } from 'types/user'
import { addColumn } from '../ColumnUserIllust/actions'
import AddColumnButton, { type Props } from './Button'
import AddColumnButton, { Props } from './Button'

type OP = {
user: User,
interface OP {
user: User
}

const mapDispatchToProps = (dispatch: Dispatch, { user }) => ({
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// @flow
import * as React from 'react'
import MainView from 'components/MainView'
import Table from 'containers/Table'
Original file line number Diff line number Diff line change
@@ -1,10 +1,8 @@
// @flow
import * as React from 'react'
import IconButton from 'material-ui/IconButton'
import FavoriteIcon from 'material-ui/svg-icons/action/favorite'

const iconSize = 18

const styles = {
button: {
width: 32,
@@ -15,13 +13,11 @@ const styles = {
height: iconSize,
},
}

const hoverColor = '#b94343'

export interface Props {
addBookmark: () => void;
deleteBookmark: () => void;
isBookmarked: boolean;
addBookmark: () => undefined
deleteBookmark: () => undefined
isBookmarked: boolean
}

const BookmarkButton = ({
@@ -30,7 +26,6 @@ const BookmarkButton = ({
deleteBookmark,
}: Props) => {
const onClick = isBookmarked ? deleteBookmark : addBookmark

return (
<IconButton onClick={onClick} style={styles.button} iconStyle={styles.icon}>
<FavoriteIcon
Loading

0 comments on commit 9f22833

Please sign in to comment.