commit
b5684e9874
@ -1,59 +0,0 @@ |
|||||||
import React, { Fragment } from 'react'; |
|
||||||
import ReactDOM from 'react-dom'; |
|
||||||
import PropTypes from 'prop-types'; |
|
||||||
import { IntlProvider, addLocaleData } from 'react-intl'; |
|
||||||
import { getLocale } from '../locales'; |
|
||||||
import Card from '../features/status/components/card'; |
|
||||||
import ModalRoot from '../components/modal_root'; |
|
||||||
import MediaModal from '../features/ui/components/media_modal'; |
|
||||||
import { fromJS } from 'immutable'; |
|
||||||
|
|
||||||
const { localeData, messages } = getLocale(); |
|
||||||
addLocaleData(localeData); |
|
||||||
|
|
||||||
export default class CardsContainer extends React.PureComponent { |
|
||||||
|
|
||||||
static propTypes = { |
|
||||||
locale: PropTypes.string, |
|
||||||
cards: PropTypes.object.isRequired, |
|
||||||
}; |
|
||||||
|
|
||||||
state = { |
|
||||||
media: null, |
|
||||||
}; |
|
||||||
|
|
||||||
handleOpenCard = (media) => { |
|
||||||
document.body.classList.add('card-standalone__body'); |
|
||||||
this.setState({ media }); |
|
||||||
} |
|
||||||
|
|
||||||
handleCloseCard = () => { |
|
||||||
document.body.classList.remove('card-standalone__body'); |
|
||||||
this.setState({ media: null }); |
|
||||||
} |
|
||||||
|
|
||||||
render () { |
|
||||||
const { locale, cards } = this.props; |
|
||||||
|
|
||||||
return ( |
|
||||||
<IntlProvider locale={locale} messages={messages}> |
|
||||||
<Fragment> |
|
||||||
{[].map.call(cards, container => { |
|
||||||
const { card, ...props } = JSON.parse(container.getAttribute('data-props')); |
|
||||||
|
|
||||||
return ReactDOM.createPortal( |
|
||||||
<Card card={fromJS(card)} onOpenMedia={this.handleOpenCard} {...props} />, |
|
||||||
container, |
|
||||||
); |
|
||||||
})} |
|
||||||
<ModalRoot onClose={this.handleCloseCard}> |
|
||||||
{this.state.media && ( |
|
||||||
<MediaModal media={this.state.media} index={0} onClose={this.handleCloseCard} /> |
|
||||||
)} |
|
||||||
</ModalRoot> |
|
||||||
</Fragment> |
|
||||||
</IntlProvider> |
|
||||||
); |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
@ -0,0 +1,90 @@ |
|||||||
|
import React, { PureComponent, Fragment } from 'react'; |
||||||
|
import ReactDOM from 'react-dom'; |
||||||
|
import PropTypes from 'prop-types'; |
||||||
|
import { IntlProvider, addLocaleData } from 'react-intl'; |
||||||
|
import { getLocale } from '../locales'; |
||||||
|
import MediaGallery from '../components/media_gallery'; |
||||||
|
import Video from '../features/video'; |
||||||
|
import Card from '../features/status/components/card'; |
||||||
|
import ModalRoot from '../components/modal_root'; |
||||||
|
import MediaModal from '../features/ui/components/media_modal'; |
||||||
|
import { List as ImmutableList, fromJS } from 'immutable'; |
||||||
|
|
||||||
|
const { localeData, messages } = getLocale(); |
||||||
|
addLocaleData(localeData); |
||||||
|
|
||||||
|
const MEDIA_COMPONENTS = { MediaGallery, Video, Card }; |
||||||
|
|
||||||
|
export default class MediaContainer extends PureComponent { |
||||||
|
|
||||||
|
static propTypes = { |
||||||
|
locale: PropTypes.string.isRequired, |
||||||
|
components: PropTypes.object.isRequired, |
||||||
|
}; |
||||||
|
|
||||||
|
state = { |
||||||
|
media: null, |
||||||
|
index: null, |
||||||
|
time: null, |
||||||
|
}; |
||||||
|
|
||||||
|
handleOpenMedia = (media, index) => { |
||||||
|
document.body.classList.add('media-standalone__body'); |
||||||
|
this.setState({ media, index }); |
||||||
|
} |
||||||
|
|
||||||
|
handleOpenVideo = (video, time) => { |
||||||
|
const media = ImmutableList([video]); |
||||||
|
|
||||||
|
document.body.classList.add('media-standalone__body'); |
||||||
|
this.setState({ media, time }); |
||||||
|
} |
||||||
|
|
||||||
|
handleCloseMedia = () => { |
||||||
|
document.body.classList.remove('media-standalone__body'); |
||||||
|
this.setState({ media: null, index: null, time: null }); |
||||||
|
} |
||||||
|
|
||||||
|
render () { |
||||||
|
const { locale, components } = this.props; |
||||||
|
|
||||||
|
return ( |
||||||
|
<IntlProvider locale={locale} messages={messages}> |
||||||
|
<Fragment> |
||||||
|
{[].map.call(components, (component, i) => { |
||||||
|
const componentName = component.getAttribute('data-component'); |
||||||
|
const Component = MEDIA_COMPONENTS[componentName]; |
||||||
|
const { media, card, ...props } = JSON.parse(component.getAttribute('data-props')); |
||||||
|
|
||||||
|
Object.assign(props, { |
||||||
|
...(media ? { media: fromJS(media) } : {}), |
||||||
|
...(card ? { card: fromJS(card) } : {}), |
||||||
|
|
||||||
|
...(componentName === 'Video' ? { |
||||||
|
onOpenVideo: this.handleOpenVideo, |
||||||
|
} : { |
||||||
|
onOpenMedia: this.handleOpenMedia, |
||||||
|
}), |
||||||
|
}); |
||||||
|
|
||||||
|
return ReactDOM.createPortal( |
||||||
|
<Component {...props} key={`media-${i}`} />, |
||||||
|
component, |
||||||
|
); |
||||||
|
})} |
||||||
|
<ModalRoot onClose={this.handleCloseMedia}> |
||||||
|
{this.state.media && ( |
||||||
|
<MediaModal |
||||||
|
media={this.state.media} |
||||||
|
index={this.state.index || 0} |
||||||
|
time={this.state.time} |
||||||
|
onClose={this.handleCloseMedia} |
||||||
|
/> |
||||||
|
)} |
||||||
|
</ModalRoot> |
||||||
|
</Fragment> |
||||||
|
</IntlProvider> |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
} |
@ -1,68 +0,0 @@ |
|||||||
import React from 'react'; |
|
||||||
import ReactDOM from 'react-dom'; |
|
||||||
import PropTypes from 'prop-types'; |
|
||||||
import { IntlProvider, addLocaleData } from 'react-intl'; |
|
||||||
import { getLocale } from '../locales'; |
|
||||||
import MediaGallery from '../components/media_gallery'; |
|
||||||
import ModalRoot from '../components/modal_root'; |
|
||||||
import MediaModal from '../features/ui/components/media_modal'; |
|
||||||
import { fromJS } from 'immutable'; |
|
||||||
|
|
||||||
const { localeData, messages } = getLocale(); |
|
||||||
addLocaleData(localeData); |
|
||||||
|
|
||||||
export default class MediaGalleriesContainer extends React.PureComponent { |
|
||||||
|
|
||||||
static propTypes = { |
|
||||||
locale: PropTypes.string.isRequired, |
|
||||||
galleries: PropTypes.object.isRequired, |
|
||||||
}; |
|
||||||
|
|
||||||
state = { |
|
||||||
media: null, |
|
||||||
index: null, |
|
||||||
}; |
|
||||||
|
|
||||||
handleOpenMedia = (media, index) => { |
|
||||||
document.body.classList.add('media-gallery-standalone__body'); |
|
||||||
this.setState({ media, index }); |
|
||||||
} |
|
||||||
|
|
||||||
handleCloseMedia = () => { |
|
||||||
document.body.classList.remove('media-gallery-standalone__body'); |
|
||||||
this.setState({ media: null, index: null }); |
|
||||||
} |
|
||||||
|
|
||||||
render () { |
|
||||||
const { locale, galleries } = this.props; |
|
||||||
|
|
||||||
return ( |
|
||||||
<IntlProvider locale={locale} messages={messages}> |
|
||||||
<React.Fragment> |
|
||||||
{[].map.call(galleries, gallery => { |
|
||||||
const { media, ...props } = JSON.parse(gallery.getAttribute('data-props')); |
|
||||||
|
|
||||||
return ReactDOM.createPortal( |
|
||||||
<MediaGallery |
|
||||||
{...props} |
|
||||||
media={fromJS(media)} |
|
||||||
onOpenMedia={this.handleOpenMedia} |
|
||||||
/>, |
|
||||||
gallery |
|
||||||
); |
|
||||||
})} |
|
||||||
<ModalRoot onClose={this.handleCloseMedia}> |
|
||||||
{this.state.media === null || this.state.index === null ? null : ( |
|
||||||
<MediaModal |
|
||||||
media={this.state.media} |
|
||||||
index={this.state.index} |
|
||||||
onClose={this.handleCloseMedia} |
|
||||||
/> |
|
||||||
)} |
|
||||||
</ModalRoot> |
|
||||||
</React.Fragment> |
|
||||||
</IntlProvider> |
|
||||||
); |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
@ -1,26 +0,0 @@ |
|||||||
import React from 'react'; |
|
||||||
import PropTypes from 'prop-types'; |
|
||||||
import { IntlProvider, addLocaleData } from 'react-intl'; |
|
||||||
import { getLocale } from '../locales'; |
|
||||||
import Video from '../features/video'; |
|
||||||
|
|
||||||
const { localeData, messages } = getLocale(); |
|
||||||
addLocaleData(localeData); |
|
||||||
|
|
||||||
export default class VideoContainer extends React.PureComponent { |
|
||||||
|
|
||||||
static propTypes = { |
|
||||||
locale: PropTypes.string.isRequired, |
|
||||||
}; |
|
||||||
|
|
||||||
render () { |
|
||||||
const { locale, ...props } = this.props; |
|
||||||
|
|
||||||
return ( |
|
||||||
<IntlProvider locale={locale} messages={messages}> |
|
||||||
<Video {...props} /> |
|
||||||
</IntlProvider> |
|
||||||
); |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
@ -0,0 +1,11 @@ |
|||||||
|
# frozen_string_literal: true |
||||||
|
|
||||||
|
class ImproveIndexOnStatusesForApiV1AccountsAccountIdStatuses < ActiveRecord::Migration[5.1] |
||||||
|
disable_ddl_transaction! |
||||||
|
|
||||||
|
def change |
||||||
|
add_index :statuses, [:account_id, :id, :visibility], where: 'visibility IN (0, 1, 2)', algorithm: :concurrently |
||||||
|
add_index :statuses, [:account_id, :id], where: 'visibility = 3', algorithm: :concurrently |
||||||
|
remove_index :statuses, column: [:account_id, :id, :visibility, :updated_at], order: { id: :desc }, algorithm: :concurrently, name: :index_statuses_20180106 |
||||||
|
end |
||||||
|
end |
@ -0,0 +1,14 @@ |
|||||||
|
# frozen_string_literal: true |
||||||
|
|
||||||
|
class RevertIndexChangeOnStatusesForApiV1AccountsAccountIdStatuses < ActiveRecord::Migration[5.1] |
||||||
|
disable_ddl_transaction! |
||||||
|
|
||||||
|
def change |
||||||
|
safety_assured do |
||||||
|
add_index :statuses, [:account_id, :id, :visibility, :updated_at], order: { id: :desc }, algorithm: :concurrently, name: :index_statuses_20180106 |
||||||
|
end |
||||||
|
|
||||||
|
remove_index :statuses, column: [:account_id, :id, :visibility], where: 'visibility IN (0, 1, 2)', algorithm: :concurrently |
||||||
|
remove_index :statuses, column: [:account_id, :id], where: 'visibility = 3', algorithm: :concurrently |
||||||
|
end |
||||||
|
end |
Loading…
Reference in new issue