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

Progress

Browse Source
This commit is contained in:
mgabdev
2020-03-02 17:26:25 -05:00
parent c6aa4e08a1
commit 0df3c073a5
43 changed files with 602 additions and 719 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
app/javascript/gabsocial/features/account_gallery/account_gallery.js
View File

@@ -173,27 +173,6 @@ class AccountGallery extends ImmutablePureComponent {
return (
<div className='scrollable-list scrollable-list--flex' onScroll={this.handleScroll}>
{ /* <SectionHeadlineBar
className='account-section-headline'
items={[
{
exact: true,
to: `/${accountUsername}`,
title: intl.formatMessage(messages.posts),
},
{
exact: true,
to: `/${accountUsername}/with_replies`,
title: intl.formatMessage(messages.postsWithReplies),
},
{
exact: true,
to: `/${accountUsername}/media`,
title: intl.formatMessage(messages.media),
},
]}
/> */ }
<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} />

29
app/javascript/gabsocial/features/account_timeline/account_timeline.js
View File

@@ -109,35 +109,12 @@ class AccountTimeline extends ImmutablePureComponent {
const { statusIds, featuredStatusIds, isLoading, hasMore, isAccount, accountId, unavailable, accountUsername, intl } = this.props;
if (!isAccount && accountId !== -1) {
return (<ColumnIndicator type='missing' />);
return <ColumnIndicator type='missing' />
} else if (accountId === -1 || (!statusIds && isLoading)) {
return (<ColumnIndicator type='loading' />);
return <ColumnIndicator type='loading' />
} else if (unavailable) {
return (<ColumnIndicator type='error' message={intl.formatMessage(messages.error)} />);
return <ColumnIndicator type='error' message={intl.formatMessage(messages.error)} />
}
/* <SectionHeadlineBar
className='account-section-headline'
items={[
{
exact: true,
to: `/${accountUsername}`,
title: intl.formatMessage(messages.posts),
},
{
exact: true,
to: `/${accountUsername}/with_replies`,
title: intl.formatMessage(messages.postsWithReplies),
},
{
exact: true,
to: `/${accountUsername}/media`,
title: intl.formatMessage(messages.media),
},
]}
/>
*/
return (
<StatusList
scrollKey='account_timeline'

2
app/javascript/gabsocial/features/compose/components/compose_extra_button.js
View File

@@ -70,7 +70,7 @@ export default class ComposeExtraButton extends PureComponent {
onMouseEnter={() => this.handleOnMouseEnter()}
onMouseLeave={() => this.handleOnMouseLeave()}
>
<Icon id={icon} width={iconSize} height={iconSize} className={_s.fillcolorSecondary} />
<Icon id={icon} width={iconSize} height={iconSize} className={_s.fillColorSecondary} />
{
!small &&
<span className={titleClasses}>

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

@@ -316,13 +316,15 @@ class ComposeForm extends ImmutablePureComponent {
small={shouldCondense}
textarea
>
{ /*
!condensed &&
<div className='compose-form__modifiers'>
<UploadForm />
{!edit && <PollFormContainer />}
{
!edit &&
<PollFormContainer />
}
</div>
*/ }
</AutosuggestTextbox>
{ /* quoteOfId && <QuotedStatusPreviewContainer id={quoteOfId} /> */}

83
app/javascript/gabsocial/features/compose/components/upload/upload.js
View File

@@ -1,15 +1,15 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, injectIntl } from 'react-intl';
import classNames from 'classnames';
import spring from 'react-motion/lib/spring';
import Motion from '../../../ui/util/optional_motion';
import IconButton from '../../../../components/icon_button';
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { defineMessages, injectIntl } from 'react-intl'
import classNames from 'classnames'
import spring from 'react-motion/lib/spring'
import Motion from '../../../ui/util/optional_motion'
import Button from '../../../../components/button'
const messages = defineMessages({
description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
});
})
export default
@injectIntl
@@ -17,82 +17,76 @@ class Upload extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
}
static propTypes = {
media: ImmutablePropTypes.map.isRequired,
intl: PropTypes.object.isRequired,
onUndo: PropTypes.func.isRequired,
onDescriptionChange: PropTypes.func.isRequired,
onOpenFocalPoint: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
};
}
state = {
hovered: false,
focused: false,
dirtyDescription: null,
};
}
handleKeyDown = (e) => {
if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) {
this.handleSubmit();
this.handleSubmit()
}
}
handleSubmit = () => {
this.handleInputBlur();
this.props.onSubmit(this.context.router.history);
this.handleInputBlur()
this.props.onSubmit(this.context.router.history)
}
handleUndoClick = e => {
e.stopPropagation();
this.props.onUndo(this.props.media.get('id'));
}
handleFocalPointClick = e => {
e.stopPropagation();
this.props.onOpenFocalPoint(this.props.media.get('id'));
e.stopPropagation()
this.props.onUndo(this.props.media.get('id'))
}
handleInputChange = e => {
this.setState({ dirtyDescription: e.target.value });
this.setState({ dirtyDescription: e.target.value })
}
handleMouseEnter = () => {
this.setState({ hovered: true });
this.setState({ hovered: true })
}
handleMouseLeave = () => {
this.setState({ hovered: false });
this.setState({ hovered: false })
}
handleInputFocus = () => {
this.setState({ focused: true });
this.setState({ focused: true })
}
handleClick = () => {
this.setState({ focused: true });
this.setState({ focused: true })
}
handleInputBlur = () => {
const { dirtyDescription } = this.state;
const { dirtyDescription } = this.state
this.setState({ focused: false, dirtyDescription: null });
this.setState({ focused: false, dirtyDescription: null })
if (dirtyDescription !== null) {
this.props.onDescriptionChange(this.props.media.get('id'), dirtyDescription);
this.props.onDescriptionChange(this.props.media.get('id'), dirtyDescription)
}
}
render () {
const { intl, media } = this.props;
const active = this.state.hovered || this.state.focused;
const description = this.state.dirtyDescription || (this.state.dirtyDescription !== '' && media.get('description')) || '';
const focusX = media.getIn(['meta', 'focus', 'x']);
const focusY = media.getIn(['meta', 'focus', 'y']);
const x = ((focusX / 2) + .5) * 100;
const y = ((focusY / -2) + .5) * 100;
render() {
const { intl, media } = this.props
const active = this.state.hovered || this.state.focused
const description = this.state.dirtyDescription || (this.state.dirtyDescription !== '' && media.get('description')) || ''
const focusX = media.getIn(['meta', 'focus', 'x'])
const focusY = media.getIn(['meta', 'focus', 'y'])
const x = ((focusX / 2) + .5) * 100
const y = ((focusY / -2) + .5) * 100
return (
<div className='compose-form-upload' tabIndex='0' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} onClick={this.handleClick} role='button'>
@@ -100,13 +94,18 @@ class Upload extends ImmutablePureComponent {
{({ scale }) => (
<div className='compose-form__upload-thumbnail' style={{ transform: `scale(${scale})`, backgroundImage: `url(${media.get('preview_url')})`, backgroundPosition: `${x}% ${y}%` }}>
<div className={classNames('compose-form__upload__actions', { active })}>
<button className='icon-button' title={intl.formatMessage(messages.delete)} onClick={this.handleUndoClick}><Icon id='times'/></button>
{media.get('type') === 'image' && <button className='icon-button' onClick={this.handleFocalPointClick}><Icon id='crosshairs' /> <FormattedMessage id='upload_form.focus' defaultMessage='Crop' /></button>}
<Button
title={intl.formatMessage(messages.delete)}
onClick={this.handleUndoClick}
icon='cancel'
/>
</div>
<div className={classNames('compose-form-upload__description', { active })}>
<label>
<span style={{ display: 'none' }}>{intl.formatMessage(messages.description)}</span>
<span style={{ display: 'none' }}>
{intl.formatMessage(messages.description)}
</span>
<textarea
placeholder={intl.formatMessage(messages.description)}
@@ -123,7 +122,7 @@ class Upload extends ImmutablePureComponent {
)}
</Motion>
</div>
);
)
}
}

4
app/javascript/gabsocial/features/compose/containers/upload_container.js
View File

@@ -17,10 +17,6 @@ const mapDispatchToProps = dispatch => ({
dispatch(changeUploadCompose(id, { description }));
},
onOpenFocalPoint: id => {
dispatch(openModal('FOCAL_POINT', { id }));
},
onSubmit (router) {
dispatch(submitCompose(router));
},

54
app/javascript/gabsocial/features/favorited_statuses/favorited_statuses.js
View File

@@ -1,11 +1,11 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import { FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { debounce } from 'lodash';
import { fetchFavoritedStatuses, expandFavoritedStatuses } from '../../actions/favorites';
import { meUsername } from '../../initial_state';
import StatusList from '../../components/status_list';
import ColumnIndicator from '../../components/column_indicator';
import ImmutablePropTypes from 'react-immutable-proptypes'
import { FormattedMessage } from 'react-intl'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { debounce } from 'lodash'
import { fetchFavoritedStatuses, expandFavoritedStatuses } from '../../actions/favorites'
import { meUsername } from '../../initial_state'
import StatusList from '../../components/status_list'
import ColumnIndicator from '../../components/column_indicator'
const mapStateToProps = (state, { params: { username } }) => {
return {
@@ -13,8 +13,8 @@ const mapStateToProps = (state, { params: { username } }) => {
statusIds: state.getIn(['status_lists', 'favorites', 'items']),
isLoading: state.getIn(['status_lists', 'favorites', 'isLoading'], true),
hasMore: !!state.getIn(['status_lists', 'favorites', 'next']),
};
};
}
}
export default
@connect(mapStateToProps)
@@ -26,33 +26,35 @@ class Favorites extends ImmutablePureComponent {
hasMore: PropTypes.bool,
isLoading: PropTypes.bool,
isMyAccount: PropTypes.bool.isRequired,
};
}
componentWillMount () {
this.props.dispatch(fetchFavoritedStatuses());
componentWillMount() {
this.props.dispatch(fetchFavoritedStatuses())
}
handleLoadMore = debounce(() => {
this.props.dispatch(expandFavoritedStatuses());
this.props.dispatch(expandFavoritedStatuses())
}, 300, { leading: true })
render () {
const { statusIds, hasMore, isLoading, isMyAccount } = this.props;
render() {
const { statusIds, hasMore, isLoading, isMyAccount } = this.props
if (!isMyAccount) {
return ( <ColumnIndicator type='missing' /> );
return <ColumnIndicator type='missing' />
}
console.log("statusIds:", statusIds)
return (
<StatusList
statusIds={statusIds}
scrollKey='favorited_statuses'
hasMore={hasMore}
isLoading={isLoading}
onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.favorited_statuses' defaultMessage="You don't have any favorite gabs yet. When you favorite one, it will show up here." />}
/>
);
<StatusList
statusIds={statusIds}
scrollKey='favorited_statuses'
hasMore={hasMore}
isLoading={isLoading}
onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.favorited_statuses' defaultMessage="You don't have any favorite gabs yet. When you favorite one, it will show up here." />}
/>
)
}
}

8
app/javascript/gabsocial/features/followers/followers.js
View File

@@ -118,9 +118,11 @@ class Followers extends ImmutablePureComponent {
onLoadMore={this.handleLoadMore}
emptyMessage={intl.formatMessage(messages.empty)}
>
{accountIds.map((id, i) => (
<AccountContainer key={id} id={id} withNote={false} compact />
))}
{
accountIds.map((id, i) => (
<AccountContainer key={id} id={id} withNote={false} compact />
))
}
</ScrollableList>
</div>
</Block>

10
app/javascript/gabsocial/features/following/following.js
View File

@@ -1,3 +1,4 @@
import { Fragment } from 'react'
import ImmutablePureComponent from 'react-immutable-pure-component'
import ImmutablePropTypes from 'react-immutable-proptypes'
import { debounce } from 'lodash'
@@ -13,6 +14,7 @@ import AccountContainer from '../../containers/account_container'
import ColumnIndicator from '../../components/column_indicator'
import ScrollableList from '../../components/scrollable_list'
import Block from '../../components/block'
import Divider from '../../components/divider'
import Heading from '../../components/heading'
const mapStateToProps = (state, { params: { username } }) => {
@@ -118,9 +120,11 @@ class Following extends ImmutablePureComponent {
onLoadMore={this.handleLoadMore}
emptyMessage={intl.formatMessage(messages.empty)}
>
{accountIds.map((id, i) => (
<AccountContainer key={id} id={id} withNote={false} compact />
))}
{
accountIds.map((id) => (
<AccountContainer key={id} id={id} withNote={false} compact />
))
}
</ScrollableList>
</div>
</Block>

50
app/javascript/gabsocial/features/notifications/components/notification/notification-alt.js Normal file
View File

@@ -0,0 +1,50 @@
import { injectIntl, FormattedMessage } from 'react-intl'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { HotKeys } from 'react-hotkeys'
import ImmutablePropTypes from 'react-immutable-proptypes'
import StatusContainer from '../../../../containers/status_container'
import AccountContainer from '../../../../containers/account_container'
import Button from '../../../../components/button'
import Icon from '../../../../components/icon'
const notificationForScreenReader = (intl, message, timestamp) => {
const output = [message]
output.push(intl.formatDate(timestamp, { hour: '2-digit', minute: '2-digit', month: 'short', day: 'numeric' }))
return output.join(', ')
}
export default
@injectIntl
class Notification extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
}
static propTypes = {
status: ImmutablePropTypes.map,
intl: PropTypes.object.isRequired,
notificationType: PropTypes.string.isRequired,
accounts: ImmutablePropTypes.list,
}
renderFavorite = () => {
const { status, notificationType, accounts } = this.props
}
render() {
const { notification } = this.props
const account = notification.get('account')
switch (notification.get('type')) {
case 'favourite':
return this.renderFavorite()
}
return null
}
}

54
app/javascript/gabsocial/features/notifications/components/notification/notification.js
View File

@@ -87,7 +87,7 @@ class Notification extends ImmutablePureComponent {
if (status) this.props.onToggleHidden(status);
}
getHandlers () {
getHandlers() {
return {
reply: this.handleMention,
favourite: this.handleHotkeyFavourite,
@@ -101,7 +101,7 @@ class Notification extends ImmutablePureComponent {
};
}
renderFollow (notification, account, link) {
renderFollow(notification, account, link) {
const { intl } = this.props;
return (
@@ -123,7 +123,7 @@ class Notification extends ImmutablePureComponent {
);
}
renderMention (notification) {
renderMention(notification) {
return (
<StatusContainer
id={notification.get('status')}
@@ -140,7 +140,7 @@ class Notification extends ImmutablePureComponent {
);
}
renderFavourite (notification, link) {
renderFavourite(notification, link) {
const { intl } = this.props;
return (
@@ -173,7 +173,7 @@ class Notification extends ImmutablePureComponent {
);
}
renderReblog (notification, link) {
renderReblog(notification, link) {
const { intl } = this.props;
return (
@@ -205,7 +205,7 @@ class Notification extends ImmutablePureComponent {
);
}
renderPoll (notification) {
renderPoll(notification) {
const { intl } = this.props;
return (
@@ -237,23 +237,35 @@ class Notification extends ImmutablePureComponent {
);
}
render () {
render() {
const { notification } = this.props;
const account = notification.get('account');
const displayNameHtml = { __html: account.get('display_name_html') };
const link = <bdi><Button className='notification__display-name' href={`/${account.get('acct')}`} title={account.get('acct')} to={`/${account.get('acct')}`} dangerouslySetInnerHTML={displayNameHtml} /></bdi>;
const account = notification.get('account');
const displayNameHtml = { __html: account.get('display_name_html') };
const link = (
<bdi>
<Button
className='notification__display-name'
href={`/${account.get('acct')}`}
title={account.get('acct')}
to={`/${account.get('acct')}`}
dangerouslySetInnerHTML={displayNameHtml}
/>
</bdi>
);
switch(notification.get('type')) {
// case 'follow':
// return this.renderFollow(notification, account, link);
// case 'mention':
// return this.renderMention(notification);
case 'favourite':
return this.renderFavourite(notification, link);
// case 'reblog':
// return this.renderReblog(notification, link);
// case 'poll':
// return this.renderPoll(notification);
// console.log("notification:", notification)
switch (notification.get('type')) {
// case 'follow':
// return this.renderFollow(notification, account, link);
// case 'mention':
// return this.renderMention(notification);
case 'favourite':
return this.renderFavourite(notification, link);
// case 'reblog':
// return this.renderReblog(notification, link);
// case 'poll':
// return this.renderPoll(notification);
}
return null;

82
app/javascript/gabsocial/features/notifications/notifications.js
View File

@@ -11,14 +11,9 @@ import {
} from '../../actions/notifications';
import NotificationContainer from './containers/notification_container';
// import ColumnSettingsContainer from './containers/column_settings_container';
// import FilterBarContainer from './containers/filter_bar_container';
import ScrollableList from '../../components/scrollable_list';
import LoadMore from '../../components/load_more';
// import TimelineQueueButtonHeader from '../../components/timeline_queue_button_header';
const messages = defineMessages({
title: { id: 'column.notifications', defaultMessage: 'Notifications' },
});
import TimelineQueueButtonHeader from '../../components/timeline_queue_button_header';
const getNotifications = createSelector([
state => state.getIn(['settings', 'notifications', 'quickFilter', 'show']),
@@ -127,13 +122,39 @@ class Notifications extends ImmutablePureComponent {
let scrollableContent = null;
// const filterBarContainer = showFilterBar
// ? (<FilterBarContainer />)
// : null;
// : todo : include follow requests
console.log("notifications:", notifications)
console.log('notifications:', notifications)
let filteredNotifications = {follows:[]}
notifications.forEach((notification) => {
// const createdAt = notification.get('createdAt')
// const account = notification.get('account')
const type = notification.get('type')
const status = notification.get('status')
if (type === 'follow') {
filteredNotifications.follows.push(notification)
} else if (type === 'favourite') {
if (filteredNotifications[status] === undefined) {
filteredNotifications[status] = {}
}
if (filteredNotifications[status]['favorite'] === undefined) {
filteredNotifications[status].favorite = []
}
filteredNotifications[status].favorite.push(notification)
} else if (type === 'poll') {
if (filteredNotifications[status] === undefined) {
filteredNotifications[status] = {}
}
if (filteredNotifications[status]['poll'] === undefined) {
filteredNotifications[status].poll = []
}
filteredNotifications[status].poll.push(notification)
}
})
console.log('filteredNotifications:', filteredNotifications)
if (isLoading && this.scrollableContent) {
scrollableContent = this.scrollableContent;
@@ -161,28 +182,29 @@ class Notifications extends ImmutablePureComponent {
this.scrollableContent = scrollableContent;
const scrollContainer = (
<ScrollableList
scrollKey='notifications'
isLoading={isLoading}
showLoading={isLoading && notifications.size === 0}
hasMore={hasMore}
emptyMessage={<FormattedMessage id='empty_column.notifications' defaultMessage="You don't have any notifications yet. Interact with others to start the conversation." />}
onLoadMore={this.handleLoadOlder}
onScrollToTop={this.handleScrollToTop}
onScroll={this.handleScroll}
>
{ scrollableContent }
</ScrollableList>
);
return (
<div ref={this.setColumnRef}>
{ /* filterBarContainer */ }
{ /* <TimelineQueueButtonHeader onClick={this.handleDequeueNotifications} count={totalQueuedNotificationsCount} itemType='notification' /> */ }
{ scrollContainer }
<TimelineQueueButtonHeader
onClick={this.handleDequeueNotifications}
count={totalQueuedNotificationsCount}
itemType='notification'
/>
<ScrollableList
scrollKey='notifications'
isLoading={isLoading}
showLoading={isLoading && notifications.size === 0}
hasMore={hasMore}
emptyMessage={<FormattedMessage id='empty_column.notifications' defaultMessage="You don't have any notifications yet. Interact with others to start the conversation." />}
onLoadMore={this.handleLoadOlder}
onScrollToTop={this.handleScrollToTop}
onScroll={this.handleScroll}
>
{ scrollableContent }
</ScrollableList>
</div>
);
)
}
}

4
app/javascript/gabsocial/features/status/components/card/card.js
View File

@@ -167,7 +167,7 @@ export default class Card extends ImmutablePureComponent {
{trim(card.get('description') || '', maxDescription)}
</p>
<span className={[_s.default, _s.marginTopAuto, _s.flexRow, _s.alignItemsCenter, _s.colorSecondary, _s.text, _s.displayFlex, _s.textOverflowEllipsis, _s.fontSize13PX].join(' ')}>
<Icon id='link' width='10px' height='10px' className={[_s.fillcolorSecondary, _s.marginRight5PX].join(' ')} fixedWidth />
<Icon id='link' width='10px' height='10px' className={[_s.fillColorSecondary, _s.marginRight5PX].join(' ')} fixedWidth />
{provider}
</span>
</div>
@@ -222,7 +222,7 @@ export default class Card extends ImmutablePureComponent {
} else {
embed = (
<div className={[_s.default, _s.paddingVertical15PX, _s.paddingHorizontal15PX, _s.width72PX, _s.alignItemsCenter, _s.justifyContentCenter].join(' ')}>
<Icon id='file-text' width='22px' height='22px' className={_s.fillcolorSecondary} />
<Icon id='file-text' width='22px' height='22px' className={_s.fillColorSecondary} />
</div>
)
}

4
app/javascript/gabsocial/features/ui/ui.js
View File

@@ -43,7 +43,6 @@ import {
Followers,
Following,
// Reblogs,
// Favorites,
// DirectTimeline,
// HashtagTimeline,
Notifications,
@@ -197,9 +196,6 @@ class SwitchingArea extends PureComponent {
{ /*
<Redirect from='/@:username/media' to='/:username/media' />
<WrappedRoute path='/:username/media' component={AccountGallery} page={ProfilePage} content={children} />
<Redirect from='/@:username/tagged/:tag' to='/:username/tagged/:tag' exact />
<WrappedRoute path='/:username/tagged/:tag' exact component={AccountTimeline} page={ProfilePage} content={children} />
*/ }
<Redirect from='/@:username/favorites' to='/:username/favorites' />
<WrappedRoute path='/:username/favorites' page={ProfilePage} component={FavoritedStatuses} content={children} />