forked from github/plane
d78b4dccf3
* chore: basic crud operations added to the list view * refactor: cycle details page * refactor: module details page * chore: added quick actions to kanban issue block * chore: implement quick actions in calendar layout * fix: custom menu component * chore: separate quick action dropdowns implemented * style: loader for calendar * fix: build errors
35 lines
975 B
TypeScript
35 lines
975 B
TypeScript
import { observer } from "mobx-react-lite";
|
|
|
|
// constants
|
|
import { DAYS_LIST } from "constants/calendar";
|
|
|
|
type Props = {
|
|
isLoading: boolean;
|
|
showWeekends: boolean;
|
|
};
|
|
|
|
export const CalendarWeekHeader: React.FC<Props> = observer((props) => {
|
|
const { isLoading, showWeekends } = props;
|
|
|
|
return (
|
|
<div
|
|
className={`relative grid text-sm font-medium divide-x-[0.5px] divide-custom-border-200 ${
|
|
showWeekends ? "grid-cols-7" : "grid-cols-5"
|
|
}`}
|
|
>
|
|
{isLoading && (
|
|
<div className="absolute h-[1.5px] w-3/4 bg-custom-primary-100 animate-[bar-loader_2s_linear_infinite]" />
|
|
)}
|
|
{Object.values(DAYS_LIST).map((day) => {
|
|
if (!showWeekends && (day.shortTitle === "Sat" || day.shortTitle === "Sun")) return null;
|
|
|
|
return (
|
|
<div key={day.shortTitle} className="h-11 bg-custom-background-90 flex items-center px-4">
|
|
{day.shortTitle}
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
});
|