Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | import { HomeRounded } from "@mui/icons-material";
import { useNavigate } from "react-router-dom";
import HeadingPlaybookButtons from "./Buttons/HeadingPlaybookButton/index.tsx";
import PlaybookDescription from "./PlaybookDescription/index.tsx";
import TimeRangeSelector from "./common/TimeRangeSelector/index.tsx";
import HeadingTitle from "./HeadingTitle.tsx";
import usePlaybookKey from "../hooks/playbooks/usePlaybookKey";
const Heading = ({ subHeading = "", heading }) => {
const navigate = useNavigate();
const [isOnPlaybookPage] = usePlaybookKey("isOnPlaybookPage");
const goBack = () => {
navigate("/");
};
return (
<>
<div
style={{ zIndex: "90" }}
className="w-full h-[80px] top-0 py-3 flex justify-between bg-white border-b border-gray-300 px-4 items-center sticky">
<div className="flex gap-2 items-center">
{/* {isOnPlaybookPage && (
<div
className="cursor-pointer text-xl font-bold hover:text-violet-500 transition-all"
onClick={goBack}>
<HomeRounded />
</div>
)} */}
<div className="flex-col justify-items-center">
<div>
<div className="text-xs sm:text-lg font-semibold text-gray-800">
<HeadingTitle heading={heading} />
{subHeading && (
<div className="text-xs font-normal text-gray-400">
{subHeading}
</div>
)}
<PlaybookDescription />
</div>
</div>
</div>
</div>
<div className="flex gap-2 items-stretch">
<HeadingPlaybookButtons />
{isOnPlaybookPage && <TimeRangeSelector />}
</div>
</div>
</>
);
};
export default Heading;
|