kopia lustrzana https://gitlab.com/soapbox-pub/soapbox
Media: prefer V2 media API when available
rodzic
ddad49480b
commit
a6f5cf33d0
|
@ -1,11 +1,34 @@
|
|||
import api from '../api';
|
||||
import { getFeatures } from 'soapbox/utils/features';
|
||||
|
||||
const noOp = () => {};
|
||||
|
||||
export function uploadMedia(data, onUploadProgress = noOp) {
|
||||
return function(dispatch, getState) {
|
||||
export function uploadMediaV1(data, onUploadProgress = noOp) {
|
||||
return (dispatch, getState) => {
|
||||
return api(getState).post('/api/v1/media', data, {
|
||||
onUploadProgress: onUploadProgress,
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export function uploadMediaV2(data, onUploadProgress = noOp) {
|
||||
return (dispatch, getState) => {
|
||||
return api(getState).post('/api/v2/media', data, {
|
||||
onUploadProgress: onUploadProgress,
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export function uploadMedia(data, onUploadProgress = noOp) {
|
||||
return (dispatch, getState) => {
|
||||
const state = getState();
|
||||
const instance = state.get('instance');
|
||||
const features = getFeatures(instance);
|
||||
|
||||
if (features.mediaV2) {
|
||||
return dispatch(uploadMediaV2(data, onUploadProgress));
|
||||
} else {
|
||||
return dispatch(uploadMediaV1(data, onUploadProgress));
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
@ -140,7 +140,7 @@ export default class IconButton extends React.PureComponent {
|
|||
? <div className='icon-button__emoji' dangerouslySetInnerHTML={{ __html: emojify(emoji) }} aria-hidden='true' />
|
||||
: <Icon id={icon} src={src} fixedWidth aria-hidden='true' />}
|
||||
</div>
|
||||
{text && <span className='icon_button__text'>{text}</span>}
|
||||
{text && <span className='icon-button__text'>{text}</span>}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
@ -169,7 +169,7 @@ export default class IconButton extends React.PureComponent {
|
|||
? <div className='icon-button__emoji' style={{ transform: `rotate(${rotate}deg)` }} dangerouslySetInnerHTML={{ __html: emojify(emoji) }} aria-hidden='true' />
|
||||
: <Icon id={icon} src={src} style={{ transform: `rotate(${rotate}deg)` }} fixedWidth aria-hidden='true' />}
|
||||
</div>
|
||||
{text && <span className='icon_button__text'>{text}</span>}
|
||||
{text && <span className='icon-button__text'>{text}</span>}
|
||||
</button>
|
||||
)}
|
||||
</Motion>
|
||||
|
|
|
@ -7,6 +7,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
|
|||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import classNames from 'classnames';
|
||||
import Icon from 'soapbox/components/icon';
|
||||
import IconButton from 'soapbox/components/icon_button';
|
||||
import Blurhash from 'soapbox/components/blurhash';
|
||||
|
||||
const MIMETYPE_ICONS = {
|
||||
|
@ -153,8 +154,20 @@ class Upload extends ImmutablePureComponent {
|
|||
backgroundPosition: `${x}% ${y}%` }}
|
||||
>
|
||||
<div className={classNames('compose-form__upload__actions', { active })}>
|
||||
<button className='icon-button' onClick={this.handleUndoClick}><Icon id='times' /> <FormattedMessage id='upload_form.undo' defaultMessage='Delete' /></button>
|
||||
{mediaType !== 'unknown' && <button className='icon-button' onClick={this.handleOpenModal}><Icon id='search-plus' /> <FormattedMessage id='upload_form.preview' defaultMessage='Preview' /></button>}
|
||||
<IconButton
|
||||
onClick={this.handleUndoClick}
|
||||
src={require('@tabler/icons/icons/x.svg')}
|
||||
text={<FormattedMessage id='upload_form.undo' defaultMessage='Delete' />}
|
||||
/>
|
||||
|
||||
{/* Only display the "Preview" button for a valid attachment with a URL */}
|
||||
{(mediaType !== 'unknown' && Boolean(media.get('url'))) && (
|
||||
<IconButton
|
||||
onClick={this.handleOpenModal}
|
||||
src={require('@tabler/icons/icons/zoom-in.svg')}
|
||||
text={<FormattedMessage id='upload_form.preview' defaultMessage='Preview' />}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className={classNames('compose-form__upload-description', { active })}>
|
||||
|
|
|
@ -26,6 +26,10 @@ export const getFeatures = createSelector([
|
|||
suggestions: v.software === MASTODON && gte(v.compatVersion, '2.4.3'),
|
||||
suggestionsV2: v.software === MASTODON && gte(v.compatVersion, '3.4.0'),
|
||||
trends: v.software === MASTODON && gte(v.compatVersion, '3.0.0'),
|
||||
mediaV2: any([
|
||||
v.software === MASTODON && gte(v.compatVersion, '3.1.3'),
|
||||
v.software === PLEROMA && gte(v.version, '2.1.0'),
|
||||
]),
|
||||
emojiReacts: v.software === PLEROMA && gte(v.version, '2.0.0'),
|
||||
emojiReactsRGI: v.software === PLEROMA && gte(v.version, '2.2.49'),
|
||||
attachmentLimit: v.software === PLEROMA ? Infinity : 4,
|
||||
|
|
|
@ -86,7 +86,7 @@
|
|||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
.icon_button__text {
|
||||
&__text {
|
||||
font-size: 14px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
.icon-button {
|
||||
display: inline-block;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 0;
|
||||
color: var(--primary-text-color);
|
||||
border: 0;
|
||||
|
@ -12,6 +13,10 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
&__text {
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
|
|
Ładowanie…
Reference in New Issue