Function CoverTopics

packages/shared/src/features/daily/CoverTopics.tsx:312–503

()

);

export const CoverTopics = (): ReactElement => {
  const { logEvent } = useLogContext();
  const [isSettingsOpen, setIsSettingsOpen] = useState(false);
  const { isOnboardingComplete } = useOnboardingActions();
  const { data, isPending } = useQuery({
    ...dailyHeadlinesQueryOptions(),
    enabled: isOnboardingComplete,
  });
  const { data: channelData } = useQuery(channelConfigurationsQueryOptions());
  const [getHeadlines, setHeadlines] = useUpdateQuery(
    dailyHeadlinesQueryOptions(),
  );

  const updatePost = useCallback<UpdateDailyPost>(
    (postId, manipulate) => {
      const current = getHeadlines();

      if (!current) {
        return;
      }

      current.dailyHeadlines.edges.forEach((edge) => {
        if (edge.node.id === postId) {
          Object.assign(edge.node, manipulate(edge.node));
        }
      });

      setHeadlines(current);
    },
    [getHeadlines, setHeadlines],
  );

  const onVoteMutate = useMemo(
    () => createVoteOnMutate(updatePost),
    [updatePost],
  );
  const onBookmarkMutate = useMemo(
    () => createBookmarkOnMutate(updatePost),
    [updatePost],
  );
  const { toggleBookmark } = useBookmarkPost({ onMutate: onBookmarkMutate });

  const channelBySourceId = useMemo(
    () =>
      new Map(
        (channelData?.channelConfigurations ?? []).flatMap((channel) => {
          const sourceId = channel.digest?.source?.id;
          return sourceId ? [[sourceId, channel] as const] : [];
        }),
      ),
    [channelData],
  );

  const highlights = useMemo(
    () => data?.dailyHeadlines.edges.map((edge) => edge.node) ?? [],
    [data],
  );