Commit fc2c84bf authored by Rob Colbert's avatar Rob Colbert

Merge branch 'develop' of https://code.gab.com/gab/social/gab-social into develop

parents 005da615 8157e543
......@@ -4,6 +4,7 @@ class HomeController < ApplicationController
before_action :authenticate_user!
before_action :set_referrer_policy_header
before_action :set_initial_state_json
before_action :set_data_for_meta
def index
@body_classes = 'app-body'
......@@ -11,17 +12,40 @@ class HomeController < ApplicationController
private
def set_data_for_meta
return if find_route_matches
if params[:username].present?
@account = Account.find_local(params[:username])
elsif params[:account_username].present?
@account = Account.find_local(params[:account_username])
if params[:id].present? && !@account.nil?
@status = @account.statuses.find(params[:id])
@stream_entry = @status.stream_entry
@type = @stream_entry.activity_type.downcase
end
end
if request.path.starts_with?('/tags') && params[:tag].present?
@tag = Tag.find_normalized(params[:tag])
end
end
def authenticate_user!
return if user_signed_in?
# if no current user, dont allow to navigate to these paths
matches = request.path.match(/\A\/(home|groups|tags|lists|notifications|explore|follow_requests|blocks|domain_blocks|mutes)/)
if matches
if find_route_matches
redirect_to(homepage_path)
end
end
def find_route_matches
request.path.match(/\A\/(home|groups|lists|notifications|explore|follow_requests|blocks|domain_blocks|mutes)/)
end
def set_initial_state_json
serializable_resource = ActiveModelSerializers::SerializableResource.new(InitialStatePresenter.new(initial_state_params), serializer: InitialStateSerializer)
@initial_state_json = serializable_resource.to_json
......
export const SIDEBAR_OPEN = 'SIDEBAR_OPEN';
export const SIDEBAR_CLOSE = 'SIDEBAR_CLOSE';
export function openSidebar() {
return {
type: SIDEBAR_OPEN,
};
};
export function closeSidebar() {
return {
type: SIDEBAR_CLOSE,
};
};
......@@ -3,7 +3,7 @@ import openDB from '../storage/db';
import { evictStatus } from '../storage/modifier';
import { deleteFromTimelines } from './timelines';
import { importFetchedStatus, importFetchedStatuses, importAccount, importStatus } from './importer';
import { ensureComposeIsVisible } from './compose';
import { openModal } from './modal';
import { me } from 'gabsocial/initial_state';
export const STATUS_FETCH_REQUEST = 'STATUS_FETCH_REQUEST';
......@@ -159,7 +159,7 @@ export function deleteStatus(id, routerHistory, withRedraft = false) {
if (withRedraft) {
dispatch(redraft(status, response.data.text));
ensureComposeIsVisible(getState, routerHistory);
dispatch(openModal('COMPOSE'));
}
}).catch(error => {
dispatch(deleteStatusFail(id, error));
......@@ -272,7 +272,7 @@ export function muteStatusFail(id, error) {
export function unmuteStatus(id) {
return (dispatch, getState) => {
if (!me) return;
dispatch(unmuteStatusRequest(id));
api(getState).post(`/api/v1/statuses/${id}/unmute`).then(() => {
......
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Link, NavLink } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { injectIntl, defineMessages } from 'react-intl';
import classNames from 'classnames';
import Avatar from './avatar';
import IconButton from './icon_button';
import Icon from './icon';
import DisplayName from './display_name';
import { closeSidebar } from '../actions/sidebar';
import { shortNumberFormat } from '../utils/numbers';
import { me } from '../initial_state';
import { makeGetAccount } from '../selectors';
const messages = defineMessages({
followers: { id: 'account.followers', defaultMessage: 'Followers' },
follows: { id: 'account.follows', defaultMessage: 'Follows' },
profile: { id: 'account.profile', defaultMessage: 'Profile' },
preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Hidden domains' },
mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
filters: { id: 'navigation_bar.filters', defaultMessage: 'Muted words' },
logout: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
lists: { id: 'column.lists', defaultMessage: 'Lists', },
apps: { id: 'tabs_bar.apps', defaultMessage: 'Apps' },
news: { id: 'tabs_bar.news', defaultMessage: 'News' },
more: { id: 'sidebar.more', defaultMessage: 'More' },
partners: { id: 'promo.partners', defaultMessage: 'Affiliate Partners' },
store: { id: 'promo.store', defaultMessage: 'Store' },
})
const mapStateToProps = state => {
const getAccount = makeGetAccount();
return {
account: getAccount(state, me),
sidebarOpen: state.get('sidebar').sidebarOpen,
};
};
const mapDispatchToProps = (dispatch) => ({
onClose () {
dispatch(closeSidebar());
},
});
export default @connect(mapStateToProps, mapDispatchToProps)
@injectIntl
class SidebarMenu extends ImmutablePureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
account: ImmutablePropTypes.map,
sidebarOpen: PropTypes.bool,
onClose: PropTypes.func.isRequired,
};
state = {
moreOpen: false,
}
componentDidUpdate () {
if (!me) return;
if (this.props.sidebarOpen) {
document.body.classList.add('with-modals--active');
} else {
document.body.classList.remove('with-modals--active');
}
}
toggleMore = () => {
this.setState({
moreOpen: !this.state.moreOpen
});
}
handleSidebarClose = () => {
this.props.onClose();
this.setState({
moreOpen: false,
});
}
render () {
const { sidebarOpen, intl, account } = this.props;
const { moreOpen } = this.state;
if (!me || !account) return null;
const acct = account.get('acct');
const classes = classNames('sidebar-menu__root', {
'sidebar-menu__root--visible': sidebarOpen,
});
const moreIcon = moreOpen ? 'minus' : 'plus';
const moreContainerStyle = { display: moreOpen ? 'block' : 'none' };
return (
<div className={classes}>
<div className='sidebar-menu__wrapper' role='button' onClick={this.handleSidebarClose} />
<div className='sidebar-menu'>
<div className='sidebar-menu-header'>
<span className='sidebar-menu-header__title'>Account Info</span>
<IconButton title='close' onClick={this.handleSidebarClose} icon='close' className='sidebar-menu-header__btn' />
</div>
<div className='sidebar-menu__content'>
<div className='sidebar-menu-profile'>
<div className='sidebar-menu-profile__avatar'>
<Link to={`/${acct}`} title={acct} onClick={this.handleSidebarClose}>
<Avatar account={account} />
</Link>
</div>
<div className='sidebar-menu-profile__name'>
<DisplayName account={account}/>
</div>
<div className='sidebar-menu-profile__stats'>
<NavLink className='sidebar-menu-profile-stat' to={`/${acct}/followers`} onClick={this.handleSidebarClose} title={intl.formatNumber(account.get('followers_count'))}>
<strong className='sidebar-menu-profile-stat__value'>{shortNumberFormat(account.get('followers_count'))}</strong>
<span className='sidebar-menu-profile-stat__label'>{intl.formatMessage(messages.followers)}</span>
</NavLink>
<NavLink className='sidebar-menu-profile-stat' to={`/${acct}/following`} onClick={this.handleSidebarClose} title={intl.formatNumber(account.get('following_count'))}>
<strong className='sidebar-menu-profile-stat__value'>{shortNumberFormat(account.get('following_count'))}</strong>
<span className='sidebar-menu-profile-stat__label'>{intl.formatMessage(messages.follows)}</span>
</NavLink>
</div>
</div>
<div className='sidebar-menu__section sidebar-menu__section--borderless'>
<NavLink className='sidebar-menu-item' to={`/${acct}`} onClick={this.handleSidebarClose}>
<Icon id='user' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.profile)}</span>
</NavLink>
<a className='sidebar-menu-item' href='https://blog.gab.com'>
<Icon id='align-left' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.news)}</span>
</a>
<a className='sidebar-menu-item' href='https://gumroad.com/getongab'>
<Icon id='dollar' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.store)}</span>
</a>
<a className='sidebar-menu-item' href='https://blog.gab.com/support-gab'>
<Icon id='users' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.partners)}</span>
</a>
<a className='sidebar-menu-item' href='https://apps.gab.com'>
<Icon id='th' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.apps)}</span>
</a>
<a className='sidebar-menu-item' href='/settings/preferences'>
<Icon id='cog' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.preferences)}</span>
</a>
</div>
<div className='sidebar-menu__section'>
<div className='sidebar-menu-item' onClick={this.toggleMore} role='button'>
<Icon id={moreIcon} fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.more)}</span>
</div>
<div style={moreContainerStyle}>
<NavLink className='sidebar-menu-item' to='/lists' onClick={this.handleSidebarClose}>
<Icon id='list' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.lists)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/follow_requests' onClick={this.handleSidebarClose}>
<Icon id='user-plus' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.follow_requests)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/blocks' onClick={this.handleSidebarClose}>
<Icon id='ban' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.blocks)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/domain_blocks' onClick={this.handleSidebarClose}>
<Icon id='sitemap' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.domain_blocks)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/mutes' onClick={this.handleSidebarClose}>
<Icon id='times-circle' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.mutes)}</span>
</NavLink>
<a className='sidebar-menu-item' href='/filters'>
<Icon id='filter' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.filters)}</span>
</a>
</div>
</div>
<div className='sidebar-menu__section'>
<a className='sidebar-menu-item' href='/auth/sign_out' data-method='delete'>
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.logout)}</span>
</a>
</div>
</div>
</div>
</div>
);
}
}
......@@ -45,7 +45,7 @@ export default class StatusContent extends React.PureComponent {
}
link.classList.add('status-link');
let mention = this.props.status.get('mentions').find(item => link.href === `/${item.get('acct')}`);
let mention = this.props.status.get('mentions').find(item => link.href === `${item.get('url')}`);
if (mention) {
link.addEventListener('click', this.onMentionClick.bind(this, mention), false);
......@@ -139,7 +139,7 @@ export default class StatusContent extends React.PureComponent {
const { status, reblogContent } = this.props;
const properContent = status.get('contentHtml');
return reblogContent
? `${reblogContent} <div class='status__quote'>${properContent}</div>`
: properContent;
......
......@@ -48,7 +48,7 @@ class ActionBar extends React.PureComponent {
menu.push({ text: intl.formatMessage(messages.mutes), to: '/mutes' });
menu.push({ text: intl.formatMessage(messages.blocks), to: '/blocks' });
menu.push({ text: intl.formatMessage(messages.domain_blocks), to: '/domain_blocks' });
menu.push({ text: intl.formatMessage(messages.filters), to: '/filters' });
menu.push({ text: intl.formatMessage(messages.filters), href: '/filters' });
menu.push(null);
menu.push({ text: intl.formatMessage(messages.keyboard_shortcuts), action: this.handleHotkeyClick });
menu.push({ text: intl.formatMessage(messages.preferences), href: '/settings/preferences' });
......
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
import { injectIntl, FormattedMessage } from 'react-intl';
import { me } from '../../../initial_state';
import { makeGetAccount } from '../../../selectors';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { FormattedMessage } from 'react-intl';
import Icon from 'gabsocial/components/icon';
const PromoPanel = () => (
<div className='promo-panel'>
<div className='promo-panel__container'>
export default class PromoPanel extends React.PureComponent {
render() {
return (
<div className='wtf-panel promo-panel'>
<div className='promo-panel__container'>
<div className='promo-panel-item'>
<a className='promo-panel-item__btn' href='https://blog.gab.com'>
<Icon id='align-left' className='promo-panel-item__icon' fixedWidth />
<FormattedMessage id='promo.gab_news' defaultMessage='Gab News' />
</a>
</div>
<div className='promo-panel-item'>
<a className='promo-panel-item__btn button button-alternative-2' href='/invites'>
<Icon id='envelope' className='promo-panel-item__icon' fixedWidth />
<FormattedMessage id='promo.invite_heading' defaultMessage='Invite Friends' />
</a>
<p className='promo-panel-item__message promo-panel-item__message--dark'>
<FormattedMessage
id='promo.invite_message'
defaultMessage='Invite others to be a member of Gab.'
/>
</p>
</div>
<div className='promo-panel-item'>
<a className='promo-panel-item__btn' href='https://gumroad.com/getongab'>
<Icon id='dollar' className='promo-panel-item__icon' fixedWidth />
<FormattedMessage id='promo.store' defaultMessage='Store' />
</a>
</div>
</div>
</div>
);
<div className='promo-panel-item'>
<a className='promo-panel-item__btn' href='https://blog.gab.com/support-gab'>
<Icon id='users' className='promo-panel-item__icon' fixedWidth />
<FormattedMessage id='promo.partners' defaultMessage='Affiliate Partners' />
</a>
</div>
export default PromoPanel;
<div className='promo-panel-item'>
<a className='promo-panel-item__btn' href='https://apps.gab.com'>
<Icon id='th' className='promo-panel-item__icon' fixedWidth />
<FormattedMessage id='promo.gab_apps' defaultMessage='Gab Apps' />
</a>
</div>
</div>
</div>
)
}
}
\ No newline at end of file
......@@ -2,47 +2,50 @@ import React from 'react';
import PropTypes from 'prop-types';
import { NavLink, withRouter } from 'react-router-dom';
import { FormattedMessage, injectIntl } from 'react-intl';
import { debounce } from 'lodash';
import { throttle } from 'lodash';
import { connect } from 'react-redux';
import { isUserTouching } from '../../../is_mobile';
import { me } from '../../../initial_state';
import { Link } from 'react-router-dom';
import classNames from 'classnames';
import NotificationsCounterIcon from './notifications_counter_icon';
import SearchContainer from 'gabsocial/features/compose/containers/search_container';
import Avatar from '../../../components/avatar';
import ActionBar from 'gabsocial/features/compose/components/action_bar';
import { openModal } from '../../../actions/modal';
import { openSidebar } from '../../../actions/sidebar';
export const privateLinks = [
<NavLink className='tabs-bar__link--logo' to='/home#' data-preview-title-id='column.home' style={{ padding: '0' }}>
<NavLink key='pr0' className='tabs-bar__link--logo' to='/home#' data-preview-title-id='column.home' style={{ padding: '0' }}>
<FormattedMessage id='tabs_bar.home' defaultMessage='Home' />
</NavLink>,
<NavLink className='tabs-bar__link home' to='/home' data-preview-title-id='column.home' >
<NavLink key='pr1' className='tabs-bar__link' to='/home' data-preview-title-id='column.home' >
<i className='tabs-bar__link__icon home'/>
<FormattedMessage id='tabs_bar.home' defaultMessage='Home' />
</NavLink>,
<NavLink className='tabs-bar__link notifications' to='/notifications' data-preview-title-id='column.notifications' >
<NavLink key='pr2' className='tabs-bar__link' to='/notifications' data-preview-title-id='column.notifications' >
<i className='tabs-bar__link__icon notifications'/>
<NotificationsCounterIcon />
<FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' />
</NavLink>,
<NavLink className='tabs-bar__link groups' to='/groups' data-preview-title-id='column.groups' >
<NavLink key='pr3' className='tabs-bar__link' to='/groups' data-preview-title-id='column.groups' >
<i className='tabs-bar__link__icon groups'/>
<FormattedMessage id='tabs_bar.groups' defaultMessage='Groups' />
</NavLink>,
<a className='tabs-bar__link apps' href='https://apps.gab.com' data-preview-title-id='tabs_bar.apps' >
<FormattedMessage id='tabs_bar.apps' defaultMessage='Apps' />
</a>,
<NavLink className='tabs-bar__link optional' to='/search' data-preview-title-id='tabs_bar.search' >
<NavLink key='pr5' className='tabs-bar__link tabs-bar__link--search' to='/search' data-preview-title-id='tabs_bar.search' >
<i className='tabs-bar__link__icon tabs-bar__link__icon--search'/>
<FormattedMessage id='tabs_bar.search' defaultMessage='Search' />
</NavLink>,
];
export const publicLinks = [
<a className='tabs-bar__link--logo' href='/#' data-preview-title-id='column.home' style={{ padding: '0' }}>
<a key='pl0' className='tabs-bar__link--logo' href='/#' data-preview-title-id='column.home' style={{ padding: '0' }}>
<FormattedMessage id='tabs_bar.home' defaultMessage='Home' />
</a>,
<a className='tabs-bar__link home' href='/home' data-preview-title-id='column.home' >
<a key='pl1' className='tabs-bar__link' href='/home' data-preview-title-id='column.home' >
<i className='tabs-bar__link__icon home'/>
<FormattedMessage id='tabs_bar.home' defaultMessage='Home' />
</a>,
<NavLink className='tabs-bar__link optional' to='/search' data-preview-title-id='tabs_bar.search' >
<NavLink key='pl2' className='tabs-bar__link tabs-bar__link--search' to='/search' data-preview-title-id='tabs_bar.search' >
<i className='tabs-bar__link__icon tabs-bar__link__icon--search'/>
<FormattedMessage id='tabs_bar.search' defaultMessage='Search' />
</NavLink>,
];
......@@ -54,18 +57,104 @@ class TabsBar extends React.PureComponent {
intl: PropTypes.object.isRequired,
history: PropTypes.object.isRequired,
onOpenCompose: PropTypes.func,
onOpenSidebar: PropTypes.func.isRequired,
}
state = {
collapsed: false,
}
static contextTypes = {
router: PropTypes.object,
}
lastScrollTop = 0;
componentDidMount () {
this.window = window;
this.documentElement = document.scrollingElement || document.documentElement;
this.attachScrollListener();
// Handle initial scroll posiiton
this.handleScroll();
}
componentWillUnmount () {
this.detachScrollListener();
}
setRef = ref => {
this.node = ref;
}
attachScrollListener () {
this.window.addEventListener('scroll', this.handleScroll);
}
detachScrollListener () {
this.window.removeEventListener('scroll', this.handleScroll);
}
handleScroll = throttle(() => {
if (this.window) {
const { pageYOffset, innerWidth } = this.window;
if (innerWidth > 895) return;
const { scrollTop } = this.documentElement;
let st = pageYOffset || scrollTop;
if (st > this.lastScrollTop){
let offset = st - this.lastScrollTop;
if (offset > 50) this.setState({collapsed: true});
} else {
let offset = this.lastScrollTop - st;
if (offset > 50) this.setState({collapsed: false});
}
this.lastScrollTop = st <= 0 ? 0 : st;
}
}, 150, {
trailing: true,
});
render () {
const { intl: { formatMessage }, account, onOpenCompose } = this.props;
const { intl: { formatMessage }, account, onOpenCompose, onOpenSidebar } = this.props;
const { collapsed } = this.state;
const links = account ? privateLinks : publicLinks;
const pathname = this.context.router.route.location.pathname || '';
let pathTitle = '';
if (pathname.includes('/home')) {
pathTitle = 'Home';
} else if (pathname.includes('/timeline/all')) {
pathTitle = 'All';
} else if (pathname.includes('/group')) {
pathTitle = 'Groups';
} else if (pathname.includes('/tags')) {
pathTitle = 'Tags';
} else if (pathname.includes('/list')) {
pathTitle = 'Lists';
} else if (pathname.includes('/notifications')) {
pathTitle = 'Notifications';
} else if (pathname.includes('/search')) {
pathTitle = 'Search';
} else if (pathname.includes('/follow_requests')) {
pathTitle = 'Requests';
} else if (pathname.includes('/blocks')) {
pathTitle = 'Blocks';
} else if (pathname.includes('/domain_blocks')) {
pathTitle = 'Domain Blocks';
} else if (pathname.includes('/mutes')) {
pathTitle = 'Mutes';
} else {
pathTitle = 'Profile';
}