import React , { useEffect } from 'react' ; import { useStore , useSelector } from 'react-redux' ; import { getUserInfo } from '@app/redux/reducers/user' ; import { getPostsListById } from '@app/redux/reducers/posts' ; import { refreshPostsListById } from '@app/redux/actions/posts' ; import { loadTips } from '@app/redux/actions/tips' ; import { loadUserInfo } from '@app/redux/actions/user' ; import { getTipsById } from '@app/redux/reducers/tips' ; import './styles/index.scss' ; interface Props { topicId : string ; } export default function ( { topicId } ) { const me = useSelector ( ( state ) => getUserInfo ( state ) ) , hasNew = useSelector ( ( state ) => getTipsById ( state , topicId ) ) , _getPostsListById = useSelector ( ( state ) => getPostsListById ( state , topicId ) ) , store = useStore ( ) , _refreshPostsListById = ( args ) => refreshPostsListById ( args ) ( store . dispatch , store . getState ) , _loadTips = ( ) => loadTips ( ) ( store . dispatch , store . getState ) , _loadUserInfo = ( args ) => loadUserInfo ( args ) ( store . dispatch , store . getState ) ; const start = async function ( ) { if ( ! me ) return null ; let date = me [ `last_find_${ topicId == 'favorite' ? 'subscribe' : topicId }_at` ] || '' ; if ( ! date ) return ; let { data = null } = _getPostsListById || { } ; if ( ! data ) { setTimeout ( async ( ) => { await _loadUserInfo ( { } ) ; _loadTips ( ) ; } , 1000 ) ; } } ; const loadNewPosts = async function ( ) { if ( topicId == 'favorite' || topicId == 'home' ) { await _refreshPostsListById ( topicId ) ; if ( me ) await _loadUserInfo ( { } ) ; _loadTips ( ) ; $ ( 'body,html' ) . animate ( { scrollTop : 0 } , 500 ) ; } } ; const removeTips = function ( ) { store . dispatch ( { type : 'SET_TIPS_BY_ID' , id : topicId , status : false } ) ; } ; useEffect ( ( ) => { start ( ) ; if ( hasNew ) { const obj = FloatFixed ( { id : 'new-tips' , offsetTop : 50 } ) ; return ( ) => { obj . remove ( ) ; } ; } } , [ hasNew ] ) ; if ( ! hasNew ) return null ; return ( < div styleName = "button" > < div id = "new-tips" > < span styleName = "tips" className = "a" onClick = { loadNewPosts } > 有新的动态 < /span> < span styleName = "close" className = "a" onClick = { removeTips } > × < /span> < /div> < /div>); }