javascript IsAuthenticated w / PropTypes的比较

Posted 2021-05-03

import PropTypes from 'prop-types'
import React from 'react'
import { ReduxConnection } from '@ghadyani-framework/redux-components'

import { authInfoSelector } from '~/redux/auth/selectors'

const propTypes = {
  children: PropTypes.node.isRequired,
}

const IsAuthenticated = ({
  children,
}) => (
  <ReduxConnection selector={authInfoSelector}>
    {({
      hasReceivedAuthInfo,
      isAuthenticated,
    }) => (
      hasReceivedAuthInfo
      && isAuthenticated
      && children
    )}
  </ReduxConnection>
)

IsAuthenticated
.propTypes = propTypes

export default IsAuthenticated

import PropTypes from 'prop-types'
import React from 'react'
import { connect } from 'react-redux'

import { authInfoSelector } from '~/redux/auth/selectors'

const propTypes = {
  children: PropTypes.node.isRequired,
  hasReceivedAuthInfo: PropTypes.bool.isRequired,
  isAuthenticated: PropTypes.bool.isRequired,
}

export const IsAuthenticated = ({
  children,
  hasReceivedAuthInfo,
  isAuthenticated,
}) => ({
  hasReceivedAuthInfo
  && isAuthenticated
  && children
)

IsAuthenticated
.propTypes = propTypes

export default (
  connect(
    authInfoSelector
  )(
    IsAuthenticated
  )
)