import { ReactNode } from "react";
import {
  SocialStyleCallbacks,
  CommentsSortByOptions,
  CommentSectionProvider,
  SocialStyleConfig,
  SocialStyleConfigProvider,
} from "replyke-core";
import { CommentsFeed, NewCommentForm, SortByButton } from "..";
import CommentOptionsSheet from "../../shared/sheets/CommentOptionsSheet";
import ReportCommentSheet from "../../shared/sheets/ReportCommentSheet";

function useSocialComments({
  entityId,
  styleConfig,
  callbacks,
  defaultSortBy,
  limit,
  highlightedCommentId,
}: {
  entityId: string | null | undefined;
  styleConfig: SocialStyleConfig;
  callbacks?: SocialStyleCallbacks;
  defaultSortBy?: CommentsSortByOptions;
  limit?: number;
  highlightedCommentId?: string | null;
}) {
  return {
    CommentSectionProvider: ({ children }: { children: ReactNode }) => (
      <CommentSectionProvider
        entityId={entityId}
        callbacks={callbacks}
        defaultSortBy={defaultSortBy}
        limit={limit}
        highlightedCommentId={highlightedCommentId}
      >
        <SocialStyleConfigProvider styleConfig={styleConfig}>
          <>
            {children}
            <CommentOptionsSheet />
            <ReportCommentSheet />
          </>
        </SocialStyleConfigProvider>
      </CommentSectionProvider>
    ),
    CommentsFeed: CommentsFeed,
    NewCommentForm: NewCommentForm,
    SortByButton: SortByButton,
  };
}

export default useSocialComments;