"use client";
import React from "react";
import { useAppDispatch, useAppSelector } from "../hooks/hooks";
import { showModal } from "../store/Slice/modalSlice";
import ShareReelUsersList from './ShareReelUsersList'

function ShareReel() {
  const dispatch = useAppDispatch();
  const ReelId = useAppSelector((state) => state.ReelId.id);
  const isShareReelModalVisible = useAppSelector((state) => state.modals.ShareReel)

  const openShareReelModal = () => {
    dispatch(showModal("ShareReel"))
  }

  console.log("Reel Open",isShareReelModalVisible)

  return (
    <>
      <button className="rounded-full p-2" onClick={openShareReelModal}>
        <img
          src="/assets/reel_share.png"
          alt="like"
          width={10}
          height={10}
          className="w-7 h-7"
        />
      </button>

      {isShareReelModalVisible && 
      <ShareReelUsersList reelId={""} onShareSuccess={function (): void {
        throw new Error("Function not implemented.");
      } } />}
    </>
  );
}

export default ShareReel;