2023-07-26 06:32:14 +00:00
|
|
|
import { useMemo, useState } from "react";
|
2023-07-18 06:37:55 +00:00
|
|
|
|
|
|
|
import { useRouter } from "next/router";
|
|
|
|
|
|
|
|
// swr
|
|
|
|
import useSWR from "swr";
|
2023-07-26 06:32:14 +00:00
|
|
|
import useSWRInfinite from "swr/infinite";
|
2023-07-18 06:37:55 +00:00
|
|
|
|
|
|
|
// services
|
|
|
|
import userNotificationServices from "services/notifications.service";
|
|
|
|
|
|
|
|
// fetch-keys
|
2023-07-26 06:32:14 +00:00
|
|
|
import { UNREAD_NOTIFICATIONS_COUNT, getPaginatedNotificationKey } from "constants/fetch-keys";
|
2023-07-18 06:37:55 +00:00
|
|
|
|
|
|
|
// type
|
2023-07-26 06:32:14 +00:00
|
|
|
import type { NotificationType, NotificationCount } from "types";
|
|
|
|
|
|
|
|
// TODO: change to 100
|
|
|
|
const PER_PAGE = 2;
|
2023-07-18 06:37:55 +00:00
|
|
|
|
|
|
|
const useUserNotification = () => {
|
|
|
|
const router = useRouter();
|
|
|
|
const { workspaceSlug } = router.query;
|
|
|
|
|
|
|
|
const [snoozed, setSnoozed] = useState<boolean>(false);
|
|
|
|
const [archived, setArchived] = useState<boolean>(false);
|
|
|
|
const [readNotification, setReadNotification] = useState<boolean>(false);
|
2023-07-29 20:35:30 +00:00
|
|
|
const [fetchNotifications, setFetchNotifications] = useState<boolean>(false);
|
2023-07-18 06:37:55 +00:00
|
|
|
const [selectedNotificationForSnooze, setSelectedNotificationForSnooze] = useState<string | null>(
|
|
|
|
null
|
|
|
|
);
|
|
|
|
const [selectedTab, setSelectedTab] = useState<NotificationType>("assigned");
|
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
const params = useMemo(
|
|
|
|
() => ({
|
|
|
|
type: snoozed || archived || readNotification ? undefined : selectedTab,
|
|
|
|
snoozed,
|
|
|
|
archived,
|
|
|
|
read: !readNotification ? null : false,
|
|
|
|
per_page: PER_PAGE,
|
|
|
|
}),
|
|
|
|
[archived, readNotification, selectedTab, snoozed]
|
|
|
|
);
|
2023-07-19 09:14:04 +00:00
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
const {
|
|
|
|
data: paginatedData,
|
|
|
|
size,
|
|
|
|
setSize,
|
|
|
|
isLoading,
|
|
|
|
isValidating,
|
|
|
|
mutate: notificationMutate,
|
|
|
|
} = useSWRInfinite(
|
2023-07-29 20:35:30 +00:00
|
|
|
fetchNotifications && workspaceSlug
|
2023-07-26 06:32:14 +00:00
|
|
|
? (index, prevData) =>
|
|
|
|
getPaginatedNotificationKey(index, prevData, workspaceSlug.toString(), params)
|
|
|
|
: () => null,
|
|
|
|
async (url: string) => await userNotificationServices.getNotifications(url)
|
2023-07-18 06:37:55 +00:00
|
|
|
);
|
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
const isLoadingMore =
|
|
|
|
isLoading || (size > 0 && paginatedData && typeof paginatedData[size - 1] === "undefined");
|
|
|
|
const isEmpty = paginatedData?.[0]?.results?.length === 0;
|
|
|
|
const notifications = paginatedData ? paginatedData.map((d) => d.results).flat() : undefined;
|
|
|
|
const hasMore =
|
|
|
|
isEmpty || (paginatedData && paginatedData[paginatedData.length - 1].next_page_results);
|
|
|
|
const isRefreshing = isValidating && paginatedData && paginatedData.length === size;
|
|
|
|
|
2023-07-18 06:37:55 +00:00
|
|
|
const { data: notificationCount, mutate: mutateNotificationCount } = useSWR(
|
|
|
|
workspaceSlug ? UNREAD_NOTIFICATIONS_COUNT(workspaceSlug.toString()) : null,
|
|
|
|
() =>
|
|
|
|
workspaceSlug
|
|
|
|
? userNotificationServices.getUnreadNotificationsCount(workspaceSlug.toString())
|
|
|
|
: null
|
|
|
|
);
|
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
const handleReadMutation = (action: "read" | "unread") => {
|
|
|
|
const notificationCountNumber = action === "read" ? -1 : 1;
|
|
|
|
|
|
|
|
mutateNotificationCount((prev) => {
|
|
|
|
if (!prev) return prev;
|
|
|
|
|
|
|
|
const notificationType: keyof NotificationCount =
|
|
|
|
selectedTab === "assigned"
|
|
|
|
? "my_issues"
|
|
|
|
: selectedTab === "created"
|
|
|
|
? "created_issues"
|
|
|
|
: "watching_issues";
|
|
|
|
|
|
|
|
return {
|
|
|
|
...prev,
|
|
|
|
[notificationType]: prev[notificationType] + notificationCountNumber,
|
|
|
|
};
|
|
|
|
}, false);
|
|
|
|
};
|
|
|
|
|
|
|
|
const mutateNotification = (notificationId: string, value: Object) => {
|
|
|
|
notificationMutate((previousNotifications) => {
|
|
|
|
if (!previousNotifications) return previousNotifications;
|
|
|
|
|
|
|
|
const notificationIndex = Math.floor(
|
|
|
|
previousNotifications
|
|
|
|
.map((d) => d.results)
|
|
|
|
.flat()
|
|
|
|
.findIndex((notification) => notification.id === notificationId) / PER_PAGE
|
|
|
|
);
|
|
|
|
|
|
|
|
let notificationIndexInPage = previousNotifications[notificationIndex].results.findIndex(
|
|
|
|
(notification) => notification.id === notificationId
|
|
|
|
);
|
|
|
|
|
|
|
|
if (notificationIndexInPage === -1) return previousNotifications;
|
|
|
|
|
|
|
|
notificationIndexInPage =
|
|
|
|
notificationIndexInPage === -1 ? 0 : notificationIndexInPage % PER_PAGE;
|
|
|
|
|
|
|
|
if (notificationIndex === -1) return previousNotifications;
|
|
|
|
|
|
|
|
if (notificationIndexInPage === -1) return previousNotifications;
|
|
|
|
|
|
|
|
const key = Object.keys(value)[0];
|
|
|
|
(previousNotifications[notificationIndex].results[notificationIndexInPage] as any)[key] = (
|
|
|
|
value as any
|
|
|
|
)[key];
|
|
|
|
|
|
|
|
return previousNotifications;
|
|
|
|
}, false);
|
|
|
|
};
|
|
|
|
|
|
|
|
const removeNotification = (notificationId: string) => {
|
|
|
|
notificationMutate((previousNotifications) => {
|
|
|
|
if (!previousNotifications) return previousNotifications;
|
|
|
|
|
|
|
|
const notificationIndex = Math.floor(
|
|
|
|
previousNotifications
|
|
|
|
.map((d) => d.results)
|
|
|
|
.flat()
|
|
|
|
.findIndex((notification) => notification.id === notificationId) / PER_PAGE
|
|
|
|
);
|
|
|
|
|
|
|
|
let notificationIndexInPage = previousNotifications[notificationIndex].results.findIndex(
|
|
|
|
(notification) => notification.id === notificationId
|
|
|
|
);
|
|
|
|
|
|
|
|
if (notificationIndexInPage === -1) return previousNotifications;
|
|
|
|
|
|
|
|
notificationIndexInPage =
|
|
|
|
notificationIndexInPage === -1 ? 0 : notificationIndexInPage % PER_PAGE;
|
|
|
|
|
|
|
|
if (notificationIndex === -1) return previousNotifications;
|
|
|
|
|
|
|
|
if (notificationIndexInPage === -1) return previousNotifications;
|
|
|
|
|
|
|
|
previousNotifications[notificationIndex].results.splice(notificationIndexInPage, 1);
|
|
|
|
|
|
|
|
return previousNotifications;
|
|
|
|
}, false);
|
|
|
|
};
|
|
|
|
|
2023-07-18 06:37:55 +00:00
|
|
|
const markNotificationReadStatus = async (notificationId: string) => {
|
|
|
|
if (!workspaceSlug) return;
|
2023-07-26 06:32:14 +00:00
|
|
|
|
2023-07-18 06:37:55 +00:00
|
|
|
const isRead =
|
|
|
|
notifications?.find((notification) => notification.id === notificationId)?.read_at !== null;
|
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
handleReadMutation(isRead ? "unread" : "read");
|
|
|
|
mutateNotification(notificationId, { read_at: isRead ? null : new Date() });
|
|
|
|
|
2023-07-18 06:37:55 +00:00
|
|
|
if (isRead) {
|
|
|
|
await userNotificationServices
|
|
|
|
.markUserNotificationAsUnread(workspaceSlug.toString(), notificationId)
|
|
|
|
.catch(() => {
|
|
|
|
throw new Error("Something went wrong");
|
2023-07-20 09:44:57 +00:00
|
|
|
})
|
|
|
|
.finally(() => {
|
2023-07-20 13:45:13 +00:00
|
|
|
mutateNotificationCount();
|
2023-07-18 06:37:55 +00:00
|
|
|
});
|
|
|
|
} else {
|
|
|
|
await userNotificationServices
|
|
|
|
.markUserNotificationAsRead(workspaceSlug.toString(), notificationId)
|
|
|
|
.catch(() => {
|
|
|
|
throw new Error("Something went wrong");
|
2023-07-20 09:44:57 +00:00
|
|
|
})
|
|
|
|
.finally(() => {
|
2023-07-20 13:45:13 +00:00
|
|
|
mutateNotificationCount();
|
2023-07-18 06:37:55 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
const markNotificationArchivedStatus = async (notificationId: string) => {
|
|
|
|
if (!workspaceSlug) return;
|
|
|
|
const isArchived =
|
|
|
|
notifications?.find((notification) => notification.id === notificationId)?.archived_at !==
|
|
|
|
null;
|
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
if (!isArchived) {
|
|
|
|
handleReadMutation("read");
|
|
|
|
removeNotification(notificationId);
|
|
|
|
} else {
|
|
|
|
if (archived) {
|
|
|
|
removeNotification(notificationId);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-07-18 06:37:55 +00:00
|
|
|
if (isArchived) {
|
|
|
|
await userNotificationServices
|
|
|
|
.markUserNotificationAsUnarchived(workspaceSlug.toString(), notificationId)
|
|
|
|
.catch(() => {
|
|
|
|
throw new Error("Something went wrong");
|
2023-07-20 09:44:57 +00:00
|
|
|
})
|
|
|
|
.finally(() => {
|
2023-07-26 06:32:14 +00:00
|
|
|
notificationMutate();
|
2023-07-20 13:45:13 +00:00
|
|
|
mutateNotificationCount();
|
2023-07-18 06:37:55 +00:00
|
|
|
});
|
|
|
|
} else {
|
|
|
|
await userNotificationServices
|
|
|
|
.markUserNotificationAsArchived(workspaceSlug.toString(), notificationId)
|
|
|
|
.catch(() => {
|
|
|
|
throw new Error("Something went wrong");
|
2023-07-20 09:44:57 +00:00
|
|
|
})
|
|
|
|
.finally(() => {
|
2023-07-26 06:32:14 +00:00
|
|
|
notificationMutate();
|
2023-07-20 13:45:13 +00:00
|
|
|
mutateNotificationCount();
|
2023-07-18 06:37:55 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
const markSnoozeNotification = async (notificationId: string, dateTime?: Date) => {
|
|
|
|
if (!workspaceSlug) return;
|
|
|
|
|
|
|
|
const isSnoozed =
|
|
|
|
notifications?.find((notification) => notification.id === notificationId)?.snoozed_till !==
|
|
|
|
null;
|
|
|
|
|
2023-07-26 06:32:14 +00:00
|
|
|
mutateNotification(notificationId, { snoozed_till: isSnoozed ? null : dateTime });
|
|
|
|
|
2023-07-18 06:37:55 +00:00
|
|
|
if (isSnoozed) {
|
|
|
|
await userNotificationServices
|
|
|
|
.patchUserNotification(workspaceSlug.toString(), notificationId, {
|
|
|
|
snoozed_till: null,
|
|
|
|
})
|
2023-07-20 09:44:57 +00:00
|
|
|
.finally(() => {
|
2023-07-26 06:32:14 +00:00
|
|
|
notificationMutate();
|
2023-07-18 06:37:55 +00:00
|
|
|
});
|
2023-07-20 09:44:57 +00:00
|
|
|
} else {
|
2023-07-18 06:37:55 +00:00
|
|
|
await userNotificationServices
|
|
|
|
.patchUserNotification(workspaceSlug.toString(), notificationId, {
|
|
|
|
snoozed_till: dateTime,
|
|
|
|
})
|
2023-07-20 09:44:57 +00:00
|
|
|
.catch(() => {
|
|
|
|
new Error("Something went wrong");
|
|
|
|
})
|
|
|
|
.finally(() => {
|
2023-07-26 06:32:14 +00:00
|
|
|
notificationMutate();
|
2023-07-18 06:37:55 +00:00
|
|
|
});
|
2023-07-20 09:44:57 +00:00
|
|
|
}
|
2023-07-18 06:37:55 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
return {
|
|
|
|
notifications,
|
2023-07-26 06:32:14 +00:00
|
|
|
notificationMutate,
|
2023-07-18 06:37:55 +00:00
|
|
|
markNotificationReadStatus,
|
|
|
|
markNotificationArchivedStatus,
|
|
|
|
markSnoozeNotification,
|
|
|
|
snoozed,
|
|
|
|
setSnoozed,
|
|
|
|
archived,
|
|
|
|
setArchived,
|
|
|
|
readNotification,
|
|
|
|
setReadNotification,
|
|
|
|
selectedNotificationForSnooze,
|
|
|
|
setSelectedNotificationForSnooze,
|
|
|
|
selectedTab,
|
|
|
|
setSelectedTab,
|
|
|
|
totalNotificationCount: notificationCount
|
|
|
|
? notificationCount.created_issues +
|
2023-07-20 09:44:57 +00:00
|
|
|
notificationCount.watching_issues +
|
2023-07-18 06:37:55 +00:00
|
|
|
notificationCount.my_issues
|
|
|
|
: null,
|
|
|
|
notificationCount,
|
|
|
|
mutateNotificationCount,
|
2023-07-26 06:32:14 +00:00
|
|
|
setSize,
|
|
|
|
isLoading,
|
|
|
|
isLoadingMore,
|
|
|
|
hasMore,
|
|
|
|
isRefreshing,
|
2023-07-29 20:35:30 +00:00
|
|
|
setFetchNotifications,
|
2023-07-18 06:37:55 +00:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
export default useUserNotification;
|