Attempts to fix stuff

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2024-08-29 00:55:30 +02:00
parent 9212be9614
commit cb5dbb8ab6
4 changed files with 47 additions and 34 deletions

View file

@ -88,11 +88,15 @@ const unknownAttachmentSchema = baseAttachmentSchema.extend({
}); });
/** @see {@link https://docs.joinmastodon.org/entities/MediaAttachment} */ /** @see {@link https://docs.joinmastodon.org/entities/MediaAttachment} */
const mediaAttachmentSchema = z.preprocess((data: any) => ({ const mediaAttachmentSchema = z.preprocess((data: any) => {
mime_type: data.pleroma?.mime_type, if (!data) return null;
preview_url: data.url,
...data, return {
}), z.discriminatedUnion('type', [ mime_type: data.pleroma?.mime_type,
preview_url: data.url,
...data,
};
}, z.discriminatedUnion('type', [
imageAttachmentSchema, imageAttachmentSchema,
videoAttachmentSchema, videoAttachmentSchema,
gifvAttachmentSchema, gifvAttachmentSchema,

View file

@ -140,14 +140,14 @@ const DropdownMenu = (props: IDropdownMenu) => {
} }
}; };
const handleDocumentClick = (event: Event) => { const handleDocumentClick = useMemo(() => (event: Event) => {
if (refs.floating.current && !refs.floating.current.contains(event.target as Node)) { if (refs.floating.current && !refs.floating.current.contains(event.target as Node)) {
handleClose(); handleClose();
event.stopPropagation(); event.stopPropagation();
} }
}; }, [refs.floating.current]);
const handleKeyDown = (e: KeyboardEvent) => { const handleKeyDown = useMemo(() => (e: KeyboardEvent) => {
if (!refs.floating.current) return; if (!refs.floating.current) return;
const items = Array.from(refs.floating.current.querySelectorAll('a, button')); const items = Array.from(refs.floating.current.querySelectorAll('a, button'));
@ -185,7 +185,7 @@ const DropdownMenu = (props: IDropdownMenu) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
} }
}; }, [refs.floating.current]);
const arrowProps: React.CSSProperties = useMemo(() => { const arrowProps: React.CSSProperties = useMemo(() => {
if (middlewareData.arrow) { if (middlewareData.arrow) {
@ -325,27 +325,29 @@ const DropdownMenu = (props: IDropdownMenu) => {
}} }}
> >
{Component && <Component handleClose={handleClose} />} {Component && <Component handleClose={handleClose} />}
<ul> {(items?.length || touching) && (
{items?.map((item, idx) => ( <ul>
<DropdownMenuItem {items?.map((item, idx) => (
key={idx} <DropdownMenuItem
item={item} key={idx}
index={idx} item={item}
onClick={handleClose} index={idx}
autoFocus={autoFocus}
/>
))}
{touching && (
<li className='p-2 px-3'>
<button
className='flex w-full appearance-none place-content-center items-center justify-center rounded-full border border-gray-700 bg-transparent p-2 text-sm font-medium text-gray-700 transition-all hover:bg-white/10 focus:outline-none focus:ring-2 focus:ring-offset-2 dark:border-gray-500 dark:text-gray-500'
onClick={handleClose} onClick={handleClose}
> autoFocus={autoFocus}
<FormattedMessage id='lightbox.close' defaultMessage='Close' /> />
</button> ))}
</li> {touching && (
)} <li className='p-2 px-3'>
</ul> <button
className='flex w-full appearance-none place-content-center items-center justify-center rounded-full border border-gray-700 bg-transparent p-2 text-sm font-medium text-gray-700 transition-all hover:bg-white/10 focus:outline-none focus:ring-2 focus:ring-offset-2 dark:border-gray-500 dark:text-gray-500'
onClick={handleClose}
>
<FormattedMessage id='lightbox.close' defaultMessage='Close' />
</button>
</li>
)}
</ul>
)}
{/* Arrow */} {/* Arrow */}
{!touching && ( {!touching && (

View file

@ -1,5 +1,5 @@
import clsx from 'clsx'; import clsx from 'clsx';
import React, { useRef } from 'react'; import React, { useEffect, useRef } from 'react';
import { useIntl, defineMessages, FormattedMessage } from 'react-intl'; import { useIntl, defineMessages, FormattedMessage } from 'react-intl';
import { changeComposeFederated, changeComposeVisibility } from 'pl-fe/actions/compose'; import { changeComposeFederated, changeComposeVisibility } from 'pl-fe/actions/compose';
@ -103,6 +103,12 @@ const PrivacyDropdownMenu: React.FC<IPrivacyDropdownMenu> = ({
} }
}; };
useEffect(() => {
if (node.current) {
(node.current?.querySelector('li[aria-selected=true]') as HTMLDivElement)?.focus();
}
}, [node.current]);
return ( return (
<ul ref={node}> <ul ref={node}>
{items.map(item => { {items.map(item => {

View file

@ -146,8 +146,9 @@ const useChatActions = (chatId: string) => {
.catch(() => null); .catch(() => null);
const createChatMessage = useMutation({ const createChatMessage = useMutation({
mutationFn: ({ chatId, content, mediaId }: { chatId: string; content: string; mediaId?: string }) => mutationFn: ({ chatId, content, mediaId }: { chatId: string; content: string; mediaId?: string }) => {
client.chats.createChatMessage(chatId, { content, media_id: mediaId }), return client.chats.createChatMessage(chatId, { content, media_id: mediaId });
},
retry: false, retry: false,
onMutate: async (variables) => { onMutate: async (variables) => {
// Cancel any outgoing refetches (so they don't overwrite our optimistic update) // Cancel any outgoing refetches (so they don't overwrite our optimistic update)
@ -167,7 +168,7 @@ const useChatActions = (chatId: string) => {
if (idx === 0) { if (idx === 0) {
return { return {
...page, ...page,
result: [ items: [
normalizeChatMessage({ normalizeChatMessage({
...chatMessageSchema.parse({ ...chatMessageSchema.parse({
content: variables.content, content: variables.content,
@ -178,7 +179,7 @@ const useChatActions = (chatId: string) => {
}), }),
pending: true, pending: true,
}), }),
...page.result, ...page.items,
], ],
}; };
} }