Files
developer-roadmap/src/components/Schedule/ScheduleButton.tsx
T
Arik ChakmaandKamran Ahmed 2a6c1bfce8 feat: implement calendar scheduling (#7574)
* wip

* feat: add calendar scheduling

* fix: update names

* UI Changes for calendar scheduling

---------

Co-authored-by: Kamran Ahmed <kamranahmed.se@gmail.com>
2024-11-08 21:48:09 +05:00

41 lines
1.1 KiB
TypeScript

import { Calendar } from 'lucide-react';
import { cn } from '../../lib/classname';
import type { ResourceType } from '../../lib/resource-progress';
import { ScheduleEventModal } from './ScheduleEventModal';
import { useState } from 'react';
type ScheduleButtonProps = {
resourceId: string;
resourceType: ResourceType;
resourceTitle: string;
};
export function ScheduleButton(props: ScheduleButtonProps) {
const { resourceId, resourceType, resourceTitle } = props;
const [isModalOpen, setIsModalOpen] = useState(false);
return (
<>
{isModalOpen && (
<ScheduleEventModal
onClose={() => {
setIsModalOpen(false);
}}
roadmapId={resourceId}
/>
)}
<button
className="inline-flex items-center justify-center gap-2 rounded-md bg-gray-200 px-3 py-1.5 text-xs font-medium hover:bg-gray-300 sm:text-sm"
onClick={() => {
setIsModalOpen(true);
}}
>
<Calendar className="h-4 w-4 flex-shrink-0" />
<span className="hidden sm:inline">Schedule Learning Time</span>
</button>
</>
);
}