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-29 18:32:49 -04:00
parent 5efe40f301
commit 03de4c4fea
92 changed files with 1132 additions and 787 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -27,8 +27,8 @@ export default class ComposeExtraButton extends PureComponent {
} = this.props
const btnClasses = cx({
backgroundColorSubtle_onHover: !active,
backgroundColorBrandLight: active,
bgSubtle_onHover: !active,
bgBrandLight: active,
py10: !small,
px10: !small,
py5: small,
@@ -37,8 +37,8 @@ export default class ComposeExtraButton extends PureComponent {
})
const iconClasses = cx({
fillColorSecondary: !active,
fillColorWhite: active,
fillSecondary: !active,
fillWhite: active,
})
const iconSize = !!small ? '14px' : '16px'

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

@@ -257,7 +257,7 @@ class ComposeForm extends ImmutablePureComponent {
alignItemsEnd: shouldCondense,
flexRow: shouldCondense,
radiusSmall: shouldCondense,
backgroundColorSubtle: shouldCondense,
bgSubtle: shouldCondense,
px5: shouldCondense,
})
@@ -427,7 +427,7 @@ class ComposeForm extends ImmutablePureComponent {
isDisabled={disabledButton}
backgroundColor='none'
color='brand'
className={[_s.fontSize15PX, _s.px15].join(' ')}
className={[_s.fs15PX, _s.px15].join(' ')}
onClick={this.handleSubmit}
>
{intl.formatMessage(scheduledAt ? messages.schedulePost : messages.publish)}

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

@@ -278,7 +278,7 @@ class PollFormOption extends ImmutablePureComponent {
className={[_s.ml5, _s.justifyContentCenter].join(' ')}
icon='close'
iconSize='8px'
iconClassName={_s.fillColorSecondary}
iconClassName={_s.fillSecondary}
disabled={index <= 1}
title={intl.formatMessage(messages.remove_option)}
onClick={this.handleOptionRemove}

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

@@ -88,7 +88,7 @@ class Followers extends ImmutablePureComponent {
>
{
!!accountIds && accountIds.map((id) => (
<Account key={`follower-${id}`} id={id} compact />
<Account key={`follower-${id}`} id={id} compact withBio />
))
}
</ScrollableList>

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

@@ -88,7 +88,7 @@ class Following extends ImmutablePureComponent {
>
{
!!accountIds && accountIds.map((id) => (
<Account key={`following-${id}`} id={id} compact />
<Account key={`following-${id}`} id={id} compact withBio />
))
}
</ScrollableList>

5
app/javascript/gabsocial/features/list_timeline.js
View File

@@ -10,6 +10,7 @@ import StatusList from '../components/status_list'
import ColumnIndicator from '../components/column_indicator'
import Button from '../components/button'
import Text from '../components/text'
import Block from '../components/block'
const mapStateToProps = (state, props) => ({
list: state.getIn(['lists', props.params.id]),
@@ -85,7 +86,7 @@ class ListTimeline extends ImmutablePureComponent {
}
const emptyMessage = (
<div className={[_s.default].join(' ')}>
<div className={[_s.default, _s.py15, _s.px15].join(' ')}>
<FormattedMessage
id='empty_column.list'
defaultMessage='There is nothing in this list yet. When members of this list post new statuses, they will appear here.'
@@ -95,7 +96,7 @@ class ListTimeline extends ImmutablePureComponent {
onClick={this.handleEditClick}
className={[_s.mt10]}
>
<Text color='inherit'>
<Text color='inherit' align='center'>
<FormattedMessage id='list.click_to_add' defaultMessage='Click here to add people' />
</Text>
</Button>

6
app/javascript/gabsocial/features/lists_directory.js
View File

@@ -16,9 +16,7 @@ const mapStateToProps = (state) => ({
})
const mapDispatchToProps = (dispatch) => ({
onFetchLists() {
return dispatch(fetchLists())
},
onFetchLists: () => dispatch(fetchLists()),
})
export default
@@ -37,7 +35,7 @@ class ListsDirectory extends ImmutablePureComponent {
}
updateOnProps = [
'lists'
'lists',
]
componentDidMount() {

117
app/javascript/gabsocial/features/search.js
View File

@@ -13,6 +13,7 @@ import Heading from '../components/heading'
import Button from '../components/button'
import Text from '../components/text'
import Account from '../components/account'
import PanelLayout from '../components/panel/panel_layout'
const mapStateToProps = (state) => ({
results: state.getIn(['search', 'results']),
@@ -38,14 +39,14 @@ class Search extends ImmutablePureComponent {
isSmallScreen: (window.innerWidth <= 895),
}
render () {
render() {
const { results, location } = this.props
const { isSmallScreen } = this.state
console.log("results:", results)
if (results.isEmpty() && isSmallScreen) {
return (
<div />
)
return null
}
const pathname = location.pathname || ''
@@ -53,58 +54,94 @@ class Search extends ImmutablePureComponent {
const showHashtags = pathname === '/search/hashtags'
const showGroups = pathname === '/search/groups'
const isTop = !showPeople && !showHashtags && !showGroups
const theLimit = 10
let accounts, statuses, hashtags, groups
// : todo : statuses
if (results.get('accounts') && results.get('accounts').size > 0 && (isTop || showPeople)) {
const size = isTop ? Math.min(results.get('accounts').size, 5) : results.get('accounts').size;
const size = isTop ? Math.min(results.get('accounts').size, theLimit) : results.get('accounts').size;
const isMax = size === results.get('accounts').size
accounts = (
<Block>
<div className={[_s.default, _s.py15].join(' ')}>
<div className={[_s.default, _s.flexRow, _s.mb15, _s.px15].join(' ')}>
<Heading size='h2'>
People
</Heading>
<div className={[_s.default, _s.mlAuto].join(' ')}>
<Button
isText
backgroundColor='none'
color='brand'
to='/search/people'
>
<Text size='small' color='inherit' weight='bold'>
See All
</Text>
</Button>
</div>
</div>
{
results.get('accounts').slice(0, size).map(accountId => <Account compact key={accountId} id={accountId} />)
}
<PanelLayout
title='People'
headerButtonTo={isMax ? undefined : '/search/people'}
headerButtonTitle={isMax ? undefined : 'See more'}
footerButtonTo={isMax ? undefined : '/search/people'}
footerButtonTitle={isMax ? undefined : 'See more'}
noPadding
>
<div className={[_s.default, _s.pb10, _s.px15, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
<Text color='tertiary' size='small'>
Showing {size} of {results.get('accounts').size} results
</Text>
</div>
</Block>
{
results.get('accounts').slice(0, size).map(accountId => (
<Account
compact
withBio
key={accountId}
id={accountId}
/>
))
}
</PanelLayout>
)
}
if (results.get('groups') && results.get('groups').size > 0 && (isTop || showGroups)) {
const size = isTop ? Math.min(results.get('groups').size, 5) : results.get('groups').size;
const size = isTop ? Math.min(results.get('groups').size, theLimit) : results.get('groups').size;
const isMax = size === results.get('groups').size
groups = (
<div className='search-results__section'>
<h5><Icon id='users' fixedWidth /><FormattedMessage id='search_results.groups' defaultMessage='Groups' /></h5>
{results.get('groups').slice(0, size).map(group => <GroupListItem key={`search-${group.get('name')}`} group={group} />)}
</div>
);
<PanelLayout
title='Groups'
headerButtonTo={isMax ? undefined : '/search/groups'}
headerButtonTitle={isMax ? undefined : 'See more'}
footerButtonTo={isMax ? undefined : '/search/groups'}
footerButtonTitle={isMax ? undefined : 'See more'}
noPadding
>
<div className={[_s.default, _s.pb10, _s.px15, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
<Text color='tertiary' size='small'>
Showing {size} of {results.get('groups').size} results
</Text>
</div>
{
results.get('groups').slice(0, size).map(group => (
<GroupListItem
key={`search-${group.get('name')}`}
id={group.get('id')}
/>
))
}
</PanelLayout>
)
}
if (results.get('hashtags') && results.get('hashtags').size > 0 && (isTop || showHashtags)) {
const size = isTop ? Math.min(results.get('hashtags').size, 5) : results.get('hashtags').size;
const size = isTop ? Math.min(results.get('hashtags').size, theLimit) : results.get('hashtags').size;
const isMax = size === results.get('hashtags').size
hashtags = (
<div className='search-results__section'>
<h5><Icon id='hashtag' fixedWidth /><FormattedMessage id='search_results.hashtags' defaultMessage='Hashtags' /></h5>
<PanelLayout
title='Hashtags'
headerButtonTo={isMax ? undefined : '/search/hashtags'}
headerButtonTitle={isMax ? undefined : 'See more'}
footerButtonTo={isMax ? undefined : '/search/hashtags'}
footerButtonTitle={isMax ? undefined : 'See more'}
noPadding
>
<div className={[_s.default, _s.pb10, _s.px15, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
<Text color='tertiary' size='small'>
Showing {size} of {results.get('hashtags').size} results
</Text>
</div>
{results.get('hashtags').slice(0, size).map(hashtag => <HashtagItem isCompact key={hashtag.get('name')} hashtag={hashtag} />)}
</div>
);
</PanelLayout>
)
}
return (

12
app/javascript/gabsocial/features/status.js Normal file
View File

@@ -0,0 +1,12 @@
import StatusContainer from '../containers/status_container'
export default class Status extends PureComponent {
render() {
console.log("this.props:", this.props)
return (
<StatusContainer {...this.props} />
)
}
}

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

@@ -63,7 +63,7 @@ import {
Notifications,
Search,
// Shortcuts,
Status,
StatusFeature,
StatusLikes,
StatusReposts,
} from './util/async_components'
@@ -206,7 +206,7 @@ class SwitchingArea extends PureComponent {
<WrappedRoute path='/:username/likes' page={ProfilePage} component={LikedStatuses} content={children} />
<Redirect from='/@:username/posts/:statusId' to='/:username/posts/:statusId' exact />
<WrappedRoute path='/:username/posts/:statusId' publicRoute exact page={BasicPage} component={Status} content={children} componentParams={{ title: 'Status' }} />
<WrappedRoute path='/:username/posts/:statusId' publicRoute exact page={BasicPage} component={StatusFeature} content={children} componentParams={{ title: 'Status' }} />
<Redirect from='/@:username/posts/:statusId/reposts' to='/:username/posts/:statusId/reposts' />
<WrappedRoute path='/:username/posts/:statusId/reposts' page={BasicPage} component={StatusReposts} content={children} componentParams={{ title: 'Reposts' }} />
@@ -497,7 +497,7 @@ class UI extends PureComponent {
return (
<div ref={this.setRef}>
<LoadingBar className={[_s.height1PX, _s.z3, _s.backgroundColorBrandLight].join(' ')} />
<LoadingBar className={[_s.height1PX, _s.z3, _s.bgBrandLight].join(' ')} />
<SwitchingArea location={location} onLayoutChange={this.handleLayoutChange}>
{children}

1
app/javascript/gabsocial/features/ui/util/async_components.js
View File

@@ -59,6 +59,7 @@ export function ReportModal() { return import(/* webpackChunkName: "modals/repor
export function RepostOptionsPopover() { return import(/* webpackChunkName: "components/repost_options_popover" */'../../../components/popover/repost_options_popover') }
export function Search() { return import(/*webpackChunkName: "features/search" */'../../search') }
export function Status() { return import(/* webpackChunkName: "components/status" */'../../../components/status') }
export function StatusFeature() { return import(/* webpackChunkName: "features/status" */'../../status') }
export function SearchPopover() { return import(/* webpackChunkName: "components/search_popover" */'../../../components/popover/search_popover') }
export function SidebarMorePopover() { return import(/* webpackChunkName: "components/sidebar_more_popover" */'../../../components/popover/sidebar_more_popover') }
export function StatusLikes() { return import(/* webpackChunkName: "features/status_likes" */'../../status_likes') }