Attempts to fix stuff
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
parent
9212be9614
commit
cb5dbb8ab6
4 changed files with 47 additions and 34 deletions
|
@ -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,
|
||||||
|
|
|
@ -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 && (
|
||||||
|
|
|
@ -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 => {
|
||||||
|
|
|
@ -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,
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue