pl-fe: Avoid external status links
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
parent
6aac80117b
commit
dd2404faf2
5 changed files with 13 additions and 33 deletions
|
|
@ -1,5 +1,6 @@
|
|||
import clsx from 'clsx';
|
||||
import React, { useState } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import Blurhash from 'pl-fe/components/blurhash';
|
||||
import Icon from 'pl-fe/components/icon';
|
||||
|
|
@ -118,7 +119,7 @@ const MediaItem: React.FC<IMediaItem> = ({ attachment, onOpenMedia, isLast }) =>
|
|||
|
||||
return (
|
||||
<div className='col-span-1'>
|
||||
<a className='media-gallery__item-thumbnail aspect-1' href={status.url} target='_blank' onClick={handleClick} title={title}>
|
||||
<Link className='media-gallery__item-thumbnail aspect-1' to={`/@${status.account.acct}/posts/${status.id}`} onClick={handleClick} title={title}>
|
||||
<Blurhash
|
||||
hash={attachment.blurhash}
|
||||
className={clsx('media-gallery__preview', {
|
||||
|
|
@ -128,7 +129,7 @@ const MediaItem: React.FC<IMediaItem> = ({ attachment, onOpenMedia, isLast }) =>
|
|||
/>
|
||||
{visible && thumbnail}
|
||||
{!visible && icon}
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ const AccountGallery = () => {
|
|||
|
||||
const handleOpenMedia = (attachment: AccountGalleryAttachment) => {
|
||||
if (attachment.type === 'video') {
|
||||
openModal('VIDEO', { media: attachment, statusId: attachment.status.id, account: attachment.account });
|
||||
openModal('VIDEO', { media: attachment, statusId: attachment.status.id });
|
||||
} else {
|
||||
const media = attachment.status.media_attachments;
|
||||
const index = media.findIndex((x) => x.id === attachment.id);
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ const GroupGallery: React.FC<IGroupGallery> = (props) => {
|
|||
|
||||
const handleOpenMedia = (attachment: AccountGalleryAttachment) => {
|
||||
if (attachment.type === 'video') {
|
||||
openModal('VIDEO', { media: attachment, statusId: attachment.status.id, account: attachment.account });
|
||||
openModal('VIDEO', { media: attachment, statusId: attachment.status.id });
|
||||
} else {
|
||||
const media = (attachment.status as Status).media_attachments;
|
||||
const index = media.findIndex((x) => x.id === attachment.id);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import clsx from 'clsx';
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import { Link } from 'react-router-dom';
|
||||
import ReactSwipeableViews from 'react-swipeable-views';
|
||||
|
||||
import { fetchStatusWithContext } from 'pl-fe/actions/statuses';
|
||||
|
|
@ -59,7 +59,6 @@ const MediaModal: React.FC<MediaModalProps & BaseModalProps> = (props) => {
|
|||
} = props;
|
||||
|
||||
const dispatch = useAppDispatch();
|
||||
const history = useHistory();
|
||||
const intl = useIntl();
|
||||
|
||||
const getStatus = useCallback(makeGetStatus(), []);
|
||||
|
|
@ -104,14 +103,6 @@ const MediaModal: React.FC<MediaModalProps & BaseModalProps> = (props) => {
|
|||
setNavigationHidden(value => !value && userTouching.matches);
|
||||
};
|
||||
|
||||
const handleStatusClick: React.MouseEventHandler = e => {
|
||||
if (status && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
|
||||
e.preventDefault();
|
||||
history.push(`/@${status.account.acct}/posts/${status?.id}`);
|
||||
onClose();
|
||||
}
|
||||
};
|
||||
|
||||
const content = media.map((attachment, i) => {
|
||||
let width: number | undefined, height: number | undefined;
|
||||
if (attachment.type === 'image' || attachment.type === 'gifv' || attachment.type === 'video') {
|
||||
|
|
@ -120,9 +111,9 @@ const MediaModal: React.FC<MediaModalProps & BaseModalProps> = (props) => {
|
|||
}
|
||||
|
||||
const link = (status && (
|
||||
<a href={status.url} onClick={handleStatusClick}>
|
||||
<Link to={`/@${status.account.acct}/posts/${status.id}`}>
|
||||
<FormattedMessage id='lightbox.view_context' defaultMessage='View context' />
|
||||
</a>
|
||||
</Link>
|
||||
));
|
||||
|
||||
if (attachment.type === 'image') {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, { useCallback } from 'react';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import Video from 'pl-fe/features/video';
|
||||
import { useAppSelector } from 'pl-fe/hooks';
|
||||
|
|
@ -8,34 +8,22 @@ import { makeGetStatus } from 'pl-fe/selectors';
|
|||
|
||||
import type { BaseModalProps } from '../modal-root';
|
||||
import type { MediaAttachment } from 'pl-api';
|
||||
import type { Account } from 'pl-fe/normalizers';
|
||||
|
||||
type VideoModalProps = {
|
||||
media: MediaAttachment;
|
||||
statusId: string;
|
||||
account?: Pick<Account, 'id' | 'acct'>;
|
||||
time?: number;
|
||||
};
|
||||
|
||||
const VideoModal: React.FC<VideoModalProps & BaseModalProps> = ({ statusId, account, media, time }) => {
|
||||
const VideoModal: React.FC<VideoModalProps & BaseModalProps> = ({ statusId, media, time }) => {
|
||||
const getStatus = useCallback(makeGetStatus(), []);
|
||||
|
||||
const status = useAppSelector(state => getStatus(state, { id: statusId }))!;
|
||||
const history = useHistory();
|
||||
|
||||
const handleStatusClick: React.MouseEventHandler = e => {
|
||||
if (!account) return;
|
||||
|
||||
if (e.button === 0 && !(e.ctrlKey || e.metaKey)) {
|
||||
e.preventDefault();
|
||||
history.push(`/@${account.acct}/posts/${status.id}`);
|
||||
}
|
||||
};
|
||||
|
||||
const link = status && account && (
|
||||
<a href={status.url} onClick={handleStatusClick}>
|
||||
const link = status && (
|
||||
<Link to={`/@${status.account.acct}/posts/${status.id}`}>
|
||||
<FormattedMessage id='lightbox.view_context' defaultMessage='View context' />
|
||||
</a>
|
||||
</Link>
|
||||
);
|
||||
|
||||
return (
|
||||
|
|
|
|||
Loading…
Reference in a new issue