onesamket

import { ComponentProps, forwardRef } from 'react'
import { twMerge } from 'tailwind-merge'

export const RootLayout = ({ children, className, ...props }: ComponentProps<'main'>) => {
    return (
        <main className={twMerge('flex flex-row h-screen', className)} {...props}>
            {children}
        </main>
    )
}

onesamket

<section class="container px-4 mx-auto">
  <h2 class="text-lg font-medium text-gray-800 dark:text-white">Customers</h2>

  <p class="mt-1 text-sm text-gray-500 dark:text-gray-300">
    These companies have purchased in the last 12 months.
  </p>

  <div class="flex flex-col mt-6">
    <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
      <div class="inline-block min-w-full py-2 align-middle md:px-6 lg:px-8">

onesamket

import { ExclamationTriangleIcon } from "@radix-ui/react-icons";

interface FormErrorProps {
    message?: string;
};

export const FormError = ({
    message,
}: FormErrorProps) => {
    if (!message) return null;

onesamket

import React from 'react';

const Spinner = () => {
    return (
        <div
            className="inline-block h-4 w-4 mr-2 dark:bg-white bg-slate-950 animate-spin rounded-full border-2 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]"
            role="status"
        >
        </div>
    );

onesamket

"use client";
import { FormError } from '@/components/shared/form-error';
import Spinner from '@/components/shared/spinner';
import { Button } from '@/components/ui/button';
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form';
import { Input } from '@/components/ui/input';
import { ToastAction } from '@/components/ui/toast';
import { toast } from '@/components/ui/use-toast';
import { zodResolver } from '@hookform/resolvers/zod';
import { signIn } from 'next-auth/react';