matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: remove video modal

Browse Source 
Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2025-10-29 11:16:14 +01:00
parent 57a630567e
commit 8b5622f2a7
9 changed files with 9 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/pl-fe/src/components/status.tsx
View File

@ -125,16 +125,11 @@ const Status: React.FC<IStatus> = (props) => {
const handleHotkeyOpenMedia = (e?: KeyboardEvent) => {
const status = actualStatus;
const firstAttachment = status.media_attachments[0];
e?.preventDefault();
if (firstAttachment) {
if (firstAttachment.type === 'video') {
openModal('VIDEO', { statusId: status.id, media: firstAttachment, time: 0 });
} else {
openModal('MEDIA', { statusId: status.id, media: status.media_attachments, index: 0 });
}
if (status.media_attachments.length > 0) {
openModal('MEDIA', { statusId: status.id, media: status.media_attachments, index: 0 });
}
};

8
packages/pl-fe/src/features/status/components/thread.tsx
View File

@ -195,13 +195,7 @@ const Thread = ({
e?.preventDefault();
if (media && media.length) {
const firstAttachment = media[0];
if (media.length === 1 && firstAttachment.type === 'video') {
openModal('VIDEO', { media: firstAttachment, statusId: status.id });
} else {
openModal('MEDIA', { media, index: 0, statusId: status.id });
}
openModal('MEDIA', { media, index: 0, statusId: status.id });
}
};

3
packages/pl-fe/src/features/ui/components/modal-root.tsx
View File

@ -47,7 +47,6 @@ const MODAL_COMPONENTS = {
SELECT_BOOKMARK_FOLDER: lazy(() => import('pl-fe/modals/select-bookmark-folder-modal')),
TEXT_FIELD: lazy(() => import('pl-fe/modals/text-field-modal')),
UNAUTHORIZED: lazy(() => import('pl-fe/modals/unauthorized-modal')),
VIDEO: lazy(() => import('pl-fe/modals/video-modal')),
};
type ModalType = keyof typeof MODAL_COMPONENTS | null;
@ -58,7 +57,7 @@ type BaseModalProps = {
};
const ModalRoot: React.FC = () => {
const renderLoading = (modalId: string) => !['MEDIA', 'VIDEO', 'BOOST', 'CONFIRM'].includes(modalId) ? <ModalLoading /> : null;
const renderLoading = (modalId: string) => !['MEDIA', 'BOOST', 'CONFIRM'].includes(modalId) ? <ModalLoading /> : null;
const dispatch = useAppDispatch();
const modals = useModals();

6
packages/pl-fe/src/features/ui/components/panels/group-media-panel.tsx
View File

@ -20,11 +20,7 @@ const GroupMediaPanel: React.FC<IGroupMediaPanel> = ({ group }) => {
const { data: attachments, isLoading } = useGroupGallery(group.id);
const handleOpenMedia = (attachment: AccountGalleryAttachment): void => {
if (attachment.type === 'video') {
openModal('VIDEO', { media: attachment, statusId: attachment.status_id });
} else {
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
}
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
};
const renderAttachments = () => {

7
packages/pl-fe/src/features/ui/components/panels/profile-media-panel.tsx
View File

@ -20,12 +20,7 @@ const ProfileMediaPanel: React.FC<IProfileMediaPanel> = ({ account }) => {
const { data: attachments, isLoading } = useAccountGallery(account?.id!);
const handleOpenMedia = (attachment: AccountGalleryAttachment): void => {
if (attachment.type === 'video') {
openModal('VIDEO', { media: attachment, statusId: attachment.status_id });
} else {
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
}
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
};
const renderAttachments = () => {

46
packages/pl-fe/src/modals/video-modal.tsx
View File

@ -1,46 +0,0 @@
import React, { useCallback } from 'react';
import { FormattedMessage } from 'react-intl';
import { Link } from 'react-router-dom';
import Video from 'pl-fe/features/video';
import { useAppSelector } from 'pl-fe/hooks/use-app-selector';
import { makeGetStatus } from 'pl-fe/selectors';
import type { MediaAttachment } from 'pl-api';
import type { BaseModalProps } from 'pl-fe/features/ui/components/modal-root';
type VideoModalProps = {
media: MediaAttachment;
statusId: string;
time?: number;
};
const VideoModal: React.FC<VideoModalProps & BaseModalProps> = ({ statusId, media, time }) => {
const getStatus = useCallback(makeGetStatus(), []);
const status = useAppSelector(state => getStatus(state, { id: statusId }))!;
const link = status && (
<Link to={`/@${status.account.acct}/posts/${status.id}`}>
<FormattedMessage id='lightbox.view_context' defaultMessage='View context' />
</Link>
);
return (
<div className='pointer-events-auto mx-auto block w-full max-w-xl overflow-hidden rounded-2xl text-left align-middle shadow-xl transition-all'>
<Video
preview={media.preview_url}
blurhash={media.blurhash}
src={media.url}
startTime={time}
link={link}
detailed
autoFocus
alt={media.description}
visible
/>
</div>
);
};
export { type VideoModalProps, VideoModal as default };

6
packages/pl-fe/src/pages/accounts/account-gallery.tsx
View File

@ -169,11 +169,7 @@ const AccountGalleryPage = () => {
};
const handleOpenMedia = (attachment: AccountGalleryAttachment) => {
if (attachment.type === 'video') {
openModal('VIDEO', { media: attachment, statusId: attachment.status_id });
} else {
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
}
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
};
if (accountLoading || isLoading) {

6
packages/pl-fe/src/pages/groups/group-gallery.tsx
View File

@ -24,11 +24,7 @@ const GroupGallery: React.FC<IGroupGallery> = (props) => {
const { data: attachments, isFetching, isLoading, hasNextPage, fetchNextPage } = useGroupGallery(groupId);
const handleOpenMedia = (attachment: AccountGalleryAttachment) => {
if (attachment.type === 'video') {
openModal('VIDEO', { media: attachment, statusId: attachment.status_id });
} else {
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
}
openModal('MEDIA', { index: attachment.index, statusId: attachment.status_id });
};
if (isLoading || groupIsLoading) {

4
packages/pl-fe/src/stores/modals.ts
View File

@ -37,7 +37,6 @@ import type { ReportModalProps } from 'pl-fe/modals/report-modal';
import type { SelectBookmarkFolderModalProps } from 'pl-fe/modals/select-bookmark-folder-modal';
import type { TextFieldModalProps } from 'pl-fe/modals/text-field-modal';
import type { UnauthorizedModalProps } from 'pl-fe/modals/unauthorized-modal';
import type { VideoModalProps } from 'pl-fe/modals/video-modal';
type OpenModalProps =
| [type: 'ALT_TEXT', props: AltTextModalProps]
@ -75,8 +74,7 @@ type OpenModalProps =
| [type: 'REPORT', props: ReportModalProps]
| [type: 'SELECT_BOOKMARK_FOLDER', props: SelectBookmarkFolderModalProps]
| [type: 'TEXT_FIELD', props: TextFieldModalProps]
| [type: 'UNAUTHORIZED', props?: UnauthorizedModalProps]
| [type: 'VIDEO', props: VideoModalProps];
| [type: 'UNAUTHORIZED', props?: UnauthorizedModalProps];
type Modals = Array<{
modalType: ModalType;