NODEDC_TASKMANAGER/plane-src/apps/web/ce/components/projects/external-contours/empty-state.tsx

41 lines
1.4 KiB
TypeScript

/**
* Copyright (c) 2023-present Plane Software, Inc. and contributors
* SPDX-License-Identifier: AGPL-3.0-only
* See the LICENSE file for details.
*/
import { ViewVerticalStackIllustration, WorkItemVerticalStackIllustration } from "@plane/propel/empty-state";
import { cn } from "@plane/utils";
type Props = {
title: string;
description?: string;
compact?: boolean;
};
export const ExternalContoursEmptyState = (props: Props) => {
const { title, description, compact = false } = props;
const Illustration = compact ? WorkItemVerticalStackIllustration : ViewVerticalStackIllustration;
return (
<div
className={cn(
"nodedc-external-empty-state",
compact ? "max-w-[24rem]" : "max-w-sm"
)}
>
<div className={cn("nodedc-external-empty-media", compact ? "h-[7rem] w-[7rem]" : "h-[6rem] w-[6rem]")}>
<Illustration className={cn("block shrink-0", compact ? "h-[6.4rem] w-auto" : "h-[5.5rem] w-auto")} />
</div>
<div className={cn("space-y-2", compact ? "max-w-[24rem]" : "max-w-sm")}>
<h3 className={cn("font-semibold text-primary", compact ? "text-18" : "text-18")}>{title}</h3>
{description && (
<p className={cn("mx-auto text-13 leading-6 text-secondary", compact ? "max-w-[24rem]" : "max-w-sm")}>
{description}
</p>
)}
</div>
</div>
);
};