Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 | import { Box, IconButton } from "@mui/material";
import CenteredSpinner from "components/CenteredSpinner/CenteredSpinner";
import { CheckIcon, CloseIcon } from "components/Icons";
import { CONNECTIONS } from "i18n/namespaces";
import { useTranslation } from "next-i18next";
import { FriendRequest } from "proto/api_pb";
import { useIsMounted, useSafeState } from "utils/hooks";
import type { SetMutationError } from ".";
import FriendSummaryView from "./FriendSummaryView";
import FriendTile from "./FriendTile";
import useFriendRequests from "./useFriendRequests";
import useRespondToFriendRequest from "./useRespondToFriendRequest";
interface RespondToFriendRequestActionProps {
friendRequest: FriendRequest.AsObject;
setMutationError: SetMutationError;
}
function RespondToFriendRequestAction({
friendRequest,
setMutationError,
}: RespondToFriendRequestActionProps) {
const { isLoading, isSuccess, reset, respondToFriendRequest } =
useRespondToFriendRequest();
return friendRequest.state === FriendRequest.FriendRequestStatus.PENDING ? (
<Box>
{isLoading || isSuccess ? (
<CenteredSpinner />
) : (
<>
<IconButton
aria-label="Accept request"
onClick={() => {
reset();
respondToFriendRequest({
accept: true,
friendRequest,
setMutationError,
});
}}
size="large"
>
<CheckIcon />
</IconButton>
<IconButton
aria-label="Decline request"
onClick={() => {
reset();
respondToFriendRequest({
accept: false,
friendRequest,
setMutationError,
});
}}
size="large"
>
<CloseIcon />
</IconButton>
</>
)}
</Box>
) : null;
}
function FriendRequestsReceived() {
const isMounted = useIsMounted();
const [mutationError, setMutationError] = useSafeState(isMounted, "");
const { data, isLoading, isError, errors } = useFriendRequests("received");
const { t } = useTranslation([CONNECTIONS]);
return (
<FriendTile
title={t("connections:friend_requests")}
errorMessage={
isError ? errors.join("\n") : mutationError ? mutationError : null
}
isLoading={isLoading}
hasData={!!data?.length}
noDataMessage={t("connections:no_friend_requests")}
>
{data &&
data.map((friendRequest) => (
<FriendSummaryView
key={friendRequest.friendRequestId}
friend={friendRequest.friend}
>
<RespondToFriendRequestAction
friendRequest={friendRequest}
setMutationError={setMutationError}
/>
</FriendSummaryView>
))}
</FriendTile>
);
}
export default FriendRequestsReceived;
|