From ffa1f3be7ec32bacf879496bbec8037021adf408 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?nicole=20miko=C5=82ajczyk?= Date: Wed, 18 Feb 2026 14:38:35 +0100 Subject: [PATCH] nicolium: allow setting description for event banners MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: nicole mikołajczyk --- packages/pl-fe/src/actions/compose.ts | 1 + packages/pl-fe/src/components/upload.tsx | 3 +- .../compose-event/tabs/edit-event.tsx | 42 ++++++++++++++++++- packages/pl-fe/src/modals/alt-text-modal.tsx | 20 ++------- 4 files changed, 45 insertions(+), 21 deletions(-) diff --git a/packages/pl-fe/src/actions/compose.ts b/packages/pl-fe/src/actions/compose.ts index 0915e9a9b..00170ed5b 100644 --- a/packages/pl-fe/src/actions/compose.ts +++ b/packages/pl-fe/src/actions/compose.ts @@ -682,6 +682,7 @@ const changeUploadCompose = return dispatch(updateMedia(mediaId, params)) .then((response) => { dispatch(changeUploadComposeSuccess(composeId, response)); + return response; }) .catch((error) => { dispatch(changeUploadComposeFail(composeId, mediaId, error)); diff --git a/packages/pl-fe/src/components/upload.tsx b/packages/pl-fe/src/components/upload.tsx index b8c79a749..3c8bbefef 100644 --- a/packages/pl-fe/src/components/upload.tsx +++ b/packages/pl-fe/src/components/upload.tsx @@ -95,7 +95,7 @@ interface IUpload extends Pick< media: MediaAttachment; onSubmit?(): void; onDelete?(): void; - onDescriptionChange?(description: string, position: [number, number]): Promise; + onDescriptionChange?(description: string, position: [number, number]): Promise; descriptionLimit?: number; withPreview?: boolean; } @@ -136,7 +136,6 @@ const Upload: React.FC = ({ openModal('ALT_TEXT', { media, - withPosition: !!onDragStart, previousDescription: media.description, previousPosition: [focusX / 2 + 0.5, focusY / -2 + 0.5], descriptionLimit: descriptionLimit!, diff --git a/packages/pl-fe/src/features/compose-event/tabs/edit-event.tsx b/packages/pl-fe/src/features/compose-event/tabs/edit-event.tsx index 05af13158..dc78063d4 100644 --- a/packages/pl-fe/src/features/compose-event/tabs/edit-event.tsx +++ b/packages/pl-fe/src/features/compose-event/tabs/edit-event.tsx @@ -2,10 +2,11 @@ import { useNavigate } from '@tanstack/react-router'; import React, { useCallback, useEffect, useState } from 'react'; import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; -import { resetCompose } from '@/actions/compose'; +import { changeUploadCompose, resetCompose } from '@/actions/compose'; import { cancelEventCompose, initEventEdit, submitEvent } from '@/actions/events'; import { uploadFile } from '@/actions/media'; import { fetchStatus } from '@/actions/statuses'; +import AltIndicator from '@/components/alt-indicator'; import { ADDRESS_ICONS } from '@/components/autosuggest-location'; import LocationSearch from '@/components/location-search'; import Button from '@/components/ui/button'; @@ -24,7 +25,9 @@ import { isCurrentOrFutureDate } from '@/features/compose/components/schedule-fo import { ComposeEditor, DatePicker } from '@/features/ui/util/async-components'; import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useAppSelector } from '@/hooks/use-app-selector'; +import { useInstance } from '@/hooks/use-instance'; import { makeGetStatus } from '@/selectors'; +import { useModalsActions } from '@/stores/modals'; import toast from '@/toast'; import UploadButton from '../components/upload-button'; @@ -60,11 +63,17 @@ const EditEvent: React.FC = ({ statusId }) => { const intl = useIntl(); const dispatch = useAppDispatch(); const navigate = useNavigate(); + const { openModal } = useModalsActions(); const getStatus = useCallback(makeGetStatus(), []); const status = useAppSelector((state) => statusId ? getStatus(state, { id: statusId }) : undefined, ); + const { + pleroma: { + metadata: { description_limit: descriptionLimit }, + }, + } = useInstance(); const [name, setName] = useState(status?.event?.name ?? ''); const [text, setText] = useState(''); @@ -81,7 +90,7 @@ const EditEvent: React.FC = ({ statusId }) => { const [isDisabled, setIsDisabled] = useState(!!statusId); const [isUploading, setIsUploading] = useState(false); - const composeId = statusId ? `compose-event-modal-${statusId}` : 'compose-event-modal'; + const composeId = statusId ? `compose-event-${statusId}` : 'compose-event'; const onChangeName: React.ChangeEventHandler = ({ target }) => { setName(target.value); @@ -134,6 +143,28 @@ const EditEvent: React.FC = ({ statusId }) => { setBanner(null); }; + const handleChangeDescriptionClick: React.MouseEventHandler = (e) => { + e.stopPropagation(); + + if (!banner) return; + + openModal('ALT_TEXT', { + media: banner, + previousDescription: banner.description, + previousPosition: [0, 0], + descriptionLimit: descriptionLimit, + onSubmit: (description: string, position: [number, number]) => + dispatch( + changeUploadCompose(composeId, banner.id, { + description, + focus: position + ? `${((position[0] - 0.5) * 2).toFixed(2)},${((position[1] - 0.5) * -2).toFixed(2)}` + : undefined, + }), + ).then((media) => setBanner(media || null)), + }); + }; + const handleSubmit = () => { setIsDisabled(true); @@ -232,6 +263,13 @@ const EditEvent: React.FC = ({ statusId }) => { src={require('@phosphor-icons/core/regular/x.svg')} onClick={handleClearBanner} /> + ) : ( diff --git a/packages/pl-fe/src/modals/alt-text-modal.tsx b/packages/pl-fe/src/modals/alt-text-modal.tsx index ccb85cdc9..1d6d570fd 100644 --- a/packages/pl-fe/src/modals/alt-text-modal.tsx +++ b/packages/pl-fe/src/modals/alt-text-modal.tsx @@ -40,18 +40,11 @@ interface PreviewProps { media: MediaAttachment; position: FocalPoint; onPositionChange: (position: FocalPoint) => void; - withPosition: boolean; } -const Preview: React.FC = ({ - media, - position: [x, y], - onPositionChange, - withPosition, -}) => { +const Preview: React.FC = ({ media, position: [x, y], onPositionChange }) => { const { focalPoint } = useFeatures(); - const withFocalPoint = - withPosition && focalPoint && (media.type === 'image' || media.type === 'gifv'); + const withFocalPoint = focalPoint && (media.type === 'image' || media.type === 'gifv'); // const [dragging, setDragging] = useState(false); const nodeRef = useRef(null); @@ -189,7 +182,6 @@ interface AltTextModalProps { onSubmit: (description: string, position: FocalPoint) => Promise; previousDescription: string; previousPosition: FocalPoint; - withPosition: boolean; } const AltTextModal: React.FC = ({ @@ -200,7 +192,6 @@ const AltTextModal: React.FC = ({ onSubmit, previousDescription, previousPosition, - withPosition, }) => { const dispatch = useAppDispatch(); const intl = useIntl(); @@ -269,12 +260,7 @@ const AltTextModal: React.FC = ({ secondaryText={} > - +