Fix dimensions of preview cards, fix crash in web UI, fix warning (#9133)
Eugen Rochko
GitHub
parent
057c91a4e2
commit
766a808de4
|
|
@ -1,52 +0,0 @@
|
|||
import api from '../api';
|
||||
|
||||
export const STATUS_CARD_FETCH_REQUEST = 'STATUS_CARD_FETCH_REQUEST';
|
||||
export const STATUS_CARD_FETCH_SUCCESS = 'STATUS_CARD_FETCH_SUCCESS';
|
||||
export const STATUS_CARD_FETCH_FAIL = 'STATUS_CARD_FETCH_FAIL';
|
||||
|
||||
export function fetchStatusCard(id) {
|
||||
return (dispatch, getState) => {
|
||||
if (getState().getIn(['cards', id], null) !== null) {
|
||||
return;
|
||||
}
|
||||
|
||||
dispatch(fetchStatusCardRequest(id));
|
||||
|
||||
api(getState).get(`/api/v1/statuses/${id}/card`).then(response => {
|
||||
if (!response.data.url) {
|
||||
return;
|
||||
}
|
||||
|
||||
dispatch(fetchStatusCardSuccess(id, response.data));
|
||||
}).catch(error => {
|
||||
dispatch(fetchStatusCardFail(id, error));
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
export function fetchStatusCardRequest(id) {
|
||||
return {
|
||||
type: STATUS_CARD_FETCH_REQUEST,
|
||||
id,
|
||||
skipLoading: true,
|
||||
};
|
||||
};
|
||||
|
||||
export function fetchStatusCardSuccess(id, card) {
|
||||
return {
|
||||
type: STATUS_CARD_FETCH_SUCCESS,
|
||||
id,
|
||||
card,
|
||||
skipLoading: true,
|
||||
};
|
||||
};
|
||||
|
||||
export function fetchStatusCardFail(id, error) {
|
||||
return {
|
||||
type: STATUS_CARD_FETCH_FAIL,
|
||||
id,
|
||||
error,
|
||||
skipLoading: true,
|
||||
skipAlert: true,
|
||||
};
|
||||
};
|
||||
|
|
@ -3,7 +3,6 @@ import openDB from '../storage/db';
|
|||
import { evictStatus } from '../storage/modifier';
|
||||
|
||||
import { deleteFromTimelines } from './timelines';
|
||||
import { fetchStatusCard } from './cards';
|
||||
import { importFetchedStatus, importFetchedStatuses, importAccount, importStatus } from './importer';
|
||||
|
||||
export const STATUS_FETCH_REQUEST = 'STATUS_FETCH_REQUEST';
|
||||
|
|
@ -86,7 +85,6 @@ export function fetchStatus(id) {
|
|||
const skipLoading = getState().getIn(['statuses', id], null) !== null;
|
||||
|
||||
dispatch(fetchContext(id));
|
||||
dispatch(fetchStatusCard(id));
|
||||
|
||||
if (skipLoading) {
|
||||
return;
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@ export default class StatusContent extends React.PureComponent {
|
|||
}
|
||||
|
||||
const readMoreButton = (
|
||||
<button className='status__content__read-more-button' onClick={this.props.onClick}>
|
||||
<button className='status__content__read-more-button' onClick={this.props.onClick} key='read-more'>
|
||||
<FormattedMessage id='status.read_more' defaultMessage='Read more' /><i className='fa fa-fw fa-angle-right' />
|
||||
</button>
|
||||
);
|
||||
|
|
@ -197,6 +197,7 @@ export default class StatusContent extends React.PureComponent {
|
|||
<div
|
||||
ref={this.setRef}
|
||||
tabIndex='0'
|
||||
key='content'
|
||||
className={classNames}
|
||||
style={directionStyle}
|
||||
dangerouslySetInnerHTML={content}
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ export default class Card extends React.PureComponent {
|
|||
card: ImmutablePropTypes.map,
|
||||
maxDescription: PropTypes.number,
|
||||
onOpenMedia: PropTypes.func.isRequired,
|
||||
compact: PropTypes.boolean,
|
||||
compact: PropTypes.bool,
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
|
|
@ -120,7 +120,7 @@ export default class Card extends React.PureComponent {
|
|||
const content = { __html: addAutoPlay(card.get('html')) };
|
||||
const { width } = this.state;
|
||||
const ratio = card.get('width') / card.get('height');
|
||||
const height = card.get('width') > card.get('height') ? (width / ratio) : (width * ratio);
|
||||
const height = width / ratio;
|
||||
|
||||
return (
|
||||
<div
|
||||
|
|
@ -145,8 +145,8 @@ export default class Card extends React.PureComponent {
|
|||
const interactive = card.get('type') !== 'link';
|
||||
const className = classnames('status-card', { horizontal, compact, interactive });
|
||||
const title = interactive ? <a className='status-card__title' href={card.get('url')} title={card.get('title')} rel='noopener' target='_blank'><strong>{card.get('title')}</strong></a> : <strong className='status-card__title' title={card.get('title')}>{card.get('title')}</strong>;
|
||||
const ratio = compact ? 16 / 9 : card.get('width') / card.get('height');
|
||||
const height = card.get('width') > card.get('height') ? (width / ratio) : (width * ratio);
|
||||
const ratio = card.get('width') / card.get('height');
|
||||
const height = (compact && !embedded) ? (width / (16 / 9)) : (width / ratio);
|
||||
|
||||
const description = (
|
||||
<div className='status-card__content'>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import MediaGallery from '../../../components/media_gallery';
|
|||
import AttachmentList from '../../../components/attachment_list';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { FormattedDate, FormattedNumber } from 'react-intl';
|
||||
import CardContainer from '../containers/card_container';
|
||||
import Card from './card';
|
||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import Video from '../../video';
|
||||
|
||||
|
|
@ -80,7 +80,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
|
|||
);
|
||||
}
|
||||
} else if (status.get('spoiler_text').length === 0) {
|
||||
media = <CardContainer onOpenMedia={this.props.onOpenMedia} statusId={status.get('id')} />;
|
||||
media = <Card onOpenMedia={this.props.onOpenMedia} card={status.get('card', null)} />;
|
||||
}
|
||||
|
||||
if (status.get('application')) {
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import Card from '../components/card';
|
||||
|
||||
const mapStateToProps = (state, { statusId }) => ({
|
||||
card: state.getIn(['statuses', statusId, 'card'], null),
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps)(Card);
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
import { STATUS_CARD_FETCH_SUCCESS } from '../actions/cards';
|
||||
|
||||
import { Map as ImmutableMap, fromJS } from 'immutable';
|
||||
|
||||
const initialState = ImmutableMap();
|
||||
|
||||
export default function cards(state = initialState, action) {
|
||||
switch(action.type) {
|
||||
case STATUS_CARD_FETCH_SUCCESS:
|
||||
return state.set(action.id, fromJS(action.card));
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
};
|
||||
|
|
@ -10,7 +10,6 @@ import {
|
|||
STATUS_REVEAL,
|
||||
STATUS_HIDE,
|
||||
} from '../actions/statuses';
|
||||
import { STATUS_CARD_FETCH_SUCCESS } from '../actions/cards';
|
||||
import { TIMELINE_DELETE } from '../actions/timelines';
|
||||
import { STATUS_IMPORT, STATUSES_IMPORT } from '../actions/importer';
|
||||
import { Map as ImmutableMap, fromJS } from 'immutable';
|
||||
|
|
@ -66,8 +65,6 @@ export default function statuses(state = initialState, action) {
|
|||
});
|
||||
case TIMELINE_DELETE:
|
||||
return deleteStatus(state, action.id, action.references);
|
||||
case STATUS_CARD_FETCH_SUCCESS:
|
||||
return state.setIn([action.id, 'card'], fromJS(action.card));
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue