feat(companies): implement companies page with data table

This commit introduces a new "Companies" page to the dashboard, providing a comprehensive view of company data in a sortable and paginated table.

Key changes include:
- A new page at `/companies` to display the data table.
- A new API route `/api/companies` that serves mock company data.
- A `CompaniesTable` component built with `react-table` featuring sorting, pagination, and search functionality.
- Reusable `TablePagination` and `TableActions` components to support the table.
- The `moment` library has been added as a dependency to format dates within the table.
- A new `CrossIcon` has been added for UI controls.
- The `InputGroup` component is enhanced with an `autoComplete` prop.
- A link to the new "Companies" page has been added to the sidebar navigation.

src/components/FormElements/InputGroup/index.tsx

@@ -1,5 +1,9 @@
 import { cn } from "@/lib/utils";
-import { type HTMLInputTypeAttribute, useId } from "react";
+import {
+  HTMLInputAutoCompleteAttribute,
+  type HTMLInputTypeAttribute,
+  useId,
+} from "react";
 import {
   type FieldErrors,
   type FieldValues,
@@ -23,6 +27,7 @@ type InputGroupProps<T extends FieldValues> = {
   icon?: React.ReactNode;
   iconPosition?: "left" | "right";
   height?: "sm" | "default";
+  autoComplete?: HTMLInputAutoCompleteAttribute;
   defaultValue?: string;
   register?: UseFormRegister<T>;
   errors?: FieldErrors<T>;
@@ -41,7 +46,7 @@ const InputGroup = <T extends FieldValues>({
   name,
   register,
   errors,
-
+  autoComplete,
   onChange,
   onBlur,
   ref,
@@ -75,6 +80,7 @@ const InputGroup = <T extends FieldValues>({
           placeholder={placeholder}
           name={name}
           ref={ref}
+          autoComplete={autoComplete}
           onChange={(e) => {
             onChange?.(e);
             handleChange?.(e);

src/components/FormElements/select.tsx

@@ -2,7 +2,7 @@
 
 import { ChevronUpIcon } from "@/assets/icons";
 import { cn } from "@/lib/utils";
-import { useId, useState } from "react";
+import { useId, useState, type ChangeEvent } from "react";
 import {
   type FieldErrors,
   type FieldValues,
@@ -16,6 +16,7 @@ type PropsType<T extends FieldValues> = {
   label: string;
   items: { value: string; label: string }[];
   prefixIcon?: React.ReactNode;
+  onChange?: (e: ChangeEvent<HTMLSelectElement>) => void;
   className?: string;
   register?: UseFormRegister<T>;
   errors?: FieldErrors<T>;