Progress on little important things

removing .mov for now until we can figure out solution with videojs, added model to track username changes, got chat creation flow down, progress on bookmark collections, albums, filtering blocks/mutes from group, explore, collection timelines
This commit is contained in:
mgabdev
2020-12-22 01:36:38 -05:00
parent 2bbb5be505
commit 6fbea0a59e
37 changed files with 406 additions and 135 deletions

View File

@@ -1,63 +0,0 @@
import React from 'react'
import PropTypes from 'prop-types'
import { Sparklines, SparklinesCurve } from 'react-sparklines'
import { FormattedMessage } from 'react-intl'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { NavLink } from 'react-router-dom'
import Button from './button'
import Block from './block'
import Text from './text'
class HashtagItem extends ImmutablePureComponent {
render() {
const { hashtag, isCompact } = this.props
if (!hashtag) return
const count = hashtag.get('history').map((block) => {
return parseInt(block.get('uses'))
}).reduce((a, c) => a + c)
return (
<Block>
<div className={[_s.d, _s.w100PC].join(' ')}>
<div className={[_s.d, _s.noUnderline, _s.px15, _s.py5].join(' ')}>
<div className={[_s.d, _s.flexRow, _s.aiCenter].join(' ')}>
<div>
<Text color='brand' size='medium' weight='bold' className={[_s.py2, _s.lineHeight15].join(' ')}>
#{hashtag.get('name')}
</Text>
</div>
</div>
{
!isCompact &&
<Text color='secondary' size='small' className={_s.py2}>
<FormattedMessage id='number_of_gabs' defaultMessage='{count} Gabs' values={{
count,
}} />
</Text>
}
</div>
<Sparklines
width={50}
height={28}
data={hashtag.get('history').reverse().map((day) => day.get('uses')).toArray()}
>
<SparklinesCurve style={{ fill: 'none' }} />
</Sparklines>
</div>
</Block>
)
}
}
HashtagItem.propTypes = {
hashtag: ImmutablePropTypes.map.isRequired,
isCompact: PropTypes.bool,
}
export default HashtagItem

View File

@@ -49,6 +49,8 @@ class MediaItem extends ImmutablePureComponent {
if (!attachment) return
const hash = attachment.get('blurhash')
if (!hash) return
const pixels = decode(hash, 160, 160)
if (pixels && this.canvas) {
@@ -103,7 +105,7 @@ class MediaItem extends ImmutablePureComponent {
const statusUrl = `/${account.getIn(['acct'])}/posts/${status.get('id')}`
const isSmallRatio = aspectRatio < 1
const isSquare = aspectRatio === 1
const isSquare = aspectRatio === 1 || isSmall
const containerClasses = CX({
d: 1,
px5: 1,

View File

@@ -33,12 +33,9 @@ class ChatNavigationBar extends React.PureComponent {
const otherAccounts = chatConversation ? chatConversation.get('other_accounts') : null
const nameHTML = !!otherAccounts ? otherAccounts.get(0).get('display_name_html') : ''
// : todo :
// fix padding on mobile device
return (
<div className={[_s.d, _s.z4, _s.h53PX, _s.w100PC].join(' ')}>
<div className={[_s.d, _s.h53PX, _s.bgNavigation, _s.aiCenter, _s.z3, _s.top0, _s.right0, _s.left0, _s.posFixed].join(' ')} >
<div className={[_s.d, _s.z4, _s.minH53PX, _s.w100PC].join(' ')}>
<div className={[_s.d, _s.minH53PX, _s.bgNavigation, _s.aiCenter, _s.z3, _s.top0, _s.right0, _s.left0, _s.posFixed].join(' ')} >
<div className={[_s.d, _s.flexRow, _s.saveAreaInsetPT, _s.saveAreaInsetPL, _s.saveAreaInsetPR, _s.w100PC].join(' ')}>

View File

@@ -34,9 +34,9 @@ class ComposeNavigationBar extends React.PureComponent {
})
return (
<div className={[_s.d, _s.z4, _s.h53PX, _s.w100PC].join(' ')}>
<div className={[_s.d, _s.h53PX, _s.bgNavigation, _s.aiCenter, _s.z3, _s.top0, _s.right0, _s.left0, _s.posFixed].join(' ')} >
<div className={[_s.d, _s.z4, _s.minH53PX, _s.w100PC].join(' ')}>
<div className={[_s.d, _s.minH53PX, _s.bgNavigation, _s.aiCenter, _s.z3, _s.top0, _s.right0, _s.left0, _s.posFixed].join(' ')} >
<div className={innerClasses}>
<BackButton

View File

@@ -57,7 +57,7 @@ class MediaGalleryPanel extends ImmutablePureComponent {
headerButtonTitle={!!account ? intl.formatMessage(messages.show_all) : undefined}
headerButtonTo={!!account ? `/${account.get('acct')}/albums` : undefined}
>
<div className={[_s.d, _s.flexRow, _s.flexWrap, _s.px10, _s.py10].join(' ')}>
<div className={[_s.d, _s.flexRow, _s.flexWrap, _s.aiCenter, _s.jcCenter].join(' ')}>
{
!!account && attachments.size > 0 &&
attachments.slice(0, 16).map((attachment, i) => (

View File

@@ -108,6 +108,7 @@ class Poll extends ImmutablePureComponent {
aiCenter: !showResults,
})
// : todo : fix widths and truncate for large poll options
return (
<li className={listItemClasses} key={option.get('title')}>
{

View File

@@ -16,6 +16,7 @@ import {
addShortcut,
removeShortcut,
} from '../actions/shortcuts'
import { createChatConversation } from '../actions/chat_conversations'
import { openModal } from '../actions/modal'
import { openPopover } from '../actions/popover'
import { me } from '../initial_state'
@@ -32,6 +33,10 @@ import ProfileHeaderXSPlaceholder from './placeholder/profile_header_xs_placehol
class ProfileHeader extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object
}
state = {
stickied: false,
}
@@ -71,6 +76,15 @@ class ProfileHeader extends ImmutablePureComponent {
}
}
handleOnCreateChatConversation = () => {
const { account } = this.props
const accountId = !!account ? account.get('id') : null
if (!accountId) return
this.props.onCreateChatConversation(accountId, this.context.router.history)
}
setOpenMoreNodeRef = (n) => {
this.openMoreNode = n
}
@@ -226,10 +240,8 @@ class ProfileHeader extends ImmutablePureComponent {
iconClassName={_s.inheritFill}
color='brand'
backgroundColor='none'
// : TODO :
className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10].join(' ')}
onClick={this.handleOpenMore}
buttonRef={this.setOpenMoreNodeRef}
onClick={this.handleOnCreateChatConversation}
/>
</div>
<div className={[_s.d, _s.flexRow, _s.h40PX].join(' ')}>
@@ -373,10 +385,8 @@ class ProfileHeader extends ImmutablePureComponent {
iconClassName={_s.inheritFill}
color='brand'
backgroundColor='none'
// : TODO :
className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10].join(' ')}
onClick={this.handleOpenMore}
buttonRef={this.setOpenMoreNodeRef}
onClick={this.handleOnCreateChatConversation}
/>
</div>
}
@@ -435,6 +445,9 @@ const mapDispatchToProps = (dispatch) => ({
onRemoveShortcut(accountId) {
dispatch(removeShortcut(null, 'account', accountId))
},
onCreateChatConversation(accountId, routerHistory) {
dispatch(createChatConversation(accountId, routerHistory))
},
});
ProfileHeader.propTypes = {

View File

@@ -34,6 +34,7 @@ class StatusCheckBox extends ImmutablePureComponent {
src={video.get('url')}
alt={video.get('description')}
aspectRatio={video.getIn(['meta', 'small', 'aspect'])}
fileContentType={video.get('file_content_type')}
width={239}
height={110}
inline

View File

@@ -67,6 +67,7 @@ class StatusMedia extends ImmutablePureComponent {
src={video.get('url')}
alt={video.get('description')}
aspectRatio={video.getIn(['meta', 'small', 'aspect'])}
fileContentType={video.get('file_content_type')}
sensitive={status.get('sensitive')}
height={110}
width={width}

View File

@@ -31,7 +31,10 @@ class Video extends ImmutablePureComponent {
}
componentDidMount() {
videoJsOptions.sources = [{ src: this.props.src }]
videoJsOptions.sources = [{
src: this.props.src,
type: this.props.fileContentType,
}]
this.videoPlayer = videojs(this.video, videoJsOptions)
}
@@ -193,6 +196,7 @@ Video.propTypes = {
blurhash: PropTypes.string,
aspectRatio: PropTypes.number,
meta: ImmutablePropTypes.map,
fileContentType: PropTypes.string,
}
export default injectIntl(Video)