Function useActions

packages/shared/src/hooks/useActions.ts:21–130

()

}

export const useActions = (): UseActions => {
  const client = useQueryClient();
  const { user } = useAuthContext();
  const actionsKey = generateQueryKey(RequestKey.Actions, user);

  const { data, isPending } = useQuery({
    queryKey: actionsKey,
    queryFn: async () => {
      const serverData = await getUserActions();
      const current = client.getQueryData<ActionQueryData>(actionsKey);

      if (!current || !Array.isArray(current)) {
        return { actions: serverData, serverLoaded: true };
      }

      const filtered = serverData.filter(({ type }) =>
        current.every((action) => action.type !== type),
      );

      return { actions: [...current, ...filtered], serverLoaded: true };
    },
    enabled: !!user,
    ...disabledRefetch,
  });

  const actions = useMemo(() => data?.actions ?? [], [data?.actions]);
  const isActionsFetched = !isPending && !!data?.serverLoaded;
  const queueRef = useRef<ActionType[]>([]);

  const { mutateAsync: completeAction } = useMutation({
    mutationFn: completeUserAction,
    onMutate: (type) => {
      if (!user?.id) {
        queueRef.current = [...queueRef.current, type];
        return () => undefined;
      }

      client.setQueryData<ActionQueryData>(actionsKey, (old) => {
        const optimisticAction = {
          userId: user.id,
          type,
          completedAt: new Date(),
        };

        if (!Array.isArray(old?.actions)) {
          return { actions: [optimisticAction], serverLoaded: false };
        }

        return {
          actions: [...old?.actions, optimisticAction],
          serverLoaded: !!old?.serverLoaded,
        };
      });

      return () =>
        client.setQueryData<ActionQueryData>(actionsKey, {
          actions,
          serverLoaded: !!data?.serverLoaded,