import { ReactNode } from "react";

interface Props{
  columns: 1 | 2;
  children: ReactNode;
  className?: string;
}

export const DataFieldset = (props: Props) => {

  const renderClassName = () => {
    let girdCol = ""
    switch (props.columns){
      case 1:
        girdCol = `grid-cols-1`;
        break;
      case 2:
        girdCol = `grid-cols-2`;
        break;
      default:
        girdCol = `grid-cols-1`;
        break;
    }

    return `grid gap-4 ${girdCol} ${props.className}`;
  }

  return (
    <div className={renderClassName()}>
      {props.children}
    </div>
  )
}