Updated explore page functionality

• Updated:
- explore page functionality
This commit is contained in:
mgabdev 2020-09-14 20:20:27 -05:00
parent 86e3d3aaf2
commit 12c9cf2083
6 changed files with 315 additions and 2 deletions

View File

@ -0,0 +1,179 @@
# frozen_string_literal: true
class Api::V1::Timelines::ExploreController < Api::BaseController
before_action :set_sort_type
before_action :set_statuses
after_action :insert_pagination_headers, unless: -> {
@statuses.empty?
}
def show
if current_user
render json: @statuses,
each_serializer: REST::StatusSerializer,
relationships: StatusRelationshipsPresenter.new(@statuses, current_user.account_id)
else
render json: @statuses, each_serializer: REST::StatusSerializer
end
end
private
def set_sort_type
@sort_type = 'newest'
@sort_type = params[:sort_by] if [
'hot',
'newest',
'recent',
'top_today',
'top_weekly',
'top_monthly',
'top_yearly',
'top_all_time',
].include? params[:sort_by]
return @sort_type
end
def set_statuses
@statuses = cached_explore_statuses
end
def cached_explore_statuses
cache_collection explore_statuses, Status
end
def explore_statuses
statuses = nil
date_limit = 30.days.ago
top_order = 'status_stats.favourites_count DESC, status_stats.reblogs_count DESC, status_stats.replies_count DESC'
if @sort_type == 'hot'
# : todo :
# unique groups
# unique users
date_limit = 8.hours.ago
elsif @sort_type == 'top_today'
date_limit = 24.hours.ago
elsif @sort_type == 'top_weekly'
date_limit = 7.days.ago
elsif @sort_type == 'top_monthly'
date_limit = 30.days.ago
elsif @sort_type == 'top_yearly'
date_limit = 1.year.ago
end
if current_account
if @sort_type == 'newest'
statuses = Status.with_public_visibility.where(
reply: false
).paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
).reject { |status| FeedManager.instance.filter?(:home, status, current_account.id) }
elsif @sort_type == 'recent'
statuses = Status.with_public_visibility.where(
reply: false
).joins(:status_stat).where(
'status_stats.replies_count > 0 OR status_stats.reblogs_count > 0 OR status_stats.favourites_count > 0'
).order('status_stats.updated_at DESC').paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
).reject { |status| FeedManager.instance.filter?(:home, status, current_account.id) }
elsif ['top_today', 'top_weekly', 'top_monthly', 'top_yearly', 'top_all_time', 'hot'].include? @sort_type
if @sort_type == 'top_all_time'
statuses = Status.unscoped.with_public_visibility.where(
reply: false
).joins(:status_stat).order(top_order)
.paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
).reject { |status| FeedManager.instance.filter?(:home, status, current_account.id) }
elsif @sort_type == 'hot'
statuses = Status.unscoped.with_public_visibility.where(
reply: false
).where(
'statuses.created_at > ?', date_limit
).joins(:status_stat).order(top_order).paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
).reject { |status| FeedManager.instance.filter?(:home, status, current_account.id) }
else
statuses = Status.unscoped.with_public_visibility.where(
reply: false
).where(
'statuses.created_at > ?', date_limit
).joins(:status_stat).order(top_order).paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
).reject { |status| FeedManager.instance.filter?(:home, status, current_account.id) }
end
end
else
if @sort_type == 'newest'
statuses = Status.with_public_visibility.where(
reply: false
).paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
)
elsif @sort_type == 'recent'
statuses = Status.with_public_visibility.where(
reply: false
).joins(:status_stat).where(
'status_stats.replies_count > 0 OR status_stats.reblogs_count > 0 OR status_stats.favourites_count > 0'
).order('status_stats.updated_at DESC').paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
)
elsif ['top_today', 'top_weekly', 'top_monthly', 'top_yearly', 'top_all_time', 'hot'].include? @sort_type
if @sort_type == 'top_all_time'
statuses = Status.unscoped.with_public_visibility.where(
reply: false
).joins(:status_stat).order(top_order)
.paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
)
else
statuses = Status.unscoped.with_public_visibility.where(
reply: false
).where(
'statuses.created_at > ?', date_limit
).joins(:status_stat).order(top_order).paginate_by_id(
limit_param(DEFAULT_STATUSES_LIMIT),
params_slice(:max_id, :since_id, :min_id)
)
end
end
end
statuses
end
def insert_pagination_headers
set_pagination_headers(next_path, prev_path)
end
def pagination_params(core_params)
params.slice(:limit).permit(:limit).merge(core_params)
end
def next_path
api_v1_timelines_explore_url params[:id], pagination_params(max_id: pagination_max_id)
end
def prev_path
api_v1_timelines_explore_url params[:id], pagination_params(min_id: pagination_since_id)
end
def pagination_max_id
@statuses.last.id
end
def pagination_since_id
@statuses.first.id
end
end

View File

@ -166,6 +166,7 @@ export function expandTimeline(timelineId, path, params = {}, done = noOp) {
};
export const expandHomeTimeline = ({ maxId } = {}, done = noOp) => expandTimeline('home', '/api/v1/timelines/home', { max_id: maxId }, done);
export const expandExploreTimeline = ({ maxId, sortBy } = {}, done = noOp) => expandTimeline('explore', '/api/v1/timelines/explore', { max_id: maxId, sort_by: sortBy }, done);
export const expandProTimeline = ({ maxId } = {}, done = noOp) => expandTimeline('pro', '/api/v1/timelines/pro', { max_id: maxId }, done);
export const expandCommunityTimeline = ({ maxId, onlyMedia } = {}, done = noOp) => expandTimeline(`community${onlyMedia ? ':media' : ''}`, '/api/v1/timelines/public', { max_id: maxId, only_media: !!onlyMedia }, done);
export const expandAccountTimeline = (accountId, { maxId, withReplies, commentsOnly } = {}) => expandTimeline(`account:${accountId}${withReplies ? ':with_replies' : ''}${commentsOnly ? ':comments_only' : ''}`, `/api/v1/accounts/${accountId}/statuses`, { only_comments: commentsOnly, exclude_replies: (!withReplies && !commentsOnly), max_id: maxId });

View File

@ -0,0 +1,130 @@
import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { injectIntl, defineMessages } from 'react-intl'
import { List as ImmutableList } from 'immutable'
import { me } from '../initial_state'
import {
clearTimeline,
expandExploreTimeline,
} from '../actions/timelines'
import {
setGroupTimelineSort,
} from '../actions/groups'
import {
GROUP_TIMELINE_SORTING_TYPE_HOT,
GROUP_TIMELINE_SORTING_TYPE_NEWEST,
} from '../constants'
import getSortBy from '../utils/group_sort_by'
import Text from '../components/text'
import StatusList from '../components/status_list'
import GroupSortBlock from '../components/group_sort_block'
class ExploreTimeline extends React.PureComponent {
state = {
//keep track of loads for if no user,
//only allow 2 loads before showing sign up msg
loadCount: 0,
}
componentDidMount() {
const {
sortByValue,
sortByTopValue,
} = this.props
if (sortByValue !== GROUP_TIMELINE_SORTING_TYPE_HOT) {
this.props.setFeaturedTop()
} else {
const sortBy = getSortBy(sortByValue, sortByTopValue)
this.props.onExpandExploreTimeline({ sortBy })
}
}
componentDidUpdate(prevProps) {
if (prevProps.sortByValue !== this.props.sortByValue ||
prevProps.sortByTopValue !== this.props.sortByTopValue) {
this.props.onClearTimeline('explore')
this.handleLoadMore()
}
}
handleLoadMore = (maxId) => {
const {
sortByValue,
sortByTopValue,
} = this.props
const { loadCount } = this.state
if (!!maxId && !me) {
this.setState({ loadCount: this.state.loadCount + 1 })
if (loadCount >= 2) return false
} else if (!maxId && loadCount !== 0) {
this.setState({ loadCount: 0 })
}
const sortBy = getSortBy(sortByValue, sortByTopValue)
const options = { sortBy, maxId }
this.props.onExpandExploreTimeline(options)
}
render() {
const { intl } = this.props
const { loadCount } = this.state
const canLoadMore = loadCount < 2 && !me || !!me
return (
<React.Fragment>
<GroupSortBlock collectionType='featured' />
<StatusList
scrollKey='explore-timeline'
timelineId='explore'
onLoadMore={canLoadMore ? this.handleLoadMore : undefined}
emptyMessage={intl.formatMessage(messages.empty)}
/>
</React.Fragment>
)
}
}
const messages = defineMessages({
empty: { id: 'empty_column.group_collection_timeline', defaultMessage: 'There are no gabs to display.' },
})
const mapStateToProps = (state) => ({
sortByValue: state.getIn(['group_lists', 'sortByValue']),
sortByTopValue: state.getIn(['group_lists', 'sortByTopValue']),
})
const mapDispatchToProps = (dispatch) => ({
onClearTimeline(timeline) {
dispatch(clearTimeline(timeline))
},
onExpandExploreTimeline(options) {
dispatch(expandExploreTimeline(options))
},
setFeaturedTop() {
dispatch(setGroupTimelineSort(GROUP_TIMELINE_SORTING_TYPE_HOT))
},
setMemberNewest() {
dispatch(setGroupTimelineSort(GROUP_TIMELINE_SORTING_TYPE_NEWEST))
},
})
ExploreTimeline.propTypes = {
params: PropTypes.object.isRequired,
onClearTimeline: PropTypes.func.isRequired,
onExpandExploreTimeline: PropTypes.func.isRequired,
setFeaturedTop: PropTypes.func.isRequired,
setMemberNewest: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
sortByValue: PropTypes.string.isRequired,
sortByTopValue: PropTypes.string,
hasStatuses: PropTypes.bool.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(ExploreTimeline))

View File

@ -56,6 +56,7 @@ import {
CommunityTimeline,
Compose,
DMCA,
ExploreTimeline,
// Filters,
Followers,
Following,
@ -170,7 +171,7 @@ class SwitchingArea extends React.PureComponent {
}
{
!me &&
<WrappedRoute path='/' exact publicRoute page={ExplorePage} component={GroupCollectionTimeline} content={children} componentParams={{ title: 'Gab.com', collectionType: 'featured' }} />
<WrappedRoute path='/' exact publicRoute page={ExplorePage} component={ExploreTimeline} content={children} componentParams={{ title: 'Gab.com' }} />
}
<WrappedRoute path='/home' exact page={HomePage} component={HomeTimeline} content={children} />
@ -184,7 +185,7 @@ class SwitchingArea extends React.PureComponent {
<WrappedRoute path='/about/sales' publicRoute exact page={AboutPage} component={TermsOfSale} content={children} componentParams={{ title: 'Terms of Sale' }} />
<WrappedRoute path='/about/tos' publicRoute exact page={AboutPage} component={TermsOfService} content={children} componentParams={{ title: 'Terms of Service' }} />
<WrappedRoute path='/explore' publicRoute page={ExplorePage} component={GroupCollectionTimeline} content={children} componentParams={{ title: 'Explore', collectionType: 'featured' }} />
<WrappedRoute path='/explore' publicRoute page={ExplorePage} component={ExploreTimeline} content={children} componentParams={{ title: 'Explore' }} />
<WrappedRoute path='/news' publicRoute page={NewsPage} component={News} content={children} componentParams={{ title: 'News' }} />
<WrappedRoute path='/suggestions' exact page={BasicPage} component={Suggestions} content={children} componentParams={{ title: 'Suggestions' }} />

View File

@ -22,6 +22,7 @@ export function EditShortcutsModal() { return import(/* webpackChunkName: "compo
export function EmbedModal() { return import(/* webpackChunkName: "modals/embed_modal" */'../../../components/modal/embed_modal') }
export function EmojiPicker() { return import(/* webpackChunkName: "emoji_picker" */'../../../components/emoji/emoji_picker') }
export function EmojiPickerPopover() { return import(/* webpackChunkName: "components/emoji_picker_popover" */'../../../components/popover/emoji_picker_popover') }
export function ExploreTimeline() { return import(/* webpackChunkName: "features/explore_timeline" */'../../explore_timeline') }
export function FeaturedGroupsInjection() { return import(/* webpackChunkName: "components/featured_groups_injection" */'../../../components/timeline_injections/featured_groups_injection') }
export function Followers() { return import(/* webpackChunkName: "features/followers" */'../../followers') }
export function Following() { return import(/* webpackChunkName: "features/following" */'../../following') }

View File

@ -331,6 +331,7 @@ Rails.application.routes.draw do
resources :group, only: :show
resources :group_collection, only: :show
resources :group_pins, only: :show
resource :explore, only: :show, controller: :explore
end
resources :gab_trends, only: [:index]