import { FC } from 'react';
import { cn } from '../../../lib/cn';
import { useParams, Navigate } from 'react-router-dom';

interface GroupsBlockProps {}

const Group: FC<GroupsBlockProps> = () => {
    const { groupId } = useParams<{ groupId: string }>();
    const groupIdNumber = Number(groupId);

    if (!groupId || isNaN(groupIdNumber) || !groupIdNumber) {
        return <Navigate to="/home/groups" replace />;
    }

    return (
        <div
            className={cn(
                'border-b-[1px] border-b-liquid-lighter rounded-[10px]',
            )}
        >
            {groupIdNumber}
        </div>
    );
};

export default Group;