humam/garage-erp
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updates

Browse Source
This commit is contained in:
mohammadkhayata
2026-04-09 15:17:07 +03:00
parent c5f6d2f596
commit 29cc9c6f4e
23 changed files with 420 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/dashboard/app/(authenticated)/items/parts/page.tsx
+24 -9
View File
@@ -3,12 +3,17 @@
import { ResourcePage } from "@/shared/data-view/resource-page"
import { ColumnHeader } from "@/shared/data-view/table-view"
import FormDialog from "@/shared/components/form-dialog"
import { ImportDataButton } from "@/shared/components/import-data-button"
import { ExportDataButton } from "@/shared/components/export-data-button"
import { PartForm } from "@/modules/parts/part-form"
import { Badge } from "@/shared/components/ui/badge"
import { useAuthApi } from "@/shared/useApi"
import { PARTS_ROUTES } from "@garage/api"
import type { PartsClient } from "@garage/api"
export default function PartsPage() {
const api = useAuthApi()
return (
<ResourcePage<PartsClient>
pageTitle="Parts"
@@ -16,15 +21,25 @@ export default function PartsPage() {
getClient={(api) => api.parts}
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
<FormDialog title="Part">
{(resourceId) => (
<PartForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
<div className="flex items-center gap-2">
<ImportDataButton
onImport={(file) => api.parts.importData(file)}
onSuccess={invalidateQuery}
/>
<ExportDataButton
onExport={(filters) => api.parts.exportData(filters)}
fileName="parts"
/>
<FormDialog title="Part">
{(resourceId) => (
<PartForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
</div>
),
})}
columns={({ actionsColumn }) => [
apps/dashboard/app/(authenticated)/items/services/page.tsx
+25 -10
View File
@@ -3,11 +3,16 @@
import { ResourcePage } from "@/shared/data-view/resource-page"
import { ColumnHeader } from "@/shared/data-view/table-view"
import FormDialog from "@/shared/components/form-dialog"
import { ImportDataButton } from "@/shared/components/import-data-button"
import { ExportDataButton } from "@/shared/components/export-data-button"
import { useAuthApi } from "@/shared/useApi"
import { ServiceForm } from "@/modules/services/service-form"
import { SERVICE_ROUTES } from "@garage/api"
import type { ServicesClient } from "@garage/api"
export default function ServicesPage() {
const api = useAuthApi()
return (
<ResourcePage<ServicesClient>
pageTitle="Services"
@@ -15,15 +20,25 @@ export default function ServicesPage() {
getClient={(api) => api.services}
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
<FormDialog title="Service">
{(resourceId) => (
<ServiceForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
<div className="flex items-center gap-2">
<ImportDataButton
onImport={(file) => api.services.importData(file)}
onSuccess={invalidateQuery}
/>
<ExportDataButton
onExport={(filters) => api.services.exportData(filters)}
fileName="services"
/>
<FormDialog title="Service">
{(resourceId) => (
<ServiceForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
</div>
),
})}
columns={({ actionsColumn }) => [
@@ -48,7 +63,7 @@ export default function ServicesPage() {
cell: ({ row }) => {
const val = (row.original as any).description
return val
? <span className="max-w-[200px] truncate block">{val}</span>
? <span className="max-w-50 truncate block">{val}</span>
: "—"
},
},
apps/dashboard/app/(authenticated)/sales/customers/page.tsx
+23 -9
View File
@@ -4,6 +4,9 @@ import { useRouter } from 'next/navigation'
import { ResourcePage } from '@/shared/data-view/resource-page'
import { ColumnHeader } from '@/shared/data-view/table-view'
import FormDialog from '@/shared/components/form-dialog'
import { ImportDataButton } from '@/shared/components/import-data-button'
import { ExportDataButton } from '@/shared/components/export-data-button'
import { useAuthApi } from '@/shared/useApi'
import { CustomerForm } from '@/modules/customers/customer-form'
import { CUSTOMER_ROUTES } from '@garage/api'
import type { CustomersClient } from '@garage/api'
@@ -11,6 +14,7 @@ import { Building2Icon, UserIcon } from 'lucide-react'
export default function CustomersPage() {
const router = useRouter()
const api = useAuthApi()
return (
<ResourcePage<CustomersClient>
pageTitle='Customers'
@@ -19,15 +23,25 @@ export default function CustomersPage() {
onRowClick={(row) => router.push(`/sales/customers/${(row as any).id}`)}
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
<FormDialog title="Customer">
{(resourceId) => (
<CustomerForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
<div className='flex items-center gap-2'>
<ImportDataButton
onImport={(file) => api.customers.importData(file)}
onSuccess={invalidateQuery}
/>
<ExportDataButton
onExport={(filters) => api.customers.exportData(filters)}
fileName='customers'
/>
<FormDialog title="Customer">
{(resourceId) => (
<CustomerForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
</div>
),
})}
columns={({ actionsColumn }) => [
apps/dashboard/app/(authenticated)/sales/vehicles/page.tsx
+23 -9
View File
@@ -4,6 +4,9 @@ import { useRouter } from 'next/navigation'
import { ResourcePage } from '@/shared/data-view/resource-page'
import { ColumnHeader } from '@/shared/data-view/table-view'
import FormDialog from '@/shared/components/form-dialog'
import { ImportDataButton } from '@/shared/components/import-data-button'
import { ExportDataButton } from '@/shared/components/export-data-button'
import { useAuthApi } from '@/shared/useApi'
import { VehicleForm } from '@/modules/vehicles/vehicle-form'
import { VEHICLE_ROUTES } from '@garage/api'
import type { VehiclesClient } from '@garage/api'
@@ -11,6 +14,7 @@ import { CarIcon } from 'lucide-react'
export default function VehiclesPage() {
const router = useRouter()
const api = useAuthApi()
return (
<ResourcePage<VehiclesClient>
pageTitle="Vehicles"
@@ -19,15 +23,25 @@ export default function VehiclesPage() {
onRowClick={(row) => router.push(`/sales/vehicles/${(row as any).id}`)}
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
<FormDialog title="Vehicle">
{(resourceId) => (
<VehicleForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
<div className='flex items-center gap-2'>
<ImportDataButton
onImport={(file) => api.vehicles.importData(file)}
onSuccess={invalidateQuery}
/>
<ExportDataButton
onExport={(filters) => api.vehicles.exportData(filters)}
fileName='vehicles'
/>
<FormDialog title="Vehicle">
{(resourceId) => (
<VehicleForm
resourceId={resourceId}
initialData={selectedItem}
onSuccess={invalidateQuery}
/>
)}
</FormDialog>
</div>
),
})}
columns={({ actionsColumn }) => [
apps/dashboard/app/layout.tsx
+7 -1
View File
@@ -1,15 +1,21 @@
import { Geist_Mono, Inter } from "next/font/google"
import "./globals.css"
import { QueryProvider } from "@/shared/components/query-provider"
import { ThemeProvider } from "@/shared/components/theme-provider"
import { Toaster } from "@/shared/components/ui/sonner"
import { ConfirmDialog } from "@/shared/components/confirm-dialog"
import { NuqsAdapter } from "nuqs/adapters/next/app"
import { cn } from "@/shared/lib/utils"
import './globals.css'
const inter = Inter({ subsets: ["latin"], variable: "--font-sans" })
export const metadata = {
title: "Garage ERP Dashboard",
description: "Manage your garage with ease using Garage ERP Dashboard.",
}
const fontMono = Geist_Mono({
subsets: ["latin"],
variable: "--font-mono",
apps/dashboard/modules/appointments/appointment.schema.ts
+5 -7
View File
@@ -1,16 +1,14 @@
import { z } from "zod"
import { AppointmentStatus } from "@garage/api"
const relationFieldSchema = z
.object({ value: z.string(), label: z.string() })
.nullable()
const APPOINTMENT_STATUS_OPTIONS = [
{ value: "requested", label: "Requested" },
{ value: "confirmed", label: "Confirmed" },
{ value: "in_progress", label: "In Progress" },
{ value: "completed", label: "Completed" },
{ value: "cancelled", label: "Cancelled" },
]
const APPOINTMENT_STATUS_OPTIONS = AppointmentStatus.map((v) => ({
value: v,
label: v.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()),
}))
const appointmentFormSchema = z.object({
title: z.string().min(1, "Title is required"),
apps/dashboard/modules/credit-notes/credit-note-form.tsx
+5 -7
View File
@@ -22,7 +22,7 @@ import {
creditNoteFormSchema,
type CreditNoteFormValues,
} from "./credit-note.schema"
import { CREDIT_NOTE_ROUTES, DEPARTMENT_ROUTES } from "@garage/api"
import { CREDIT_NOTE_ROUTES, DEPARTMENT_ROUTES, CreditNoteStatus } from "@garage/api"
import { RhfCustomerSelectField } from "@/modules/customers/rhf-customer-select-field"
// ── Shared mapOption for async selects ──
@@ -36,12 +36,10 @@ const STORE_OBJECT = { getOptionValue: (o: any) => o, getOptionLabel: (o: any) =
// ── Constants ──
const STATUS_OPTIONS = [
{ value: "draft", label: "Draft" },
{ value: "open", label: "Open" },
{ value: "applied", label: "Applied" },
{ value: "void", label: "Void" },
]
const STATUS_OPTIONS = CreditNoteStatus.map((v) => ({
value: v,
label: v.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()),
}))
// ── Props ──
apps/dashboard/modules/employees/employee-form.tsx
+5 -5
View File
@@ -22,7 +22,7 @@ import {
employeeFormSchema,
type EmployeeFormValues,
} from "./employee.schema"
import { EMPLOYEE_ROUTES, DEPARTMENT_ROUTES, SHOP_TIMING_ROUTES, SHOP_CALENDAR_ROUTES } from "@garage/api"
import { EMPLOYEE_ROUTES, DEPARTMENT_ROUTES, SHOP_TIMING_ROUTES, SHOP_CALENDAR_ROUTES, EmployeeType } from "@garage/api"
// ── Constants ──
@@ -31,10 +31,10 @@ const STATUS_OPTIONS = [
{ value: "inactive", label: "Inactive" },
]
const TYPE_OPTIONS = [
{ value: "employee", label: "Employee" },
{ value: "contractor", label: "Contractor" },
]
const TYPE_OPTIONS = EmployeeType.map((v) => ({
value: v,
label: v.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()),
}))
// ── Props ──
apps/dashboard/modules/employees/employee.schema.ts
+2 -1
View File
@@ -1,11 +1,12 @@
import { z } from "zod"
import { EmployeeType } from "@garage/api"
const relationFieldSchema = z
.object({ value: z.string(), label: z.string() })
.nullable()
const STATUS_OPTIONS = ["active", "inactive"] as const
const TYPE_OPTIONS = ["employee", "contractor"] as const
const TYPE_OPTIONS = EmployeeType
const employeeFormSchema = z.object({
department: relationFieldSchema,
apps/dashboard/modules/expenses/expense-form.tsx
+5 -5
View File
@@ -22,15 +22,15 @@ import {
expenseFormSchema,
type ExpenseFormValues,
} from "./expense.schema"
import { EXPENSE_ROUTES, JOB_CARD_ROUTES, VENDOR_ROUTES, DEPARTMENT_ROUTES } from "@garage/api"
import { EXPENSE_ROUTES, JOB_CARD_ROUTES, VENDOR_ROUTES, DEPARTMENT_ROUTES, ExpenseStatus } from "@garage/api"
import { getFullName } from "@/shared/utils/getFullName"
// ── Constants ──
const STATUS_OPTIONS = [
{ value: "open", label: "Open" },
{ value: "paid", label: "Paid" },
]
const STATUS_OPTIONS = ExpenseStatus.map((v) => ({
value: v,
label: v.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()),
}))
// ── Props ──
apps/dashboard/modules/invoices/invoice-form.tsx
+7 -9
View File
@@ -11,6 +11,7 @@ import {
RhfSelectField,
RhfTextareaField,
RhfAsyncSelectField,
RhfAutoGenerateField,
} from "@/shared/components/form"
import { toast } from "sonner"
import { useAuthApi } from "@/shared/useApi"
@@ -22,19 +23,16 @@ import {
invoiceFormSchema,
type InvoiceFormValues,
} from "./invoice.schema"
import { INVOICE_ROUTES, DEPARTMENT_ROUTES } from "@garage/api"
import { INVOICE_ROUTES, DEPARTMENT_ROUTES, InvoiceStatus } from "@garage/api"
import { RhfCustomerSelectField } from "@/modules/customers/rhf-customer-select-field"
import { RhfVehicleSelectField } from "@/modules/vehicles/rhf-vehicle-select-field"
// ── Constants ──
const STATUS_OPTIONS = [
{ value: "draft", label: "Draft" },
{ value: "open", label: "Open" },
{ value: "paid", label: "Paid" },
{ value: "overdue", label: "Overdue" },
{ value: "void", label: "Void" },
]
const STATUS_OPTIONS = InvoiceStatus.map((v) => ({
value: v,
label: v.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()),
}))
// ── Props ──
@@ -148,7 +146,7 @@ export function InvoiceForm({ resourceId, initialData, onSuccess }: InvoiceFormP
<RhfTextField name="subject" label="Subject" placeholder="Invoice subject" required />
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<RhfTextField name="invoice_number" label="Invoice Number" placeholder="INV-0001" />
<RhfAutoGenerateField table="invoices" name="invoice_number" label="Invoice Number" placeholder="INV-0001" />
<RhfSelectField
name="status"
label="Status"
apps/dashboard/modules/parts/part-form.tsx
+62 -62
View File
@@ -22,13 +22,13 @@ import { useFormMutation } from "@/shared/hooks/use-form-mutation"
import { toId } from "@/shared/lib/utils"
import { partFormSchema, type PartFormValues } from "./part.schema"
import { PARTS_ROUTES } from "@garage/api"
import { CrudListItem, PARTS_ROUTES, PartsClient } from "@garage/api"
// ── Props ──
export type PartFormProps = {
resourceId?: string | null
initialData?: unknown
initialData?: CrudListItem<PartsClient> | null
onSuccess?: () => void
}
@@ -150,59 +150,59 @@ export function PartForm({ resourceId, initialData, onSuccess }: PartFormProps)
/>
</div>
{!isEditing && (
<>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<RhfAsyncSelectField
name="shop_type"
label="Shop Type"
placeholder="Select shop type"
queryKey={["shop-types"]}
listFn={() => api.shopTypes.list()}
mapOption={mapLookupOption}
createForm={(props) => <ShopTypeInlineForm {...props} />}
createLabel="Shop Type"
{...STORE_OBJECT}
/>
<RhfAsyncSelectField
name="category"
label="Category"
placeholder="Select category"
queryKey={["inventory-categories"]}
listFn={() => api.inventory.listCategories()}
mapOption={mapLookupOption}
createForm={(props) => <InventoryCategoryInlineForm {...props} />}
createLabel="Category"
{...STORE_OBJECT}
/>
</div>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<RhfAsyncSelectField
name="unit_type"
label="Unit Type"
placeholder="Select unit type"
queryKey={["unit-types"]}
listFn={() => api.inventory.listUnitTypes()}
mapOption={mapLookupOption}
createForm={(props) => <UnitTypeInlineForm {...props} />}
createLabel="Unit Type"
{...STORE_OBJECT}
/>
<RhfAsyncSelectField
name="department"
label="Department"
placeholder="Select department"
queryKey={["departments"]}
listFn={() => api.departments.list()}
mapOption={(item: any) => ({ value: String(item.id), label: item.name ?? String(item.id) })}
createForm={(props) => <DepartmentInlineForm {...props} />}
createLabel="Department"
{...STORE_OBJECT}
/>
</div>
</>
)}
<>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<RhfAsyncSelectField
name="shop_type"
label="Shop Type"
placeholder="Select shop type"
queryKey={["shop-types"]}
listFn={() => api.shopTypes.list()}
mapOption={mapLookupOption}
createForm={(props) => <ShopTypeInlineForm {...props} />}
createLabel="Shop Type"
{...STORE_OBJECT}
/>
<RhfAsyncSelectField
name="category"
label="Category"
placeholder="Select category"
queryKey={["inventory-categories"]}
listFn={() => api.inventory.listCategories()}
mapOption={mapLookupOption}
createForm={(props) => <InventoryCategoryInlineForm {...props} />}
createLabel="Category"
{...STORE_OBJECT}
/>
</div>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<RhfAsyncSelectField
name="unit_type"
label="Unit Type"
placeholder="Select unit type"
queryKey={["unit-types"]}
listFn={() => api.inventory.listUnitTypes()}
mapOption={mapLookupOption}
createForm={(props) => <UnitTypeInlineForm {...props} />}
createLabel="Unit Type"
{...STORE_OBJECT}
/>
<RhfAsyncSelectField
name="department"
label="Department"
placeholder="Select department"
queryKey={["departments"]}
listFn={() => api.departments.list()}
mapOption={(item: any) => ({ value: String(item.id), label: item.name ?? String(item.id) })}
createForm={(props) => <DepartmentInlineForm {...props} />}
createLabel="Department"
{...STORE_OBJECT}
/>
</div>
</>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<RhfTextField
@@ -211,14 +211,14 @@ export function PartForm({ resourceId, initialData, onSuccess }: PartFormProps)
placeholder="0.00"
type="number"
/>
{!isEditing && (
<RhfTextField
name="purchase_price"
label="Purchase Price"
placeholder="0.00"
type="number"
/>
)}
<RhfTextField
name="purchase_price"
label="Purchase Price"
placeholder="0.00"
type="number"
/>
</div>
<RhfTextareaField
apps/dashboard/modules/services/department-assignment-types.ts
+7 -6
View File
@@ -1,7 +1,8 @@
export const DEPARTMENT_ASSIGNMENT_TYPE_OPTIONS = [
{ value: "none", label: "None" },
{ value: "bays", label: "Bays" },
{ value: "outsourced", label: "Outsourced" },
] as const
import { AssignmentType } from "@garage/api"
export type DepartmentAssignmentType = typeof DEPARTMENT_ASSIGNMENT_TYPE_OPTIONS[number]["value"]
export const DEPARTMENT_ASSIGNMENT_TYPE_OPTIONS = AssignmentType.map((v) => ({
value: v,
label: v.charAt(0).toUpperCase() + v.slice(1),
}))
export type DepartmentAssignmentType = (typeof AssignmentType)[number]
apps/dashboard/shared/components/export-data-button.tsx
+54
View File
@@ -0,0 +1,54 @@
"use client"
import { useState } from "react"
import { Button } from "@/shared/components/ui/button"
import { Download, Loader2 } from "lucide-react"
import { toast } from "sonner"
type ExportDataButtonProps = {
onExport: (filters?: Record<string, unknown>) => Promise<Blob>
fileName?: string
filters?: Record<string, unknown>
label?: string
}
export function ExportDataButton({
onExport,
fileName = "export",
filters,
label = "Export",
}: ExportDataButtonProps) {
const [isPending, setIsPending] = useState(false)
const handleExport = async () => {
setIsPending(true)
try {
const blob = await onExport(filters)
const url = URL.createObjectURL(blob)
const a = document.createElement("a")
a.href = url
a.download = `${fileName}.xlsx`
document.body.appendChild(a)
a.click()
document.body.removeChild(a)
URL.revokeObjectURL(url)
toast.success("Data exported successfully")
} catch (err: any) {
toast.error(err?.message ?? "Failed to export data")
} finally {
setIsPending(false)
}
}
return (
<Button
size="sm"
variant="outline"
disabled={isPending}
onClick={handleExport}
>
{isPending ? <Loader2 className="animate-spin" /> : <Download />}
{label}
</Button>
)
}
apps/dashboard/shared/components/import-data-button.tsx
+61
View File
@@ -0,0 +1,61 @@
"use client"
import React, { useRef, useState } from "react"
import { Button } from "@/shared/components/ui/button"
import { Upload, Loader2 } from "lucide-react"
import { toast } from "sonner"
type ImportDataButtonProps = {
onImport: (file: File) => Promise<{ message?: string }>
onSuccess?: () => void
accept?: string
label?: string
}
export function ImportDataButton({
onImport,
onSuccess,
accept = ".xlsx,.xls,.csv",
label = "Import",
}: ImportDataButtonProps) {
const inputRef = useRef<HTMLInputElement>(null)
const [isPending, setIsPending] = useState(false)
const handleFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
const file = e.target.files?.[0]
if (!file) return
setIsPending(true)
try {
const result = await onImport(file)
toast.success(result.message ?? "Data imported successfully")
onSuccess?.()
} catch (err: any) {
toast.error(err?.message ?? "Failed to import data")
} finally {
setIsPending(false)
if (inputRef.current) inputRef.current.value = ""
}
}
return (
<>
<input
ref={inputRef}
type="file"
accept={accept}
className="hidden"
onChange={handleFileChange}
/>
<Button
size="sm"
variant="outline"
disabled={isPending}
onClick={() => inputRef.current?.click()}
>
{isPending ? <Loader2 className="animate-spin" /> : <Upload />}
{label}
</Button>
</>
)
}