-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Refactor AppReminder to NewsPopup (golos_news)
- Loading branch information
1 parent
8553fc3
commit 47d5c9e
Showing
6 changed files
with
228 additions
and
18 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,199 @@ | ||
| import React from 'react' | ||
| import tt from 'counterpart' | ||
| import { connect } from 'react-redux' | ||
| import { api } from 'golos-lib-js' | ||
|
|
||
| import CloseButton from 'react-foundation-components/lib/global/close-button' | ||
|
|
||
| import user from 'app/redux/User' | ||
|
|
||
| const APP_REMINDER_INTERVAL = 60*24*60*60*1000 | ||
|
|
||
| const MAX_NEWS_PER_TIME = 2 | ||
|
|
||
| const shuffleArray = (arr) => { | ||
| arr.sort(() => 0.5 - Math.random()) | ||
| } | ||
|
|
||
| class NewsPopups extends React.Component { | ||
| state = { | ||
| hidden: false, | ||
| hiddenNews: [] | ||
| } | ||
|
|
||
| checkNews = async () => { | ||
| if (typeof(localStorage) === 'undefined') { | ||
| this.setState({ news: [] }) | ||
| return | ||
| } | ||
| try { | ||
| let news_read = localStorage.getItem('news_read_wlt') || '' | ||
| news_read = news_read.split(',') | ||
| const { golos_news: { accounts } } = $STM_Config | ||
| if (accounts) { | ||
| let news_to_load = [] | ||
| for (const [acc, opts] of Object.entries(accounts)) { | ||
| if (!opts) continue | ||
|
|
||
| let entries = await api.getBlogEntriesAsync(acc, 0, 5, ['fm-'], {}) | ||
| shuffleArray(entries) | ||
|
|
||
| let count = 0 | ||
| for (const post of entries) { | ||
| const { author, hashlink, reblog_on } = post | ||
| if (reblog_on.startsWith('19')) continue | ||
|
|
||
| if (news_read.includes(hashlink) || count > 0) { | ||
| continue | ||
| } | ||
| ++count | ||
| news_to_load.push({ | ||
| author, | ||
| hashlink | ||
| }) | ||
| } | ||
|
|
||
| if (news_to_load.length > MAX_NEWS_PER_TIME) { | ||
| shuffleArray(news_to_load) | ||
| news_to_load = news_to_load.slice(0, MAX_NEWS_PER_TIME) | ||
| } | ||
| } | ||
| if (news_to_load.length) { | ||
| const news = await api.getContentPreviewsAsync(news_to_load) | ||
| this.setState({ | ||
| news | ||
| }) | ||
| return | ||
| } | ||
| } | ||
| this.setState({ | ||
| news: [] | ||
| }) | ||
| } catch (err) { | ||
| console.error('NewsPopups', err) | ||
| this.setState({ | ||
| news: [] | ||
| }) | ||
| } | ||
| } | ||
|
|
||
| componentDidMount() { | ||
| this.checkNews() | ||
| } | ||
|
|
||
| hideMe = (i) => { | ||
| if (i) { | ||
| let { hiddenNews } = this.state | ||
| hiddenNews = [...hiddenNews] | ||
| hiddenNews.push(i) | ||
| this.setState({ | ||
| hiddenNews | ||
| }) | ||
| let news_read = localStorage.getItem('news_read_wlt') || '' | ||
| news_read = news_read.split(',') | ||
| news_read.push(i) | ||
| localStorage.setItem('news_read_wlt', news_read.join(',')) | ||
| return | ||
| } | ||
| const now = Date.now() | ||
| localStorage.setItem('app_reminder', now) | ||
| this.setState({ | ||
| hidden: true | ||
| }) | ||
| } | ||
|
|
||
| openNew = (e, i, url) => { | ||
| e.preventDefault() | ||
| this.hideMe(i) | ||
| window.open(url, '_blank') | ||
| } | ||
|
|
||
| showModal = (e) => { | ||
| e.preventDefault() | ||
| this.props.showModal() | ||
| this.hideMe() | ||
| } | ||
|
|
||
| showAppReminder = () => { | ||
| if (process.env.IS_APP || typeof(localStorage) === 'undefined') { | ||
| return false | ||
| } | ||
| const now = Date.now() | ||
| let reminded = localStorage.getItem('app_reminder') || 0 | ||
| reminded = parseInt(reminded) | ||
| return !reminded || (now - reminded > APP_REMINDER_INTERVAL) | ||
| } | ||
|
|
||
| render() { | ||
| const { news,hiddenNews } = this.state | ||
|
|
||
| let appReminder = null | ||
| if (news && this.showAppReminder() && !this.state.hidden) { | ||
| appReminder = <span className='NewsPopups callout primary' onClick={this.showModal}> | ||
| <CloseButton | ||
| onClick={(e) => { | ||
| e.stopPropagation() | ||
| this.hideMe() | ||
| }} | ||
| /> | ||
| {tt('app_reminder.text')} | ||
| </span> | ||
| } | ||
|
|
||
| let newItems = [] | ||
| if (news) { | ||
| let newCount = 0 | ||
| for (const ne of news) { | ||
| if (hiddenNews.includes(ne.hashlink)) { | ||
| continue | ||
| } | ||
| newCount++ | ||
| } | ||
| newCount -= 1 | ||
| for (const ne of news) { | ||
| if (hiddenNews.includes(ne.hashlink)) { | ||
| continue | ||
| } | ||
| let title = ne.title | ||
| if (title.length > 100) { | ||
| title = title.substring(0, 100) + '...' | ||
| } | ||
| let bottom = newCount * 65 | ||
| if (appReminder) { | ||
| bottom += 65 | ||
| } else { | ||
| bottom += 2 | ||
| } | ||
| newItems.push(<a key={ne.hashlink} href={ne.url} onClick={e => this.openNew(e, ne.hashlink, ne.url)} target='_blank' rel='noopener noreferrer nofollow'> | ||
| <span style={{ bottom: bottom + 'px' }} className='NewsPopups callout primary'> | ||
| <CloseButton | ||
| onClick={(e) => { | ||
| e.stopPropagation() | ||
| e.preventDefault() | ||
| this.hideMe(ne.hashlink) | ||
| }} | ||
| /> | ||
| {title} | ||
| </span> | ||
| </a>) | ||
| --newCount | ||
| } | ||
| } | ||
|
|
||
| return <div> | ||
| {appReminder} | ||
| {newItems} | ||
| </div> | ||
| } | ||
| } | ||
|
|
||
| export default connect( | ||
| state => { | ||
| return {} | ||
| }, | ||
| dispatch => ({ | ||
| showModal: () => { | ||
| dispatch(user.actions.showAppDownload()) | ||
| } | ||
| }) | ||
| )(NewsPopups) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| .NewsPopups { | ||
| @include themify($themes) { | ||
| background-color: themed('modalReminder') !important; | ||
| } | ||
| color: #333; | ||
| border-radius: 5px; | ||
| position: fixed; | ||
| left: 20px; | ||
| bottom: 1px; | ||
| padding-right: 5rem; | ||
| cursor: pointer; | ||
|
|
||
| .close-button { | ||
| margin-top: 4px; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters