Cards SectionCard.tsx

100% Statements 1/1

100% Branches 1/1

100% Functions 1/1

100% Lines 1/1

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  
 
 
 
 
 
 
 
 
 
71x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { ReactNode } from "react";
import { cn } from "@/utils";
 
interface SectionCardProps {
  children: ReactNode;
  className?: string;
  title?: ReactNode;
  id?: string;
  testId?: string;
}
export const SectionCard = ({ title, children, className, id, testId }: SectionCardProps) => {
  return (
    <section
      data-testid={testId}
      id={id}
      className={cn("p-4 border rounded-sm border-cardBorder", className)}
    >
      {title && (
        <>
          <h1 data-testid={`${testId}-title`} className="text-3xl font-semibold mb-2">
            {title}
          </h1>
          <hr className="my-6 bg-slate-200" />
        </>
      )}
      <div data-testid={`${testId}-child`} className="gap-8 flex flex-col">
        {children}
      </div>
    </section>
  );
};