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

Progress

Browse Source 
added composer query string functionality for url, text. fixed issue with no user in base_controller, cleaned up video component, albums starting
This commit is contained in:
mgabdev
2020-12-17 23:46:37 -05:00
parent 47d57960a4
commit 47cd60f851
19 changed files with 269 additions and 676 deletions
Download Patch File Download Diff File Expand all files Collapse all files

202
app/javascript/gabsocial/features/account_albums.js
View File

@@ -7,109 +7,149 @@ import { injectIntl, defineMessages } from 'react-intl'
import { expandAccountMediaTimeline } from '../actions/timelines'
import { getAccountGallery } from '../selectors'
import ColumnIndicator from '../components/column_indicator'
import Heading from '../components/heading'
import TabBar from '../components/tab_bar'
import MediaItem from '../components/media_item'
import LoadMore from '../components/load_more'
import Block from '../components/block'
import Image from '../components/image'
import Album from '../components/album'
import MediaGalleryPlaceholder from '../components/placeholder/media_gallery_placeholder'
class AccountAlbums extends ImmutablePureComponent {
componentDidMount() {
const { accountId, mediaType } = this.props
// componentDidMount() {
// const { accountId, mediaType } = this.props
if (accountId && accountId !== -1) {
this.props.dispatch(expandAccountMediaTimeline(accountId, { mediaType }))
}
}
// if (accountId && accountId !== -1) {
// this.props.dispatch(expandAccountMediaTimeline(accountId, { mediaType }))
// }
// }
componentWillReceiveProps(nextProps) {
if (
(nextProps.accountId && nextProps.accountId !== this.props.accountId) ||
(nextProps.accountId && nextProps.mediaType !== this.props.mediaType)
) {
this.props.dispatch(expandAccountMediaTimeline(nextProps.accountId, {
mediaType: nextProps.mediaType,
}))
}
}
// componentWillReceiveProps(nextProps) {
// if (
// (nextProps.accountId && nextProps.accountId !== this.props.accountId) ||
// (nextProps.accountId && nextProps.mediaType !== this.props.mediaType)
// ) {
// this.props.dispatch(expandAccountMediaTimeline(nextProps.accountId, {
// mediaType: nextProps.mediaType,
// }))
// }
// }
handleScrollToBottom = () => {
if (this.props.hasMore) {
this.handleLoadMore(this.props.attachments.size > 0 ? this.props.attachments.last().getIn(['status', 'id']) : undefined)
}
}
// handleScrollToBottom = () => {
// if (this.props.hasMore) {
// this.handleLoadMore(this.props.attachments.size > 0 ? this.props.attachments.last().getIn(['status', 'id']) : undefined)
// }
// }
handleScroll = (e) => {
const { scrollTop, scrollHeight, clientHeight } = e.target
const offset = scrollHeight - scrollTop - clientHeight
// handleScroll = (e) => {
// const { scrollTop, scrollHeight, clientHeight } = e.target
// const offset = scrollHeight - scrollTop - clientHeight
if (150 > offset && !this.props.isLoading) {
this.handleScrollToBottom()
}
}
// if (150 > offset && !this.props.isLoading) {
// this.handleScrollToBottom()
// }
// }
handleLoadMore = (maxId) => {
if (this.props.accountId && this.props.accountId !== -1) {
this.props.dispatch(expandAccountMediaTimeline(this.props.accountId, {
maxId,
mediaType: this.props.mediaType,
}))
}
}
// handleLoadMore = (maxId) => {
// if (this.props.accountId && this.props.accountId !== -1) {
// this.props.dispatch(expandAccountMediaTimeline(this.props.accountId, {
// maxId,
// mediaType: this.props.mediaType,
// }))
// }
// }
handleLoadOlder = (e) => {
e.preventDefault()
this.handleScrollToBottom()
}
// handleLoadOlder = (e) => {
// e.preventDefault()
// this.handleScrollToBottom()
// }
render() {
const {
attachments,
isLoading,
hasMore,
intl,
account,
} = this.props
if (!account) return null
return (
<Block>
<div
role='feed'
onScroll={this.handleScroll}
className={[_s.d, _s.flexRow, _s.flexWrap, _s.py5, _s.px5].join(' ')}
>
{
attachments.map((attachment, i) => (
<MediaItem
key={attachment.get('id')}
attachment={attachment}
account={account}
/>
))
}
{
isLoading && attachments.size === 0 &&
<div className={[_s.d, _s.w100PC].join(' ')}>
<MediaGalleryPlaceholder />
</div>
}
{
!isLoading && attachments.size === 0 &&
<ColumnIndicator type='error' message={intl.formatMessage(messages.none)} />
}
<div className={[_s.d, _s.px10, _s.py10].join(' ')}>
<div className={[_s.d, _s.px5, _s.py5, _s.mb10].join(' ')}>
<Heading size='h2'>Photos</Heading>
</div>
<TabBar tabs={[
{
title: 'All Photos',
to: '/'
},
{
title: 'Albums',
isActive: true,
to: '/'
},
]}/>
</div>
{
hasMore && !(isLoading && attachments.size === 0) &&
<LoadMore visible={!isLoading} onClick={this.handleLoadOlder} />
}
<div className={[_s.d, _s.w100PC, _s.flexRow, _s.flexWrap, _s.px10, _s.mb15, _s.pb10].join(' ')}>
<Album />
<Album />
<Album />
<Album />
<Album />
<Album />
<Album isDummy />
<Album isDummy />
<Album isDummy />
<Album isDummy />
<Album isDummy />
<Album isDummy />
</div>
</Block>
)
// const {
// attachments,
// isLoading,
// hasMore,
// intl,
// account,
// } = this.props
// if (!account) return null
// return (
// <Block>
// <div
// role='feed'
// onScroll={this.handleScroll}
// className={[_s.d, _s.flexRow, _s.flexWrap, _s.py5, _s.px5].join(' ')}
// >
// {
// attachments.map((attachment, i) => (
// <MediaItem
// key={attachment.get('id')}
// attachment={attachment}
// account={account}
// />
// ))
// }
// {
// isLoading && attachments.size === 0 &&
// <div className={[_s.d, _s.w100PC].join(' ')}>
// <MediaGalleryPlaceholder />
// </div>
// }
// {
// !isLoading && attachments.size === 0 &&
// <ColumnIndicator type='error' message={intl.formatMessage(messages.none)} />
// }
// </div>
// {
// hasMore && !(isLoading && attachments.size === 0) &&
// <LoadMore visible={!isLoading} onClick={this.handleLoadOlder} />
// }
// </Block>
// )
}
}