[Glitch] Add header to trends section and change refresh rate to 15 minutes
Port 4ef8d8b77c596680be13b26400bc2a09038928de to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
This commit is contained in:
		
							parent
							
								
									12c188f533
								
							
						
					
					
						commit
						ce182efd68
					
				| @ -3,6 +3,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; | |||||||
| import PropTypes from 'prop-types'; | import PropTypes from 'prop-types'; | ||||||
| import ImmutablePropTypes from 'react-immutable-proptypes'; | import ImmutablePropTypes from 'react-immutable-proptypes'; | ||||||
| import Hashtag from 'flavours/glitch/components/hashtag'; | import Hashtag from 'flavours/glitch/components/hashtag'; | ||||||
|  | import { FormattedMessage } from 'react-intl'; | ||||||
| 
 | 
 | ||||||
| export default class Trends extends ImmutablePureComponent { | export default class Trends extends ImmutablePureComponent { | ||||||
| 
 | 
 | ||||||
| @ -17,7 +18,7 @@ export default class Trends extends ImmutablePureComponent { | |||||||
| 
 | 
 | ||||||
|   componentDidMount () { |   componentDidMount () { | ||||||
|     this.props.fetchTrends(); |     this.props.fetchTrends(); | ||||||
|     this.refreshInterval = setInterval(() => this.props.fetchTrends(), 3600000); |     this.refreshInterval = setInterval(() => this.props.fetchTrends(), 900 * 1000); | ||||||
|   } |   } | ||||||
| 
 | 
 | ||||||
|   componentWillUnmount () { |   componentWillUnmount () { | ||||||
| @ -35,6 +36,8 @@ export default class Trends extends ImmutablePureComponent { | |||||||
| 
 | 
 | ||||||
|     return ( |     return ( | ||||||
|       <div className='getting-started__trends'> |       <div className='getting-started__trends'> | ||||||
|  |         <h4><FormattedMessage id='trends.trending_now' defaultMessage='Trending now' /></h4> | ||||||
|  | 
 | ||||||
|         {trends.take(3).map(hashtag => <Hashtag key={hashtag.get('name')} hashtag={hashtag} />)} |         {trends.take(3).map(hashtag => <Hashtag key={hashtag.get('name')} hashtag={hashtag} />)} | ||||||
|       </div> |       </div> | ||||||
|     ); |     ); | ||||||
|  | |||||||
| @ -915,6 +915,15 @@ | |||||||
|     animation: fade 150ms linear; |     animation: fade 150ms linear; | ||||||
|     margin-top: 10px; |     margin-top: 10px; | ||||||
| 
 | 
 | ||||||
|  |     h4 { | ||||||
|  |       font-size: 12px; | ||||||
|  |       text-transform: uppercase; | ||||||
|  |       color: $darker-text-color; | ||||||
|  |       padding: 10px; | ||||||
|  |       font-weight: 500; | ||||||
|  |       border-bottom: 1px solid lighten($ui-base-color, 8%); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|     @media screen and (max-height: 810px) { |     @media screen and (max-height: 810px) { | ||||||
|       .trends__item:nth-child(3) { |       .trends__item:nth-child(3) { | ||||||
|         display: none; |         display: none; | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user