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-04-23 02:13:29 -04:00
parent fed036be08
commit e2e7e8c0af
177 changed files with 1231 additions and 1326 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/javascript/gabsocial/components/panel/group_info_panel.js
View File

@@ -37,17 +37,17 @@ class GroupInfoPanel extends ImmutablePureComponent {
{group.get('title')}
</Heading>
<Divider small />
<Divider isSmall />
<div className={[_s.default, _s.flexRow, _s.justifyContentCenter].join(' ')}>
<div className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')}>
<Icon id='group' height='14px' width='14px' />
<Icon id='group' size='14px' />
<Text size='small' className={_s.ml5}>
{intl.formatMessage(messages.members)}
</Text>
</div>
<Button
text
isText
to={`/groups/${group.get('id')}/members`}
color='brand'
backgroundColor='none'
@@ -61,7 +61,7 @@ class GroupInfoPanel extends ImmutablePureComponent {
</Button>
</div>
<Divider small />
<Divider isSmall />
<Text>
{group.get('description')}

8
app/javascript/gabsocial/components/panel/list_details_panel.js
View File

@@ -55,10 +55,10 @@ class ListDetailsPanel extends ImmutablePureComponent {
</Text>
</div>
<Divider small />
<Divider isSmall />
<div className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')}>
<Icon id='calendar' width='12px' height='12px' className={_s.fillColorSecondary} />
<Icon id='calendar' size='12px' className={_s.fillColorSecondary} />
<Text
size='small'
color='secondary'
@@ -72,11 +72,11 @@ class ListDetailsPanel extends ImmutablePureComponent {
</Text>
</div>
<Divider small />
<Divider isSmall />
<div className={[_s.default].join(' ')}>
<div className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')}>
<Icon id='group' width='12px' height='12px' className={_s.fillColorSecondary} />
<Icon id='group' size='12px' className={_s.fillColorSecondary} />
<Text
size='small'
color='secondary'

8
app/javascript/gabsocial/components/panel/lists_panel.js
View File

@@ -1,17 +1,11 @@
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { defineMessages, injectIntl } from 'react-intl'
import { createSelector } from 'reselect'
import { getOrderedLists } from '../../selectors'
import { fetchLists } from '../../actions/lists'
import PanelLayout from './panel_layout'
import List from '../list'
const getOrderedLists = createSelector([state => state.get('lists')], lists => {
if (!lists) return lists
return lists.toList().filter(item => !!item).sort((a, b) => a.get('title').localeCompare(b.get('title')))
})
const messages = defineMessages({
title: { id: 'lists.subheading', defaultMessage: 'Your Lists' },
show_all: { id: 'groups.sidebar-panel.show_all', defaultMessage: 'Show all' },

6
app/javascript/gabsocial/components/panel/panel_layout.js
View File

@@ -45,7 +45,7 @@ export default class PanelLayout extends PureComponent {
(!!headerButtonTitle && (!!headerButtonAction || !!headerButtonTo)) &&
<div className={[_s.default, _s.marginLeftAuto].join(' ')}>
<Button
text
isText
backgroundColor='none'
color='brand'
to={headerButtonTo}
@@ -82,14 +82,14 @@ export default class PanelLayout extends PureComponent {
(!!footerButtonTitle && (!!footerButtonAction || !!footerButtonTo)) &&
<div className={[_s.default, _s.borderColorSecondary, _s.borderTop1PX].join(' ')}>
<Button
text
isText
color='none'
backgroundColor='none'
to={footerButtonTo}
onClick={footerButtonAction}
className={[_s.px15, _s.py15, _s.backgroundSubtle_onHover].join(' ')}
>
<Text color='brand' align='left' size='medium'>
<Text color='brand' size='medium'>
{footerButtonTitle}
</Text>
</Button>

10
app/javascript/gabsocial/components/panel/profile_info_panel.js
View File

@@ -62,12 +62,12 @@ class ProfileInfoPanel extends ImmutablePureComponent {
hasNote &&
<Fragment>
<div className={_s.dangerousContent} dangerouslySetInnerHTML={content} />
<Divider small />
<Divider isSmall />
</Fragment>
}
<div className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')}>
<Icon id='calendar' width='12px' height='12px' className={_s.fillColorSecondary} />
<Icon id='calendar' size='12px' className={_s.fillColorSecondary} />
<Text
size='small'
color='secondary'
@@ -85,7 +85,7 @@ class ProfileInfoPanel extends ImmutablePureComponent {
<div className={[_s.default]}>
{identityProofs.map((proof, i) => (
<Fragment>
<Divider small />
<Divider isSmall />
<dl className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')} key={`profile-identity-proof-${i}`}>
<dt
className={_s.dangerousContent}
@@ -96,7 +96,7 @@ class ProfileInfoPanel extends ImmutablePureComponent {
<dd className='verified'>
<a href={proof.get('proof_url')} target='_blank' rel='noopener noreferrer'>
<span title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(proof.get('updated_at'), dateFormatOptions) })}>
<Icon id='check' className='verified__mark' />
<Icon id='check' size='12px' className='verified__mark' />
</span>
</a>
<a href={proof.get('profile_url')} target='_blank' rel='noopener noreferrer'>
@@ -113,7 +113,7 @@ class ProfileInfoPanel extends ImmutablePureComponent {
{
fields.map((pair, i) => (
<Fragment>
<Divider small />
<Divider isSmall />
<dl className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')} key={`profile-field-${i}`}>
<dt
className={[_s.text, _s.dangerousContent].join(' ')}

41
app/javascript/gabsocial/components/panel/user_panel.js
View File

@@ -6,6 +6,7 @@ import classNames from 'classnames/bind'
import { me } from '../../initial_state'
import { makeGetAccount } from '../../selectors'
import { shortNumberFormat } from '../../utils/numbers'
import { openModal } from '../../actions/modal'
import Button from '../button'
import DisplayName from '../display_name'
import Avatar from '../avatar'
@@ -20,25 +21,37 @@ const messages = defineMessages({
followers: { id: 'account.followers', defaultMessage: 'Followers' },
follows: { id: 'account.follows', defaultMessage: 'Follows' },
edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
headerPhoto: { id: 'header_photo', defaultMessage: 'Header photo' },
})
const mapStateToProps = (state) => ({
account: makeGetAccount()(state, me),
})
const mapDispatchToProps = (dispatch) => ({
onOpenEditProfile() {
dispatch(openModal('EDIT_PROFILE'))
},
})
export default
@connect(mapStateToProps)
@connect(mapStateToProps, mapDispatchToProps)
@injectIntl
class UserPanel extends ImmutablePureComponent {
static propTypes = {
account: ImmutablePropTypes.map,
account: ImmutablePropTypes.map.isRequired,
intl: PropTypes.object.isRequired,
onOpenEditProfile: PropTypes.func.isRequired,
}
state = {
hovering: false,
}
updateOnProps = [
'account'
]
handleOnMouseEnter = () => {
this.setState({ hovering: true })
}
@@ -47,12 +60,16 @@ class UserPanel extends ImmutablePureComponent {
this.setState({ hovering: false })
}
handleOnOpenEditProfile = () => {
this.props.onOpenEditProfile()
}
render() {
const { account, intl } = this.props
const { hovering } = this.state
const buttonClasses = cx({
positionAbsolute: 1,
posAbs: 1,
mt10: 1,
mr10: 1,
top0: 1,
@@ -60,14 +77,17 @@ class UserPanel extends ImmutablePureComponent {
displayNone: !hovering,
})
const acct = account.get('acct')
return (
<PanelLayout noPadding>
<div
className={[_s.default, _s.height122PX].join(' ')}
onMouseEnter={() => this.handleOnMouseEnter()}
onMouseLeave={() => this.handleOnMouseLeave()}
onMouseEnter={this.handleOnMouseEnter}
onMouseLeave={this.handleOnMouseLeave}
>
<Image
alt={intl.formatMessage(messages.headerPhoto)}
className={_s.height122PX}
src={account.get('header_static')}
/>
@@ -76,6 +96,7 @@ class UserPanel extends ImmutablePureComponent {
backgroundColor='secondary'
radiusSmall
className={buttonClasses}
onClick={this.handleOnOpenEditProfile}
>
{intl.formatMessage(messages.edit_profile)}
</Button>
@@ -83,9 +104,9 @@ class UserPanel extends ImmutablePureComponent {
<NavLink
className={[_s.default, _s.flexRow, _s.py10, _s.px15, _s.noUnderline].join(' ')}
to={`/${account.get('acct')}`}
to={`/${acct}`}
>
<div className={[_s.default, _s.marginTopNeg30PX, _s.circle, _s.borderColorWhite, _s.border2PX].join(' ')}>
<div className={[_s.default, _s.mtNeg30PX, _s.circle, _s.borderColorWhite, _s.border2PX].join(' ')}>
<Avatar account={account} size={62} />
</div>
<div className={[_s.default, _s.ml15].join(' ')}>
@@ -95,17 +116,17 @@ class UserPanel extends ImmutablePureComponent {
<div className={[_s.default, _s.mb15, _s.mt5, _s.flexRow, _s.px15].join(' ')}>
<UserStat
to={`/${account.get('acct')}`}
to={`/${acct}`}
title={intl.formatMessage(messages.gabs)}
value={shortNumberFormat(account.get('statuses_count'))}
/>
<UserStat
to={`/${account.get('acct')}/followers`}
to={`/${acct}/followers`}
title={intl.formatMessage(messages.followers)}
value={shortNumberFormat(account.get('followers_count'))}
/>
<UserStat
to={`/${account.get('acct')}/following`}
to={`/${acct}/following`}
title={intl.formatMessage(messages.follows)}
value={shortNumberFormat(account.get('following_count'))}
/>

65
app/javascript/gabsocial/components/panel/who_to_follow_panel.js
View File

@@ -1,19 +1,19 @@
import { defineMessages, injectIntl } from 'react-intl';
import { fetchSuggestions, dismissSuggestion } from '../../actions/suggestions';
import ImmutablePureComponent from 'react-immutable-pure-component';
import ImmutablePropTypes from 'react-immutable-proptypes';
import Account from '../../components/account';
import PanelLayout from './panel_layout';
import { defineMessages, injectIntl } from 'react-intl'
import { fetchSuggestions, dismissSuggestion } from '../../actions/suggestions'
import ImmutablePureComponent from 'react-immutable-pure-component'
import ImmutablePropTypes from 'react-immutable-proptypes'
import Account from '../../components/account'
import PanelLayout from './panel_layout'
const messages = defineMessages({
dismissSuggestion: { id: 'suggestions.dismiss', defaultMessage: 'Dismiss suggestion' },
title: { id: 'who_to_follow.title', defaultMessage: 'Who to Follow' },
show_more: { id: 'who_to_follow.more', defaultMessage: 'Show more' },
});
})
const mapStateToProps = (state) => ({
suggestions: state.getIn(['suggestions', 'items']),
});
})
const mapDispatchToProps = (dispatch) => ({
fetchSuggestions: () => dispatch(fetchSuggestions()),
@@ -26,25 +26,26 @@ export default
class WhoToFollowPanel extends ImmutablePureComponent {
static propTypes = {
suggestions: ImmutablePropTypes.list.isRequired,
fetchSuggestions: PropTypes.func.isRequired,
dismissSuggestion: PropTypes.func.isRequired,
fetchSuggestions: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
};
suggestions: ImmutablePropTypes.list.isRequired,
}
updateOnProps = [
'suggestions',
]
componentDidMount () {
this.props.fetchSuggestions();
this.props.fetchSuggestions()
}
render() {
const { intl, /* suggestions, */ dismissSuggestion } = this.props;
// : testing!!! :
const suggestions = [
"1","1","1",
]
// if (suggestions.isEmpty()) {
// return null;
// }
const { intl, suggestions, dismissSuggestion } = this.props
if (suggestions.isEmpty()) {
return null
}
return (
<PanelLayout
@@ -53,16 +54,18 @@ class WhoToFollowPanel extends ImmutablePureComponent {
footerButtonTo='/explore'
>
<div className={_s.default}>
{suggestions && suggestions.map(accountId => (
<Account
showDismiss
key={accountId}
id={accountId}
dismissAction={dismissSuggestion}
/>
))}
{
suggestions.map(accountId => (
<Account
showDismiss
key={accountId}
id={accountId}
dismissAction={dismissSuggestion}
/>
))
}
</div>
</PanelLayout>
);
};
};
)
}
}