feat: add vendor optional fields and configuration hooks

- Implemented VendorOptionalFields component to handle optional vendor details (mobile, email, address) with validation.
- Created useCustomerConfig hook to load optional customer field settings from Sales configuration.
- Developed useProcurementConfig hook to manage Procurement configuration flags.
- Introduced accessConfigApi for managing access configuration settings.
- Added openingBalancesApi for handling opening balances operations.
- Created procurementConfigApi for managing procurement configuration settings.
- Implemented nav-routes for permission-based routing.
- Developed PDF generation for purchase orders with dynamic vendor and item details.
- Added purchase-order tax helpers for tax calculations and formatting.
- Defined types for opening balances and related operations.

Frontend/erp-system/hooks/use-procurement-config.ts

@@ -0,0 +1,43 @@
+"use client"
+
+import { useEffect, useState } from "react"
+
+import { procurementConfig } from "@/lib/api/procurement-config"
+import { ProcurementConfig } from "@/types/procurement"
+
+/** Everything off — what a screen assumes until the real flags arrive (or if they cannot be read). */
+export const PROCUREMENT_CONFIG_OFF: ProcurementConfig = {
+  vendorContactMode: "None",
+  vendorAddressEnabled: false,
+  vendorPaymentTermsEnabled: false,
+  vendorTaxRegEnabled: false,
+  poTaxEnabled: false,
+  updatedAt: null,
+  updatedBy: null,
+}
+
+/**
+ * Loads the Procurement configuration flags. A failed read leaves every optional field hidden
+ * rather than blocking the screen — the server rejects gated values on its own anyway.
+ */
+export function useProcurementConfig(): { config: ProcurementConfig; loaded: boolean } {
+  const [config, setConfig] = useState<ProcurementConfig>(PROCUREMENT_CONFIG_OFF)
+  const [loaded, setLoaded] = useState(false)
+
+  useEffect(() => {
+    let active = true
+    procurementConfig()
+      .then((c) => {
+        if (active) setConfig(c)
+      })
+      .catch(() => {})
+      .finally(() => {
+        if (active) setLoaded(true)
+      })
+    return () => {
+      active = false
+    }
+  }, [])
+
+  return { config, loaded }
+}