feat(submissions): Implement submissions page with paginated table

This commit introduces a new page for users to view their submissions in a structured and paginated table. This allows users to easily track their submission history and access key details.

The main changes include:
- A new page at `/submissions` to display the submissions list.
- A `SubmissionsTable` component to render submission data, including title, country, status, and a link to the submission URL.
- Integration of `react-paginate` to handle navigation through large sets of data.
- A new `useSubmissions` custom hook using TanStack Query for efficient, paginated data fetching from the API.
- Addition of the `currency-symbol-map` dependency to display prices with the correct currency symbol.

src/components/Tables/customers/index.tsx

@@ -18,6 +18,9 @@ import Modal from "@/components/ui/modal";
 import { TAssignCustomerToCompanyCredentials } from "@/lib/api";
 import { toast } from "react-toastify";
 import Status from "@/components/ui/Status";
+import { unixToDate } from "@/utils/shared";
+import { custom } from "zod";
+
 const CustomersTable = () => {
   const {
     isPending,
@@ -62,10 +65,15 @@ const CustomersTable = () => {
             <TableRow key={customer.id}>
               <TableCell colSpan={100}>{customer.full_name}</TableCell>
               <TableCell colSpan={100}>{customer.email}</TableCell>
-              <TableCell colSpan={100}>{customer.created_at}</TableCell>
-              <TableCell colSpan={100}>{customer.type}</TableCell>
               <TableCell colSpan={100}>
-                <Status status={customer.status}>{customer.status}</Status>
+                {unixToDate(customer.created_at)}
+              </TableCell>
+
+              <TableCell colSpan={100} className="uppercase">{customer.type}</TableCell>
+              <TableCell colSpan={100}>
+                <Status status={customer.status}>
+                  <Status status={customer.status}>{customer.status}</Status>
+                </Status>
               </TableCell>
               <TableCell colSpan={100}>
                 {customer.companies?.length ? (
@@ -76,6 +84,7 @@ const CustomersTable = () => {
                   <span>None</span>
                 )}
               </TableCell>
+              <TableCell colSpan={100}>{customer.role ?? "-"}</TableCell>
               <TableCell className="text-start xl:pr-7.5">
                 <div className="flex items-center justify-start gap-x-3.5">
                   <button

src/components/Tables/customers/useCustomerListPresenter.ts

@@ -75,6 +75,7 @@ const useCustomerListPresenter = () => {
     "type",
     "status",
     "company",
+    "role",
     "actions",
   ];
   const onConfirmDelete = () => {