import React from 'react';
import {ReactionsSummaryBottomSheet} from '@components';
import {Reaction} from '@interfaces/reaction';
import {useGetReactionsUsers} from '@modules/post/hooks/useGetReactionsUsers';
import {DEFAULT_REACTION} from '@shared/constants';

interface ReactionsSummaryPostsProps {
  showReactionsSummary: boolean;
  setSelectedReaction: (reaction: string) => void;
  reactions: Reaction[];
  onCloseReactionsSummary: () => void;
  id: number;
  selectedReaction: Nullable<string>;
  articleId?: number;
  groupId?: number;
  isMarketplace?: boolean;
}

function ReactionsSummaryPosts({
  showReactionsSummary,
  setSelectedReaction,
  reactions,
  id,
  selectedReaction,
  onCloseReactionsSummary,
  articleId,
  groupId,
  isMarketplace = false,
}: ReactionsSummaryPostsProps) {
  const queryData = useGetReactionsUsers({
    reaction: selectedReaction || DEFAULT_REACTION,
    postId: id,
    articleId,
    groupId,
    isMarketplace,
    showReactionsSummary,
  });

  return (
    <ReactionsSummaryBottomSheet
      visible={showReactionsSummary}
      selectedReaction={selectedReaction}
      setSelectedReaction={setSelectedReaction}
      reactions={reactions}
      queryData={queryData}
      onClose={onCloseReactionsSummary}
    />
  );
}

export default ReactionsSummaryPosts;