feat: add template checkpoint edit dialog and vendor management components

- Implemented TemplateCheckpointEditDialog for creating and editing inspection checkpoints.
- Added VendorActions component for managing vendor actions including edit, activate/deactivate, and delete.
- Created VendorContext for managing vendor state across components.
- Developed VendorGeneralInfo component to display detailed vendor information.
- Introduced AedSymbol and Money components for consistent currency representation.
- Added PromptDialog for user input prompts throughout the application.
- Implemented RelationLink component for unified related-data display in CRUD tables.
- Created InspectionTemplatesClient for API interactions related to inspection templates.

apps/dashboard/shared/components/resource-selector/resource-selector-dialog.tsx

@@ -11,7 +11,6 @@ import {
 } from "@/shared/components/ui/dialog"
 import { CrudResource, type CrudResourceProps } from "@/shared/data-view/resource-page"
 import type { ResourcePageClient, ResourceItem } from "@/shared/data-view/resource-page"
-import { Card, CardContent } from "@/shared/components/ui/card"
 
 export type ResourceSelectorDialogProps<TClient extends ResourcePageClient> = {
     /** Dialog title shown in the header */
@@ -31,6 +30,10 @@ export type ResourceSelectorDialogProps<TClient extends ResourcePageClient> = {
      * - "single": row click immediately fires onConfirm with the clicked row
      */
     selectionMode?: "single" | "multi"
+    /** Show a search input above the table. Defaults to true. */
+    searchable?: boolean
+    /** Placeholder for the search input. */
+    searchPlaceholder?: string
 }
 
 export function ResourceSelectorDialog<TClient extends ResourcePageClient>({
@@ -41,6 +44,8 @@ export function ResourceSelectorDialog<TClient extends ResourcePageClient>({
     crudProps,
     rowKey,
     selectionMode = "multi",
+    searchable = true,
+    searchPlaceholder = "Search...",
 }: ResourceSelectorDialogProps<TClient>) {
     type TItem = ResourceItem<TClient>
 
@@ -70,33 +75,36 @@ export function ResourceSelectorDialog<TClient extends ResourcePageClient>({
         onOpenChange(false)
     }
 
+    const sharedCrudProps = {
+        ...crudProps,
+        localState: crudProps.localState ?? true,
+        searchable: crudProps.searchable ?? searchable,
+        searchPlaceholder: crudProps.searchPlaceholder ?? searchPlaceholder,
+    }
+
     return (
         <Dialog open={open} onOpenChange={(v) => { if (!v) handleCancel() }}>
-            <DialogContent className="min-w-4xl max-h-[90vh] flex flex-col">
+            <DialogContent className="min-w-4xl max-h-[90vh] flex flex-col gap-3 p-4">
                 <DialogHeader>
-                    <DialogTitle className="text-2xl font-bold">{title}</DialogTitle>
+                    <DialogTitle className="text-xl font-semibold">{title}</DialogTitle>
                 </DialogHeader>
-                <div className="flex-1 overflow-auto">
-                    <Card className="rounded-none border-0 shadow-none">
-                        <CardContent className="p-0">
-                            {selectionMode === "single" ? (
-                                <CrudResource<TClient>
-                                    {...crudProps}
-                                    onRowClick={handleRowClick}
-                                />
-                            ) : (
-                                <CrudResource<TClient>
-                                    {...crudProps}
-                                    tableProps={{
-                                        selection: {
-                                            onSelectionChange: handleSelectionChange,
-                                            ...(rowKey ? { rowKey } : {}),
-                                        },
-                                    }}
-                                />
-                            )}
-                        </CardContent>
-                    </Card>
+                <div className="flex-1 overflow-auto min-h-0">
+                    {selectionMode === "single" ? (
+                        <CrudResource<TClient>
+                            {...sharedCrudProps}
+                            onRowClick={handleRowClick}
+                        />
+                    ) : (
+                        <CrudResource<TClient>
+                            {...sharedCrudProps}
+                            tableProps={{
+                                selection: {
+                                    onSelectionChange: handleSelectionChange,
+                                    ...(rowKey ? { rowKey } : {}),
+                                },
+                            }}
+                        />
+                    )}
                 </div>
                 {selectionMode === "multi" && (
                     <DialogFooter>