import React, { useState } from "react";
import { PreviewPanelContainer } from "./index.styled";
import { CloseIcon } from "../assets/svg/close";
import { ListIcon } from "../assets/svg/list";
import useTranslation from "../../../hooks/useTranslation.jsx";
import wordStore from "../../../mc/wordStore.json";
const PreviewUnassignedPanel = ({ close }) => {
  const { findText } = useTranslation(wordStore);
  return (
    <PreviewPanelContainer>
      <div className="una_main_content">
        <div className="una_header">
          <div className="una_hd_container">
            <div className="una_hd_img"></div>
            <div className="una_hd_content">
              <p className="una_hd_title">{findText("Thomas Anree")}</p>
              <p className="una_hd_subtitle">
                {findText("Minnie.Schmitt40@yahoo.com")}
              </p>
            </div>
          </div>

          <span className="close_icon" onClick={close}>
            <CloseIcon fill={findText("#323232")} />
          </span>
        </div>

        <div className="una_body">
          <div className="una_tag_group">
            <ListIcon />
            <p className="unassigned_txt">{findText("Unassigned")}</p>
          </div>
        </div>
      </div>
    </PreviewPanelContainer>
  );
};
export default PreviewUnassignedPanel;
