142 lines
3.4 KiB
TypeScript
142 lines
3.4 KiB
TypeScript
import {
|
|
arrowUndoOutline,
|
|
ellipsisHorizontal,
|
|
flagOutline,
|
|
personOutline,
|
|
removeCircleOutline,
|
|
textOutline,
|
|
} from "ionicons/icons";
|
|
import { ActionSheetButton, IonIcon, useIonActionSheet } from "@ionic/react";
|
|
import {
|
|
forwardRef,
|
|
useCallback,
|
|
useContext,
|
|
useImperativeHandle,
|
|
} from "react";
|
|
import { PageContext } from "../auth/PageContext";
|
|
import useAppNavigation from "../../helpers/useAppNavigation";
|
|
import { useUserDetails } from "../user/useUserDetails";
|
|
import { getHandle } from "../../helpers/lemmy";
|
|
import { PrivateMessageView } from "lemmy-js-client";
|
|
import { styled } from "@linaria/react";
|
|
import { markRead, syncMessages } from "./inboxSlice";
|
|
import store, { useAppDispatch } from "../../store";
|
|
|
|
const StyledIonIcon = styled(IonIcon)`
|
|
font-size: 1.2em;
|
|
`;
|
|
|
|
interface PrivateMessageMoreActionsHandle {
|
|
present: () => void;
|
|
}
|
|
|
|
interface PrivateMessageMoreActionsProps {
|
|
item: PrivateMessageView;
|
|
markReadAction: ActionSheetButton;
|
|
}
|
|
|
|
export default forwardRef<
|
|
PrivateMessageMoreActionsHandle,
|
|
PrivateMessageMoreActionsProps
|
|
>(function PrivateMessageMoreActions({ item, markReadAction }, ref) {
|
|
const dispatch = useAppDispatch();
|
|
const [presentActionSheet] = useIonActionSheet();
|
|
const { presentReport, presentSelectText, presentPrivateMessageCompose } =
|
|
useContext(PageContext);
|
|
|
|
const { navigateToUser } = useAppNavigation();
|
|
|
|
const { isBlocked, blockOrUnblock } = useUserDetails(getHandle(item.creator));
|
|
|
|
const present = useCallback(() => {
|
|
presentActionSheet({
|
|
cssClass: "left-align-buttons",
|
|
buttons: [
|
|
markReadAction,
|
|
{
|
|
text: "Reply",
|
|
icon: arrowUndoOutline,
|
|
handler: () => {
|
|
(async () => {
|
|
await presentPrivateMessageCompose({
|
|
private_message: {
|
|
recipient:
|
|
item.private_message.creator_id ===
|
|
store.getState().site.response?.my_user?.local_user_view
|
|
?.local_user?.person_id
|
|
? item.recipient
|
|
: item.creator,
|
|
},
|
|
});
|
|
|
|
await dispatch(markRead(item, true));
|
|
dispatch(syncMessages());
|
|
})();
|
|
},
|
|
},
|
|
{
|
|
text: "Select Text",
|
|
icon: textOutline,
|
|
handler: () => {
|
|
presentSelectText(item.private_message.content);
|
|
},
|
|
},
|
|
{
|
|
text: getHandle(item.creator),
|
|
icon: personOutline,
|
|
handler: () => {
|
|
navigateToUser(item.creator);
|
|
},
|
|
},
|
|
{
|
|
text: "Report",
|
|
icon: flagOutline,
|
|
handler: () => {
|
|
presentReport(item);
|
|
},
|
|
},
|
|
{
|
|
text: !isBlocked ? "Block User" : "Unblock User",
|
|
icon: removeCircleOutline,
|
|
handler: () => {
|
|
blockOrUnblock();
|
|
},
|
|
},
|
|
{
|
|
text: "Cancel",
|
|
role: "cancel",
|
|
},
|
|
],
|
|
});
|
|
}, [
|
|
presentActionSheet,
|
|
markReadAction,
|
|
item,
|
|
isBlocked,
|
|
presentPrivateMessageCompose,
|
|
dispatch,
|
|
presentSelectText,
|
|
navigateToUser,
|
|
presentReport,
|
|
blockOrUnblock,
|
|
]);
|
|
|
|
useImperativeHandle(
|
|
ref,
|
|
() => ({
|
|
present,
|
|
}),
|
|
[present],
|
|
);
|
|
|
|
return (
|
|
<StyledIonIcon
|
|
icon={ellipsisHorizontal}
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
present();
|
|
}}
|
|
/>
|
|
);
|
|
});
|