import { FC, memo } from 'react';

import useRequiredParams from 'src/hooks/useRequiredParams';
import { PostSearch } from 'src/pages/dashboard/feed/components/PostSearch';
import { getGroupPosts } from 'src/services/groups';
import { Updater } from 'src/types/queries';
import { Reaction } from 'src/types/reaction';

import { groupsKeys, updateGroupSearchPostListDataReaction } from '../queries';

const GroupPostSearch: FC = () => {
  const { id: groupId } = useRequiredParams(['id']);

  const updateReactionFn = (
    postId: number,
    query: string,
    updater: Updater<Reaction[]>,
  ) => {
    updateGroupSearchPostListDataReaction(postId, groupId, query, updater);
  };

  return (
    <PostSearch
      cardContext="groups"
      queryKey={query => groupsKeys.searchPost(groupId, query)}
      fetchFn={(pageParam, query) => getGroupPosts(groupId, pageParam, query)}
      updateReactionFn={updateReactionFn}
    />
  );
};

export default memo(GroupPostSearch);