feat(shift): Support printing shift report

turfaa · Nov 13, 2024 · b648a15 · b648a15
1 parent 13587c6
commit b648a15
Show file tree

Hide file tree

Showing 6 changed files with 111 additions and 3 deletions.
diff --git a/app/shifts/table.tsx b/app/shifts/table.tsx
@@ -1,9 +1,14 @@
 import React, { use } from "react"
+import Link from "next/link"
 import { Table } from "@/cui/components"
 import { auth } from "@/lib/auth"
 import { getShifts } from "@/lib/api/shift"
 import { SearchParams } from "@/types/search-params"
 import Loading from "@/components/loading"
+import { PrinterIcon } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
+import { Tooltip } from "@/components/ui/tooltip"
 
 
 export interface ShiftsTableProps {
@@ -15,7 +20,27 @@ export default function ShiftsTable(props: ShiftsTableProps): React.ReactElement
     const searchParams = use(props.searchParams)
     const data = use(getShifts(searchParams.from, searchParams.until, session))
 
-    return <Table table={data} />
+    return (
+        <Table
+            table={data}
+            rowActions={[
+                (id) => (
+                    <Link href={`/api/shifts/${id}/show`} target="_blank" key={id}>
+                        <TooltipProvider>
+                            <Tooltip>
+                                <TooltipTrigger asChild>
+                                    <Button variant="ghost" size="icon">
+                                        <PrinterIcon />
+                                    </Button>
+                                </TooltipTrigger>
+                                <TooltipContent>Print</TooltipContent>
+                            </Tooltip>
+                        </TooltipProvider>
+                    </Link>
+                ),
+            ]}
+        />
+    )
 }
 
 export function ShiftsTableFallback(): React.ReactElement {

diff --git a/components/ui/tooltip.tsx b/components/ui/tooltip.tsx
@@ -0,0 +1,32 @@
+"use client"
+
+import * as React from "react"
+import * as TooltipPrimitive from "@radix-ui/react-tooltip"
+
+import { cn } from "@/lib/utils"
+
+const TooltipProvider = TooltipPrimitive.Provider
+
+const Tooltip = TooltipPrimitive.Root
+
+const TooltipTrigger = TooltipPrimitive.Trigger
+
+const TooltipContent = React.forwardRef<
+  React.ElementRef<typeof TooltipPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
+>(({ className, sideOffset = 4, ...props }, ref) => (
+  <TooltipPrimitive.Portal>
+    <TooltipPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      )}
+      {...props}
+    />
+  </TooltipPrimitive.Portal>
+))
+TooltipContent.displayName = TooltipPrimitive.Content.displayName
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
diff --git a/cui/components/table.tsx b/cui/components/table.tsx
@@ -1,4 +1,4 @@
-import React from "react"
+import React, { act } from "react"
 import {
     Table as TableComp,
     TableBody,
@@ -11,13 +11,18 @@ import { Table as TableType } from "../types"
 
 export interface TableProps {
     table: TableType
+    rowActions?: RowAction[]
 }
 
-export default function Table({ table }: TableProps): React.ReactElement {
+export type RowAction = (id: string) => React.ReactElement
+
+export default function Table({ table, rowActions }: TableProps): React.ReactElement {
     if (table.header.length == 0 && table.rows.length == 0) {
         return <></>
     }
 
+    console.log("length", rowActions?.length)
+
     return (
         <TableComp>
             {table.header.length > 0 && (
@@ -37,6 +42,11 @@ export default function Table({ table }: TableProps): React.ReactElement {
                             {row.columns.map((column, index) => (
                                 <TableCell key={index}>{column}</TableCell>
                             ))}
+                            {rowActions && rowActions.length > 0 && (
+                                <TableCell>
+                                    {rowActions.map((action) => action(row.id))}
+                                </TableCell>
+                            )}
                         </TableRow>
                     ))}
                 </TableBody>

diff --git a/middleware.ts b/middleware.ts
@@ -33,6 +33,11 @@ const rewrites = [
         destination: `${process.env.VMEDIS_PROXY_URL}/v2/procurements/drugs`,
         allowedRoles: [Role.ADMIN, Role.STAFF, Role.RESELLER, Role.GUEST],
     },
+    {
+        source: "/api/shifts",
+        destination: `${process.env.VMEDIS_PROXY_URL}/v2/shifts`,
+        allowedRoles: [Role.ADMIN, Role.STAFF],
+    },
 ] satisfies RewriteRule[]
 
 export default auth(async function middleware(

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -24,6 +24,7 @@
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-switch": "^1.1.1",
     "@radix-ui/react-tabs": "^1.1.1",
+    "@radix-ui/react-tooltip": "^1.1.4",
     "@types/react": "npm:[email protected]",
     "autoprefixer": "^10.4.20",
     "chart.js": "^4.4.4",