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

Updated components to use BlockHeading 

• Updated:
- components to use BlockHeading
This commit is contained in:
mgabdev 2020-08-06 23:14:13 -05:00
parent 083a864be3
commit 6328b21186
7 changed files with 110 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -6,7 +6,7 @@ import { me } from '../initial_state'
import { fetchBlocks, expandBlocks } from '../actions/blocks'
import Account from '../components/account'
import Block from '../components/block'
import Heading from '../components/heading'
import BlockHeading from '../components/block_heading'
import ScrollableList from '../components/scrollable_list'
const messages = defineMessages({
@ -59,11 +59,7 @@ class Blocks extends ImmutablePureComponent {
return (
<Block>
<div className={[_s.default, _s.px15, _s.py10, _s.justifyContentCenter].join(' ')}>
<Heading size='h2'>
{intl.formatMessage(messages.blocks)}
</Heading>
</div>
<BlockHeading title={intl.formatMessage(messages.blocks)} />
<ScrollableList
scrollKey='blocked_accounts'
onLoadMore={this.handleLoadMore}

2
app/javascript/gabsocial/features/follow_requests.js
View File

@ -55,7 +55,7 @@ class FollowRequests extends ImmutablePureComponent {
} = this.props
const unlockedPrependMessage = locked ? null : (
<div className={[_s.default, _s.px15, _s.py15].join(' ')}>
<div className={[_s.default, _s.px15, _s.py15, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
<Text>
<FormattedMessage
id='follow_requests.unlocked_explanation'

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

@ -9,7 +9,7 @@ import {
import Account from '../components/account'
import ScrollableList from '../components/scrollable_list'
import Block from '../components/block'
import Heading from '../components/heading'
import BlockHeading from '../components/block_heading'
import AccountPlaceholder from '../components/placeholder/account_placeholder'
const mapStateToProps = (state, { account }) => {
@ -76,12 +76,7 @@ class Followers extends ImmutablePureComponent {
return (
<Block>
<div className={[_s.default, _s.px15, _s.py10, _s.justifyContentCenter].join(' ')}>
<Heading size='h2'>
{intl.formatMessage(messages.followers)}
</Heading>
</div>
<div className={[_s.default, _s.py10].join(' ')}>
<BlockHeading title={intl.formatMessage(messages.followers)} />
<ScrollableList
scrollKey='followers'
hasMore={hasMore}
@ -98,7 +93,6 @@ class Followers extends ImmutablePureComponent {
))
}
</ScrollableList>
</div>
</Block>
)
}

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

@ -9,7 +9,7 @@ import {
import Account from '../components/account'
import ScrollableList from '../components/scrollable_list'
import Block from '../components/block'
import Heading from '../components/heading'
import BlockHeading from '../components/block_heading'
import AccountPlaceholder from '../components/placeholder/account_placeholder'
const mapStateToProps = (state, { account }) => {
@ -76,12 +76,7 @@ class Following extends ImmutablePureComponent {
return (
<Block>
<div className={[_s.default, _s.px15, _s.py10, _s.justifyContentCenter].join(' ')}>
<Heading size='h2'>
{intl.formatMessage(messages.follows)}
</Heading>
</div>
<div className={[_s.default, _s.py10].join(' ')}>
<BlockHeading title={intl.formatMessage(messages.follows)} />
<ScrollableList
scrollKey='following'
hasMore={hasMore}
@ -98,7 +93,6 @@ class Following extends ImmutablePureComponent {
))
}
</ScrollableList>
</div>
</Block>
)
}

27
app/javascript/gabsocial/features/group_members.js
View File

@ -4,7 +4,6 @@ import debounce from 'lodash.debounce'
import isObject from 'lodash.isobject'
import { FormattedMessage } from 'react-intl'
import {
fetchGroup,
fetchMembers,
expandMembers,
} from '../actions/groups'
@ -12,13 +11,13 @@ import { openPopover } from '../actions/popover'
import Account from '../components/account'
import ColumnIndicator from '../components/column_indicator'
import Block from '../components/block'
import Heading from '../components/heading'
import BlockHeading from '../components/block_heading'
import Input from '../components/input'
import ScrollableList from '../components/scrollable_list'
const mapStateToProps = (state, { params }) => {
const groupId = isObject(params) ? params['id'] : null
const group = state.getIn(['groups', groupId])
const groupId = isObject(params) ? params['id'] : -1
const group = groupId === -1 ? null : state.getIn(['groups', groupId])
return {
group,
@ -30,9 +29,6 @@ const mapStateToProps = (state, { params }) => {
}
const mapDispatchToProps = (dispatch) => ({
onFetchGroup(groupId) {
dispatch(fetchGroup(groupId))
},
onFetchMembers(groupId) {
dispatch(fetchMembers(groupId))
},
@ -59,20 +55,10 @@ class GroupMembers extends ImmutablePureComponent {
accountIds: ImmutablePropTypes.list,
hasMore: PropTypes.bool,
onExpandMembers: PropTypes.func.isRequired,
onFetchGroup: PropTypes.func.isRequired,
onFetchMembers: PropTypes.func.isRequired,
onOpenGroupMemberOptions: PropTypes.func.isRequired,
}
componentDidMount() {
const { group, groupId } = this.props
if (!group && groupId) {
console.log("componentDidMount:", groupId)
this.props.onFetchGroup(groupId)
}
}
componentWillMount() {
const { groupId } = this.props
@ -109,11 +95,8 @@ class GroupMembers extends ImmutablePureComponent {
return (
<Block>
<div className={[_s.default, _s.px15, _s.py10].join(' ')}>
<div className={[_s.default, _s.flexRow, _s.alignItemsCenter].join(' ')}>
<Heading size='h2'>Members</Heading>
</div>
</div>
<BlockHeading title='Group Members' />
{
/* : todo :
<div className={[_s.default, _s.justifyContentCenter, _s.px15, _s.my5, _s.borderBottom1PX, _s.borderColorSecondary, _s.pt5, _s.pb15].join(' ')}>

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

@ -1,6 +1,8 @@
import ImmutablePureComponent from 'react-immutable-pure-component'
import ImmutablePropTypes from 'react-immutable-proptypes'
import { defineMessages, injectIntl } from 'react-intl'
import debounce from 'lodash.debounce'
import isObject from 'lodash.isobject'
import {
fetchRemovedAccounts,
expandRemovedAccounts,
@ -8,51 +10,82 @@ import {
} from '../actions/groups'
import { FormattedMessage } from 'react-intl'
import Account from '../components/account'
import Block from '../components/block'
import BlockHeading from '../components/block_heading'
import ColumnIndicator from '../components/column_indicator'
import ScrollableList from '../components/scrollable_list'
import { defineMessages, injectIntl } from 'react-intl'
const messages = defineMessages({
remove: { id: 'groups.removed_accounts', defaultMessage: 'Allow joining' },
})
const mapStateToProps = (state, { groupId }) => ({
group: state.getIn(['groups', groupId]),
const mapStateToProps = (state, { params }) => {
const groupId = isObject(params) ? params['id'] : -1
const group = groupId === -1 ? null : state.getIn(['groups', groupId])
return {
group,
groupId,
accountIds: state.getIn(['user_lists', 'groups_removed_accounts', groupId, 'items']),
hasMore: !!state.getIn(['user_lists', 'groups_removed_accounts', groupId, 'next']),
}
}
const mapDispatchToProps = (dispatch) => ({
onFetchRemovedAccounts(groupId) {
dispatch(fetchRemovedAccounts(groupId))
},
onExpandRemovedAccounts(groupId) {
dispatch(expandRemovedAccounts(groupId))
},
onRemoveRemovedAccount(groupId, accountId) {
dispatch(removeRemovedAccount(groupId, accountId))
},
})
export default
@connect(mapStateToProps)
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class GroupRemovedAccounts extends ImmutablePureComponent {
static propTypes = {
groupId: PropTypes.string.isRequired,
dispatch: PropTypes.func.isRequired,
accountIds: ImmutablePropTypes.list,
hasMore: PropTypes.bool,
onFetchRemovedAccounts: PropTypes.func.isRequired,
onExpandRemovedAccounts: PropTypes.func.isRequired,
onRemoveRemovedAccount: PropTypes.func.isRequired,
}
componentWillMount() {
const { groupId } = this.props
this.props.dispatch(fetchRemovedAccounts(groupId))
this.props.onFetchRemovedAccounts(groupId)
}
componentWillReceiveProps(nextProps) {
if (nextProps.groupId !== this.props.groupId) {
this.props.dispatch(fetchRemovedAccounts(nextProps.groupId))
this.props.onFetchRemovedAccounts(nextProps.groupId)
}
}
handleLoadMore = debounce(() => {
this.props.dispatch(expandRemovedAccounts(this.props.groupId))
this.props.onExpandRemovedAccounts(this.props.groupId)
}, 300, { leading: true })
render() {
const { accountIds, hasMore, group, intl } = this.props
const {
accountIds,
hasMore,
group,
intl,
} = this.props
if (!group) return <ColumnIndicator type='loading' />
return (
<Block>
<BlockHeading title='Removed Accounts' />
<ScrollableList
scrollKey='removed_accounts'
hasMore={hasMore}
@ -66,12 +99,13 @@ class GroupRemovedAccounts extends ImmutablePureComponent {
key={id}
id={id}
actionIcon='subtract'
onActionClick={() => this.props.dispatch(removeRemovedAccount(group.get('id'), id))}
onActionClick={() => this.props.onRemoveRemovedAccount(group.get('id'), id)}
actionTitle={intl.formatMessage(messages.remove)}
/>
))
}
</ScrollableList>
</Block>
)
}

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

@ -6,7 +6,7 @@ import { me } from '../initial_state'
import { fetchMutes, expandMutes } from '../actions/mutes'
import Account from '../components/account'
import Block from '../components/block'
import Heading from '../components/heading'
import BlockHeading from '../components/block_heading'
import ScrollableList from '../components/scrollable_list'
const mapStateToProps = (state) => ({
@ -50,11 +50,7 @@ class Mutes extends ImmutablePureComponent {
return (
<Block>
<div className={[_s.default, _s.px15, _s.py10, _s.justifyContentCenter].join(' ')}>
<Heading size='h2'>
<FormattedMessage id='navigation_bar.mutes' defaultMessage='Muted users' />
</Heading>
</div>
<BlockHeading title={<FormattedMessage id='navigation_bar.mutes' defaultMessage='Muted users' />} />
<ScrollableList
scrollKey='mutes'
onLoadMore={this.handleLoadMore}