feat(form): add loading state and replace custom switch component

This commit introduces a loading state for form submissions and replaces the custom switch component with a third-party library for improved user experience and maintainability.

- Adds `react-switch` as a dependency to replace the custom-built switch component, providing a more robust and feature-rich solution.
- Implements a loading indicator on form submission buttons and in the confirmation modal by utilizing the `useIsMutating` hook from TanStack Query. This provides clear visual feedback to the user during asynchronous operations.
- Creates a reusable `FormFooter` component to encapsulate the submit and cancel buttons, centralizing the form submission logic and loading state.
- Refactors the company create/edit forms to use the new `FormFooter` and `react-switch` components.
- Moves the `BreadcrumbItem` type to a shared types file for better code organization.
This commit is contained in:
AmirReza Jamali
2025-09-20 16:13:04 +03:30
parent 2c43e945c2
commit e6493f5d83
27 changed files with 782 additions and 84 deletions
+25
View File
@@ -0,0 +1,25 @@
import { Skeleton } from "./skeleton";
import { TableBody, TableCell, TableRow } from "./table";
interface IProps {
length?: number;
column: number;
}
const TableSkeleton = ({ column, length = 20 }: IProps) => {
return (
<TableBody>
{Array.from({ length }).map((_, i) => (
<TableRow key={i}>
{Array.from({ length: column }).map((_, j) => (
<TableCell key={j} colSpan={100}>
<Skeleton className="h-8" />
</TableCell>
))}
</TableRow>
))}
</TableBody>
);
};
export default TableSkeleton;