random-mirrors/gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'develop' into groups-updates

Browse Source 
* develop:
  Updated status component to use properStatus when going to status page
  Added floating action button to ui/index
  Removed floating action button from columns area
  Fix issue with notification badge number not showing on mobile
  Updated scrollable_list to use documentElement for (primary/only) scrolling functionality
  Added onScroll props to status_list
  Added timeline scrollTop action, added to status_list_container, scrollable_list
  Removed unnecessary scrollContainer in status, account_gallery
  Added missing isLoading prop to ScrollableList
  Updated scrollable_list intersectionObserverWrapper
  Updated floatingActionButton to only show if someone is logged in
  Updated timeline_queue_button_header
  Removed focus of compose/cw after submit or spoiler change
  Removed set height of 100% on body
  Removed unused redirect after compose submit
  Patch Fix for hidden poll choices and results on light theme.
  Updated notification badge number formatter
  Fixed status/repost functionality to show status if owned by given username
  admin tool for editing pro status of accounts
This commit is contained in:
2458773093
2019-07-18 23:02:16 +03:00
parent f33c178b5a 8ccb710665
commit 04b219355c
27 changed files with 297 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
app/javascript/gabsocial/features/account_gallery/index.js
View File

@@ -12,7 +12,6 @@ import Column from '../ui/components/column';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { getAccountGallery } from 'gabsocial/selectors';
import MediaItem from './components/media_item';
import { ScrollContainer } from 'react-router-scroll-4';
import LoadMore from 'gabsocial/components/load_more';
import MissingIndicator from 'gabsocial/components/missing_indicator';
import { openModal } from 'gabsocial/actions/modal';
@@ -189,46 +188,44 @@ class AccountGallery extends ImmutablePureComponent {
return (
<Column>
<ScrollContainer scrollKey='account_gallery'>
<div className='slist slist--flex' onScroll={this.handleScroll}>
<div className='account__section-headline'>
<div style={{width: '100%', display: 'flex'}}>
<NavLink exact to={`/${accountUsername}`}>
<FormattedMessage id='account.posts' defaultMessage='Gabs' />
</NavLink>
<NavLink exact to={`/${accountUsername}/with_replies`}>
<FormattedMessage id='account.posts_with_replies' defaultMessage='Gabs and replies' />
</NavLink>
<NavLink exact to={`/${accountUsername}/media`}>
<FormattedMessage id='account.media' defaultMessage='Media' />
</NavLink>
</div>
<div className='slist slist--flex' onScroll={this.handleScroll}>
<div className='account__section-headline'>
<div style={{width: '100%', display: 'flex'}}>
<NavLink exact to={`/${accountUsername}`}>
<FormattedMessage id='account.posts' defaultMessage='Gabs' />
</NavLink>
<NavLink exact to={`/${accountUsername}/with_replies`}>
<FormattedMessage id='account.posts_with_replies' defaultMessage='Gabs and replies' />
</NavLink>
<NavLink exact to={`/${accountUsername}/media`}>
<FormattedMessage id='account.media' defaultMessage='Media' />
</NavLink>
</div>
<div role='feed' className='account-gallery__container' ref={this.handleRef}>
{attachments.map((attachment, index) => attachment === null ? (
<LoadMoreMedia key={'more:' + attachments.getIn(index + 1, 'id')} maxId={index > 0 ? attachments.getIn(index - 1, 'id') : null} onLoadMore={this.handleLoadMore} />
) : (
<MediaItem key={attachment.get('id')} attachment={attachment} displayWidth={width} onOpenMedia={this.handleOpenMedia} />
))}
{
attachments.size == 0 &&
<div className='empty-column-indicator'>
<FormattedMessage id='account_gallery.none' defaultMessage='No media to show.'/>
</div>
}
{loadOlder}
</div>
{isLoading && attachments.size === 0 && (
<div className='slist__append'>
<LoadingIndicator />
</div>
)}
</div>
</ScrollContainer>
<div role='feed' className='account-gallery__container' ref={this.handleRef}>
{attachments.map((attachment, index) => attachment === null ? (
<LoadMoreMedia key={'more:' + attachments.getIn(index + 1, 'id')} maxId={index > 0 ? attachments.getIn(index - 1, 'id') : null} onLoadMore={this.handleLoadMore} />
) : (
<MediaItem key={attachment.get('id')} attachment={attachment} displayWidth={width} onOpenMedia={this.handleOpenMedia} />
))}
{
attachments.size == 0 &&
<div className='empty-column-indicator'>
<FormattedMessage id='account_gallery.none' defaultMessage='No media to show.'/>
</div>
}
{loadOlder}
</div>
{isLoading && attachments.size === 0 && (
<div className='slist__append'>
<LoadingIndicator />
</div>
)}
</div>
</Column>
);
}

8
app/javascript/gabsocial/features/compose/components/compose_form.js
View File

@@ -175,14 +175,6 @@ class ComposeForm extends ImmutablePureComponent {
this.autosuggestTextarea.textarea.setSelectionRange(selectionStart, selectionEnd);
this.autosuggestTextarea.textarea.focus();
} else if(prevProps.isSubmitting && !this.props.isSubmitting) {
this.autosuggestTextarea.textarea.focus();
} else if (this.props.spoiler !== prevProps.spoiler) {
if (this.props.spoiler) {
this.spoilerText.input.focus();
} else {
this.autosuggestTextarea.textarea.focus();
}
}
}

31
app/javascript/gabsocial/features/reblogs/index.js
View File

@@ -4,16 +4,28 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import LoadingIndicator from '../../components/loading_indicator';
import MissingIndicator from '../../components/missing_indicator';
import { fetchReblogs } from '../../actions/interactions';
import { fetchStatus } from '../../actions/statuses';
import { FormattedMessage } from 'react-intl';
import AccountContainer from '../../containers/account_container';
import Column from '../ui/components/column';
import ColumnBackButton from '../../components/column_back_button';
import ScrollableList from '../../components/scrollable_list';
import { makeGetStatus } from '../../selectors';
const mapStateToProps = (state, props) => ({
accountIds: state.getIn(['user_lists', 'reblogged_by', props.params.statusId]),
});
const mapStateToProps = (state, props) => {
const getStatus = makeGetStatus();
const status = getStatus(state, {
id: props.params.statusId,
username: props.params.username
});
return {
status,
accountIds: state.getIn(['user_lists', 'reblogged_by', props.params.statusId]),
}
};
export default @connect(mapStateToProps)
class Reblogs extends ImmutablePureComponent {
@@ -22,20 +34,23 @@ class Reblogs extends ImmutablePureComponent {
params: PropTypes.object.isRequired,
dispatch: PropTypes.func.isRequired,
accountIds: ImmutablePropTypes.list,
status: ImmutablePropTypes.map,
};
componentWillMount () {
this.props.dispatch(fetchReblogs(this.props.params.statusId));
this.props.dispatch(fetchStatus(this.props.params.statusId));
}
componentWillReceiveProps(nextProps) {
if (nextProps.params.statusId !== this.props.params.statusId && nextProps.params.statusId) {
this.props.dispatch(fetchReblogs(nextProps.params.statusId));
this.props.dispatch(fetchStatus(nextProps.params.statusId));
}
}
render () {
const { accountIds } = this.props;
const { accountIds, status } = this.props;
if (!accountIds) {
return (
@@ -45,6 +60,14 @@ class Reblogs extends ImmutablePureComponent {
);
}
if (!status) {
return (
<Column>
<MissingIndicator />
</Column>
);
}
const emptyMessage = <FormattedMessage id='status.reblogs.empty' defaultMessage='No one has reposted this gab yet. When someone does, they will show up here.' />;
return (

73
app/javascript/gabsocial/features/status/index.js
View File

@@ -33,7 +33,6 @@ import {
import { initMuteModal } from '../../actions/mutes';
import { initReport } from '../../actions/reports';
import { makeGetStatus } from '../../selectors';
import { ScrollContainer } from 'react-router-scroll-4';
import ColumnHeader from '../../components/column_header';
import StatusContainer from '../../containers/status_container';
import { openModal } from '../../actions/modal';
@@ -63,7 +62,11 @@ const makeMapStateToProps = () => {
const getStatus = makeGetStatus();
const mapStateToProps = (state, props) => {
const status = getStatus(state, { id: props.params.statusId });
const status = getStatus(state, {
id: props.params.statusId,
username: props.params.username
});
let ancestorsIds = Immutable.List();
let descendantsIds = Immutable.List();
@@ -467,43 +470,41 @@ class Status extends ImmutablePureComponent {
/>
}
<ScrollContainer scrollKey='thread'>
<div ref={this.setRef}>
{ancestors}
<div ref={this.setRef}>
{ancestors}
<HotKeys handlers={handlers}>
<div className={classNames('focusable', 'detailed-status__wrapper')} tabIndex='0' aria-label={textForScreenReader(intl, status, false)}>
<DetailedStatus
status={status}
onOpenVideo={this.handleOpenVideo}
onOpenMedia={this.handleOpenMedia}
onToggleHidden={this.handleToggleHidden}
domain={domain}
showMedia={this.state.showMedia}
onToggleMediaVisibility={this.handleToggleMediaVisibility}
/>
<HotKeys handlers={handlers}>
<div className={classNames('focusable', 'detailed-status__wrapper')} tabIndex='0' aria-label={textForScreenReader(intl, status, false)}>
<DetailedStatus
status={status}
onOpenVideo={this.handleOpenVideo}
onOpenMedia={this.handleOpenMedia}
onToggleHidden={this.handleToggleHidden}
domain={domain}
showMedia={this.state.showMedia}
onToggleMediaVisibility={this.handleToggleMediaVisibility}
/>
<ActionBar
status={status}
onReply={this.handleReplyClick}
onFavourite={this.handleFavouriteClick}
onReblog={this.handleReblogClick}
onDelete={this.handleDeleteClick}
onDirect={this.handleDirectClick}
onMention={this.handleMentionClick}
onMute={this.handleMuteClick}
onMuteConversation={this.handleConversationMuteClick}
onBlock={this.handleBlockClick}
onReport={this.handleReport}
onPin={this.handlePin}
onEmbed={this.handleEmbed}
/>
</div>
</HotKeys>
<ActionBar
status={status}
onReply={this.handleReplyClick}
onFavourite={this.handleFavouriteClick}
onReblog={this.handleReblogClick}
onDelete={this.handleDeleteClick}
onDirect={this.handleDirectClick}
onMention={this.handleMentionClick}
onMute={this.handleMuteClick}
onMuteConversation={this.handleConversationMuteClick}
onBlock={this.handleBlockClick}
onReport={this.handleReport}
onPin={this.handlePin}
onEmbed={this.handleEmbed}
/>
</div>
</HotKeys>
{descendants}
</div>
</ScrollContainer>
{descendants}
</div>
</Column>
);
}

19
app/javascript/gabsocial/features/ui/components/columns_area.js
View File

@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl } from 'react-intl';
import { injectIntl } from 'react-intl';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
@@ -15,33 +15,20 @@ import BundleColumnError from './bundle_column_error';
import { Compose, Notifications, HomeTimeline, CommunityTimeline, HashtagTimeline, DirectTimeline, FavouritedStatuses, ListTimeline } from '../../ui/util/async-components';
import Icon from 'gabsocial/components/icon';
const messages = defineMessages({
publish: { id: 'compose_form.publish', defaultMessage: 'Gab' },
});
const shouldHideFAB = path => path.match(/^\/statuses\/|^\/search|^\/getting-started/);
export default @(component => injectIntl(component, { withRef: true }))
class ColumnsArea extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object.isRequired,
};
static propTypes = {
intl: PropTypes.object.isRequired,
columns: ImmutablePropTypes.list.isRequired,
isModalOpen: PropTypes.bool.isRequired,
children: PropTypes.node,
layout: PropTypes.object,
};
render () {
const { columns, children, isModalOpen, intl, onOpenCompose } = this.props;
const { columns, children, intl } = this.props;
const layout = this.props.layout || {LEFT:null,RIGHT:null};
const floatingActionButton = shouldHideFAB(this.context.router.history.location.pathname) ? null : <button key='floating-action-button' onClick={onOpenCompose} className='floating-action-button' aria-label={intl.formatMessage(messages.publish)}></button>;
return (
<div className='page'>
<div className='page__columns'>
@@ -64,8 +51,6 @@ class ColumnsArea extends ImmutablePureComponent {
{layout.RIGHT}
</div>
</div>
{floatingActionButton}
</div>
</div>

11
app/javascript/gabsocial/features/ui/containers/columns_area_container.js
View File

@@ -1,17 +1,8 @@
import { connect } from 'react-redux';
import ColumnsArea from '../components/columns_area';
import { openModal } from '../../../actions/modal';
const mapStateToProps = state => ({
columns: state.getIn(['settings', 'columns']),
isModalOpen: !!state.get('modal').modalType,
});
const mapDispatchToProps = (dispatch) => ({
onOpenCompose() {
dispatch(openModal('COMPOSE'));
},
});
export default connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true })(ColumnsArea);
export default connect(mapStateToProps, null, null, { forwardRef: true })(ColumnsArea);

7
app/javascript/gabsocial/features/ui/containers/status_list_container.js
View File

@@ -5,6 +5,7 @@ import { createSelector } from 'reselect';
import { debounce } from 'lodash';
import { me } from '../../../initial_state';
import { dequeueTimeline } from 'gabsocial/actions/timelines';
import { scrollTopTimeline } from '../../../actions/timelines';
const makeGetStatusIds = () => createSelector([
(state, { type }) => state.getIn(['settings', type], ImmutableMap()),
@@ -45,6 +46,12 @@ const mapDispatchToProps = (dispatch, ownProps) => ({
onDequeueTimeline(timelineId) {
dispatch(dequeueTimeline(timelineId, ownProps.onLoadMore));
},
onScrollToTop: debounce(() => {
dispatch(scrollTopTimeline(ownProps.timelineId, true));
}, 100),
onScroll: debounce(() => {
dispatch(scrollTopTimeline(ownProps.timelineId, false));
}, 100),
});
export default connect(mapStateToProps, mapDispatchToProps)(StatusList);

13
app/javascript/gabsocial/features/ui/index.js
View File

@@ -70,6 +70,7 @@ import '../../components/status';
const messages = defineMessages({
beforeUnload: { id: 'ui.beforeunload', defaultMessage: 'Your draft will be lost if you leave Gab Social.' },
publish: { id: 'compose_form.publish', defaultMessage: 'Gab' },
});
const mapStateToProps = state => ({
@@ -132,6 +133,8 @@ const LAYOUT = {
},
};
const shouldHideFAB = path => path.match(/^\/posts\/|^\/search|^\/getting-started/);
class SwitchingColumnsArea extends React.PureComponent {
static propTypes = {
@@ -487,9 +490,13 @@ class UI extends React.PureComponent {
this.context.router.history.push('/follow_requests');
}
handleOpenComposeModal = () => {
this.props.dispatch(openModal("COMPOSE"));
}
render () {
const { draggingOver } = this.state;
const { children, isComposing, location, dropdownMenuIsOpen } = this.props;
const { intl, children, isComposing, location, dropdownMenuIsOpen } = this.props;
const handlers = me ? {
help: this.handleHotkeyToggleHelp,
@@ -509,6 +516,8 @@ class UI extends React.PureComponent {
goToRequests: this.handleHotkeyGoToRequests,
} : {};
const floatingActionButton = shouldHideFAB(this.context.router.history.location.pathname) ? null : <button key='floating-action-button' onClick={this.handleOpenComposeModal} className='floating-action-button' aria-label={intl.formatMessage(messages.publish)}></button>;
return (
<HotKeys keyMap={keyMap} handlers={handlers} ref={this.setHotkeysRef} attach={window} focused>
<div className={classNames('ui', { 'is-composing': isComposing })} ref={this.setRef} style={{ pointerEvents: dropdownMenuIsOpen ? 'none' : null }}>
@@ -517,6 +526,8 @@ class UI extends React.PureComponent {
{children}
</SwitchingColumnsArea>
{me && floatingActionButton}
<NotificationsContainer />
<LoadingBarContainer className='loading-bar' />
<ModalContainer />