add datetable cnfcnpj

apps/admin.saladeaula.digital/app/routes/_.$orgid.orders._index/columns.tsx

@@ -1,5 +1,10 @@
 'use client'
 
+import {
+  DataTableColumnDatetime,
+  DataTableColumnCurrency,
+  DataTableColumnHeader
+} from '@repo/ui/components/data-table'
 import { type ColumnDef } from '@tanstack/react-table'
 
 // This type is used to define the shape of our data.
@@ -12,14 +17,6 @@ export type Order = {
   name: string
 }
 
-const formatted = new Intl.DateTimeFormat('pt-BR', {
-  day: '2-digit',
-  month: '2-digit',
-  year: 'numeric',
-  hour: '2-digit',
-  minute: '2-digit'
-})
-
 export const columns: ColumnDef<Order>[] = [
   {
     accessorKey: 'payment_method',
@@ -32,43 +29,35 @@ export const columns: ColumnDef<Order>[] = [
   {
     accessorKey: 'total',
     header: 'Valor total',
-    cell: ({ row }) => {
-      const amount = parseFloat(row.getValue('total'))
-      const formatted = new Intl.NumberFormat('pt-BR', {
-        style: 'currency',
-        currency: 'BRL'
-      }).format(amount)
-
-      return <div className="font-medium">{formatted}</div>
-    }
+    cell: ({ row, column }) => (
+      <DataTableColumnCurrency row={row} column={column} />
+    )
   },
   {
-    header: 'Comprado em',
-    cell: ({ row }) => {
-      const createdAt = new Date(row.original.create_date)
-      return formatted.format(createdAt)
-    }
+    accessorKey: 'create_date',
+    enableSorting: true,
+    meta: { title: 'Comprado em' },
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
+    cell: ({ row, column }) => (
+      <DataTableColumnDatetime row={row} column={column} />
+    )
   },
   {
-    header: 'Vencimento em',
-    cell: ({ row }) => {
-      try {
-        const dueDate = new Date(row.original.due_date)
-        return formatted.format(dueDate)
-      } catch {
-        return 'N/A'
-      }
-    }
+    accessorKey: 'due_date',
+    enableSorting: true,
+    meta: { title: 'Vencimento em' },
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
+    cell: ({ row, column }) => (
+      <DataTableColumnDatetime row={row} column={column} />
+    )
   },
   {
-    header: 'Pago em',
-    cell: ({ row }) => {
-      if (row.original.payment_date) {
-        const createdAt = new Date(row.original.payment_date)
-        return formatted.format(createdAt)
-      }
-
-      return <></>
-    }
+    accessorKey: 'payment_date',
+    enableSorting: true,
+    meta: { title: 'Pago em' },
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
+    cell: ({ row, column }) => (
+      <DataTableColumnDatetime row={row} column={column} />
+    )
   }
 ]

apps/admin.saladeaula.digital/app/routes/_.$orgid.orders._index/route.tsx

@@ -2,6 +2,7 @@ import type { Route } from './+types/route'
 
 import { Suspense } from 'react'
 import { Await } from 'react-router'
+import { MeiliSearchFilterBuilder } from 'meilisearch-helper'
 
 import { DataTable } from '@repo/ui/components/data-table'
 import { Skeleton } from '@repo/ui/components/skeleton'
@@ -16,18 +17,25 @@ export function meta({}: Route.MetaArgs) {
 export async function loader({ params, context, request }: Route.LoaderArgs) {
   const { searchParams } = new URL(request.url)
   const { orgid } = params
+  const query = searchParams.get('q') || ''
+  const sort = searchParams.get('sort') || 'create_date:desc'
   const page = Number(searchParams.get('p')) + 1
   const hitsPerPage = Number(searchParams.get('perPage')) || 25
 
+  let builder = new MeiliSearchFilterBuilder().where('tenant_id', '=', orgid)
+
+  const orders = createSearch({
+    index: 'betaeducacao-prod-orders',
+    filter: builder.build(),
+    sort: [sort],
+    query,
+    page,
+    hitsPerPage,
+    env: context.cloudflare.env
+  })
+
   return {
-    data: createSearch({
-      index: 'betaeducacao-prod-orders',
-      sort: ['create_date:desc'],
-      filter: `tenant_id = ${orgid}`,
-      page,
-      hitsPerPage,
-      env: context.cloudflare.env
-    })
+    data: orders
   }
 }
 
@@ -48,7 +56,7 @@ export default function Route({ loaderData: { data } }) {
         {({ hits, page, hitsPerPage, totalHits }) => {
           return (
             <DataTable
-              sort={[{ id: 'created_at', desc: true }]}
+              sort={[{ id: 'create_date', desc: true }]}
               columns={columns}
               data={hits as Order[]}
               pageIndex={page - 1}