Updated icon.

assets/icons/orderitemicon.svg

@@ -4,4 +4,7 @@
     <g transform="matrix(0.822372,0,0,0.822372,2,2.325593)">
         <path d="M25.615,51.541L61.925,51.541C63.571,51.541 65.041,50.302 65.041,48.462C65.041,46.631 63.571,45.412 61.925,45.412L26.434,45.412C25.11,45.412 24.295,44.46 24.093,43.051L19.177,9.045C18.785,6.142 17.522,4.675 13.848,4.675L3.326,4.675C1.539,4.675 0,6.215 0,8.032C0,9.86 1.539,11.411 3.326,11.411L12.627,11.411L17.348,43.696C18.064,48.571 20.686,51.541 25.615,51.541ZM20.362,39.849L62.285,39.849C67.216,39.849 69.857,36.878 70.563,31.952L72.815,16.861C72.877,16.425 72.96,15.886 72.96,15.485C72.96,13.488 71.586,12.07 69.142,12.07L17.504,12.07L17.525,18.229L65.71,18.229L63.868,31.389C63.678,32.83 62.925,33.711 61.558,33.711L20.319,33.711L20.362,39.849ZM28.223,67.493C31.383,67.493 33.901,64.986 33.901,61.805C33.901,58.664 31.383,56.126 28.223,56.126C25.061,56.126 22.513,58.664 22.513,61.805C22.513,64.986 25.061,67.493 28.223,67.493ZM56.875,67.493C60.047,67.493 62.575,64.986 62.575,61.805C62.575,58.664 60.047,56.126 56.875,56.126C53.735,56.126 51.175,58.664 51.175,61.805C51.175,64.986 53.735,67.493 56.875,67.493Z" style="fill-rule:nonzero;"/>
     </g>
+    <g transform="matrix(0.754667,0,0,0.754667,0,25.090254)">
+        <path d="M3.178,17.892L14.469,11.058C16.041,10.11 16.004,8.217 14.469,7.275L3.178,0.415C1.563,-0.576 0,0.29 0,2.137L0,16.19C0,18.069 1.569,18.872 3.178,17.892ZM25.758,14.461L80.772,14.461C83.437,14.461 84.806,13.117 84.806,10.453L84.806,7.792C84.806,5.153 83.437,3.784 80.772,3.784L25.758,3.784C23.094,3.784 21.725,5.153 21.725,7.792L21.725,10.453C21.725,13.117 23.094,14.461 25.758,14.461Z" style="fill-rule:nonzero;"/>
+    </g>
 </svg>

package.json

@@ -77,7 +77,8 @@
     "start": "serve -s build",
     "build": "vite build",
     "dev:electron": "concurrently \"cross-env NODE_ENV=development vite --no-open\" \"cross-env ELECTRON_START_URL=http://localhost:5173 cross-env NODE_ENV=development  electron public/electron.js\"",
-    "build:electron": "vite build && electron-builder"
+    "build:electron": "vite build && electron-builder",
+    "deploy": "vite build && wrangler pages deploy"
   },
   "eslintConfig": {
     "extends": [

src/components/Dashboard/common/NetGrossDisplay.jsx

@@ -4,8 +4,8 @@ import PropTypes from 'prop-types'
 const { Text } = Typography
 
 const NetGrossDisplay = ({ value, prefix = '', suffix = '' }) => {
-  const net = value?.net
-  const gross = value?.gross
+  const net = parseFloat(value?.net)
+  const gross = parseFloat(value?.gross)
 
   return (
     <Flex gap={'middle'} align='center' style={{ height: '100%' }}>

src/components/Dashboard/common/NewObjectForm.jsx

@@ -152,7 +152,10 @@ const NewObjectForm = ({ type, style, defaultValues = {}, children }) => {
   const handleSubmit = async () => {
     try {
       setSubmitLoading(true)
-      const newObject = await createObject(type, objectData)
+      const computedEntries = calculateComputedValues(objectData, model)
+      const computedValuesObject = buildObjectFromEntries(computedEntries)
+      const computedObjectData = merge({}, objectData, computedValuesObject)
+      const newObject = await createObject(type, computedObjectData)
       messageApi.success('Object created successfully')
       return newObject
     } catch (err) {

src/components/Dashboard/common/ObjectForm.jsx

@@ -372,10 +372,21 @@ const ObjectForm = forwardRef(
     const startEditing = () => {
       setIsEditing(true)
       isEditingRef.current = true
-      setObjectData((prev) => ({ ...prev, _isEditing: isEditingRef.current }))
+      const computedEntries = calculateComputedValues(objectData, model)
+      const computedValuesObject = buildObjectFromEntries(computedEntries)
+      setObjectData((prev) => ({
+        ...prev,
+        ...computedValuesObject,
+        _isEditing: isEditingRef.current
+      }))
+      console.log('calculatedEntries', computedValuesObject)
       onStateChangeRef.current({
         isEditing: true,
-        objectData: { ...objectData, _isEditing: isEditingRef.current }
+        objectData: {
+          ...objectData,
+          ...computedValuesObject,
+          _isEditing: isEditingRef.current
+        }
       })
       lockObject(id, type)
     }

src/config.js

@@ -6,9 +6,9 @@ const config = {
     logLevel: 'trace'
   },
   production: {
-    backendUrl: 'https://dev.tombutcher.work/api',
+    backendUrl: 'https://api.farmcontrol.app',
     printServerUrl: 'ws://192.168.68.53:8081',
-    apiServerUrl: 'https://dev-wss.tombutcher.work',
+    apiServerUrl: 'https://ws.farmcontrol.app',
     logLevel: 'error'
   }
 }

src/database/models/Filament.js

@@ -130,7 +130,40 @@ export const Filament = {
       label: 'Cost',
       columnWidth: 150,
       required: true,
-      type: 'currency'
+      type: 'number',
+      prefix: '£'
+    },
+    {
+      name: 'costWithTax',
+      label: 'Cost w/ Tax',
+      columnWidth: 150,
+      required: true,
+      readOnly: true,
+      type: 'number',
+      prefix: '£',
+      value: (objectData) => {
+        if (objectData?.costTaxRate?.rateType == 'percentage') {
+          return (
+            (
+              objectData?.cost *
+              (1 + objectData?.costTaxRate?.rate / 100)
+            ).toFixed(2) || undefined
+          )
+        } else if (objectData?.costTaxRate?.rateType == 'amount') {
+          return (
+            (objectData?.cost + objectData?.costTaxRate?.rate).toFixed(2) ||
+            undefined
+          )
+        }
+      }
+    },
+    {
+      name: 'costTaxRate',
+      label: 'Cost Tax Rate',
+      required: true,
+      type: 'object',
+      objectType: 'taxRate',
+      showHyperlink: true
     },
     {
       name: 'color',

src/database/models/OrderItem.js

@@ -82,11 +82,19 @@ export const OrderItem = {
       },
       required: true
     },
+    {
+      name: 'shipment',
+      label: 'Shipment',
+      type: 'object',
+      objectType: 'shipment',
+      showHyperlink: true,
+      required: true
+    },
     {
       name: 'itemType',
       label: 'Item Type',
       type: 'objectType',
-      masterFilter: ['part', 'packaging'],
+      masterFilter: ['part', 'packaging', 'filament'],
       required: true,
       columnWidth: 125
     },

src/database/models/PurchaseOrder.js

@@ -71,12 +71,24 @@ export const PurchaseOrder = {
       showHyperlink: true
     },
     {
-      name: 'cost',
-      label: 'Cost',
-      type: 'netGross',
+      name: 'totalAmount',
+      label: 'Total Amount',
+      type: 'number',
+      prefix: '£',
+      readOnly: true
+    },
+    {
+      name: 'totalAmountWithTax',
+      label: 'Total Amount w/ Tax',
+      type: 'number',
+      prefix: '£',
+      readOnly: true
+    },
+    {
+      name: 'totalTaxAmount',
+      label: 'Total Tax Amount',
+      type: 'number',
       prefix: '£',
-      min: 0,
-      step: 0.01,
       readOnly: true
     }
   ]

src/routes/DeveloperRoutes.jsx

@@ -1,7 +1,15 @@
+import { lazy } from 'react'
 import { Route } from 'react-router-dom'
-import SessionStorage from '../components/Dashboard/Developer/SessionStorage.jsx'
-import AuthContextDebug from '../components/Dashboard/Developer/AuthContextDebug.jsx'
-import ApiContextDebug from '../components/Dashboard/Developer/ApiContextDebug.jsx'
+
+const SessionStorage = lazy(
+  () => import('../components/Dashboard/Developer/SessionStorage.jsx')
+)
+const AuthContextDebug = lazy(
+  () => import('../components/Dashboard/Developer/AuthContextDebug.jsx')
+)
+const ApiContextDebug = lazy(
+  () => import('../components/Dashboard/Developer/ApiContextDebug.jsx')
+)
 
 const DeveloperRoutes = [
   <Route

src/routes/InventoryRoutes.jsx

@@ -1,19 +1,51 @@
+import { lazy } from 'react'
 import { Route } from 'react-router-dom'
 
-import FilamentStocks from '../components/Dashboard/Inventory/FilamentStocks.jsx'
-import FilamentStockInfo from '../components/Dashboard/Inventory/FilamentStocks/FilamentStockInfo.jsx'
-import PartStocks from '../components/Dashboard/Inventory/PartStocks.jsx'
-import PartStockInfo from '../components/Dashboard/Inventory/PartStocks/PartStockInfo.jsx'
-import StockEvents from '../components/Dashboard/Inventory/StockEvents.jsx'
-import StockAudits from '../components/Dashboard/Inventory/StockAudits.jsx'
-import StockAuditInfo from '../components/Dashboard/Inventory/StockAudits/StockAuditInfo.jsx'
-import PurchaseOrders from '../components/Dashboard/Inventory/PurchaseOrders.jsx'
-import PurchaseOrderInfo from '../components/Dashboard/Inventory/PurchaseOrders/PurchaseOrderInfo.jsx'
-import OrderItems from '../components/Dashboard/Inventory/OrderItems.jsx'
-import OrderItemInfo from '../components/Dashboard/Inventory/OrderItems/OrderItemInfo.jsx'
-import Shipments from '../components/Dashboard/Inventory/Shipments.jsx'
-import ShipmentInfo from '../components/Dashboard/Inventory/Shipments/ShipmentInfo.jsx'
-import InventoryOverview from '../components/Dashboard/Inventory/InventoryOverview.jsx'
+const FilamentStocks = lazy(
+  () => import('../components/Dashboard/Inventory/FilamentStocks.jsx')
+)
+const FilamentStockInfo = lazy(
+  () =>
+    import('../components/Dashboard/Inventory/FilamentStocks/FilamentStockInfo.jsx')
+)
+const PartStocks = lazy(
+  () => import('../components/Dashboard/Inventory/PartStocks.jsx')
+)
+const PartStockInfo = lazy(
+  () => import('../components/Dashboard/Inventory/PartStocks/PartStockInfo.jsx')
+)
+const StockEvents = lazy(
+  () => import('../components/Dashboard/Inventory/StockEvents.jsx')
+)
+const StockAudits = lazy(
+  () => import('../components/Dashboard/Inventory/StockAudits.jsx')
+)
+const StockAuditInfo = lazy(
+  () =>
+    import('../components/Dashboard/Inventory/StockAudits/StockAuditInfo.jsx')
+)
+const PurchaseOrders = lazy(
+  () => import('../components/Dashboard/Inventory/PurchaseOrders.jsx')
+)
+const PurchaseOrderInfo = lazy(
+  () =>
+    import('../components/Dashboard/Inventory/PurchaseOrders/PurchaseOrderInfo.jsx')
+)
+const OrderItems = lazy(
+  () => import('../components/Dashboard/Inventory/OrderItems.jsx')
+)
+const OrderItemInfo = lazy(
+  () => import('../components/Dashboard/Inventory/OrderItems/OrderItemInfo.jsx')
+)
+const Shipments = lazy(
+  () => import('../components/Dashboard/Inventory/Shipments.jsx')
+)
+const ShipmentInfo = lazy(
+  () => import('../components/Dashboard/Inventory/Shipments/ShipmentInfo.jsx')
+)
+const InventoryOverview = lazy(
+  () => import('../components/Dashboard/Inventory/InventoryOverview.jsx')
+)
 
 const InventoryRoutes = [
   <Route

src/routes/ManagementRoutes.jsx

@@ -1,42 +1,43 @@
+import { lazy } from 'react'
 import { Route } from 'react-router-dom'
 
-import Filaments from '../components/Dashboard/Management/Filaments'
-import FilamentInfo from '../components/Dashboard/Management/Filaments/FilamentInfo.jsx'
-import Parts from '../components/Dashboard/Management/Parts.jsx'
-import PartInfo from '../components/Dashboard/Management/Parts/PartInfo.jsx'
-import Products from '../components/Dashboard/Management/Products.jsx'
-import ProductInfo from '../components/Dashboard/Management/Products/ProductInfo.jsx'
-import Vendors from '../components/Dashboard/Management/Vendors'
-import VendorInfo from '../components/Dashboard/Management/Vendors/VendorInfo'
-import Materials from '../components/Dashboard/Management/Materials'
-import Couriers from '../components/Dashboard/Management/Couriers'
-import CourierInfo from '../components/Dashboard/Management/Couriers/CourierInfo.jsx'
-import CourierServices from '../components/Dashboard/Management/CourierServices'
-import CourierServiceInfo from '../components/Dashboard/Management/CourierServices/CourierServiceInfo.jsx'
-import Settings from '../components/Dashboard/Management/Settings'
-import AuditLogs from '../components/Dashboard/Management/AuditLogs.jsx'
-import NoteTypes from '../components/Dashboard/Management/NoteTypes.jsx'
-import NoteTypeInfo from '../components/Dashboard/Management/NoteTypes/NoteTypeInfo.jsx'
-import NoteInfo from '../components/Dashboard/Management/Notes/NoteInfo.jsx'
-import Users from '../components/Dashboard/Management/Users.jsx'
-import UserInfo from '../components/Dashboard/Management/Users/UserInfo.jsx'
-import Hosts from '../components/Dashboard/Management/Hosts.jsx'
-import HostInfo from '../components/Dashboard/Management/Hosts/HostInfo.jsx'
-import DocumentSizes from '../components/Dashboard/Management/DocumentSizes.jsx'
-import DocumentSizeInfo from '../components/Dashboard/Management/DocumentSizes/DocumentSizeInfo.jsx'
-import DocumentTemplates from '../components/Dashboard/Management/DocumentTemplates.jsx'
-import DocumentTemplateInfo from '../components/Dashboard/Management/DocumentTemplates/DocumentTemplateInfo.jsx'
-import DocumentPrinters from '../components/Dashboard/Management/DocumentPrinters.jsx'
-import DocumentPrinterInfo from '../components/Dashboard/Management/DocumentPrinters/DocumentPrinterInfo.jsx'
-import DocumentJobs from '../components/Dashboard/Management/DocumentJobs.jsx'
-import DocumentJobInfo from '../components/Dashboard/Management/DocumentJobs/DocumentJobInfo.jsx'
-import DocumentTemplateDesign from '../components/Dashboard/Management/DocumentTemplates/DocumentTemplateDesign.jsx'
-import Files from '../components/Dashboard/Management/Files.jsx'
-import FileInfo from '../components/Dashboard/Management/Files/FileInfo.jsx'
-import TaxRates from '../components/Dashboard/Management/TaxRates.jsx'
-import TaxRateInfo from '../components/Dashboard/Management/TaxRates/TaxRateInfo.jsx'
-import TaxRecords from '../components/Dashboard/Management/TaxRecords.jsx'
-import TaxRecordInfo from '../components/Dashboard/Management/TaxRecords/TaxRecordInfo.jsx'
+const Filaments = lazy(() => import('../components/Dashboard/Management/Filaments'))
+const FilamentInfo = lazy(() => import('../components/Dashboard/Management/Filaments/FilamentInfo.jsx'))
+const Parts = lazy(() => import('../components/Dashboard/Management/Parts.jsx'))
+const PartInfo = lazy(() => import('../components/Dashboard/Management/Parts/PartInfo.jsx'))
+const Products = lazy(() => import('../components/Dashboard/Management/Products.jsx'))
+const ProductInfo = lazy(() => import('../components/Dashboard/Management/Products/ProductInfo.jsx'))
+const Vendors = lazy(() => import('../components/Dashboard/Management/Vendors'))
+const VendorInfo = lazy(() => import('../components/Dashboard/Management/Vendors/VendorInfo'))
+const Materials = lazy(() => import('../components/Dashboard/Management/Materials'))
+const Couriers = lazy(() => import('../components/Dashboard/Management/Couriers'))
+const CourierInfo = lazy(() => import('../components/Dashboard/Management/Couriers/CourierInfo.jsx'))
+const CourierServices = lazy(() => import('../components/Dashboard/Management/CourierServices'))
+const CourierServiceInfo = lazy(() => import('../components/Dashboard/Management/CourierServices/CourierServiceInfo.jsx'))
+const Settings = lazy(() => import('../components/Dashboard/Management/Settings'))
+const AuditLogs = lazy(() => import('../components/Dashboard/Management/AuditLogs.jsx'))
+const NoteTypes = lazy(() => import('../components/Dashboard/Management/NoteTypes.jsx'))
+const NoteTypeInfo = lazy(() => import('../components/Dashboard/Management/NoteTypes/NoteTypeInfo.jsx'))
+const NoteInfo = lazy(() => import('../components/Dashboard/Management/Notes/NoteInfo.jsx'))
+const Users = lazy(() => import('../components/Dashboard/Management/Users.jsx'))
+const UserInfo = lazy(() => import('../components/Dashboard/Management/Users/UserInfo.jsx'))
+const Hosts = lazy(() => import('../components/Dashboard/Management/Hosts.jsx'))
+const HostInfo = lazy(() => import('../components/Dashboard/Management/Hosts/HostInfo.jsx'))
+const DocumentSizes = lazy(() => import('../components/Dashboard/Management/DocumentSizes.jsx'))
+const DocumentSizeInfo = lazy(() => import('../components/Dashboard/Management/DocumentSizes/DocumentSizeInfo.jsx'))
+const DocumentTemplates = lazy(() => import('../components/Dashboard/Management/DocumentTemplates.jsx'))
+const DocumentTemplateInfo = lazy(() => import('../components/Dashboard/Management/DocumentTemplates/DocumentTemplateInfo.jsx'))
+const DocumentPrinters = lazy(() => import('../components/Dashboard/Management/DocumentPrinters.jsx'))
+const DocumentPrinterInfo = lazy(() => import('../components/Dashboard/Management/DocumentPrinters/DocumentPrinterInfo.jsx'))
+const DocumentJobs = lazy(() => import('../components/Dashboard/Management/DocumentJobs.jsx'))
+const DocumentJobInfo = lazy(() => import('../components/Dashboard/Management/DocumentJobs/DocumentJobInfo.jsx'))
+const DocumentTemplateDesign = lazy(() => import('../components/Dashboard/Management/DocumentTemplates/DocumentTemplateDesign.jsx'))
+const Files = lazy(() => import('../components/Dashboard/Management/Files.jsx'))
+const FileInfo = lazy(() => import('../components/Dashboard/Management/Files/FileInfo.jsx'))
+const TaxRates = lazy(() => import('../components/Dashboard/Management/TaxRates.jsx'))
+const TaxRateInfo = lazy(() => import('../components/Dashboard/Management/TaxRates/TaxRateInfo.jsx'))
+const TaxRecords = lazy(() => import('../components/Dashboard/Management/TaxRecords.jsx'))
+const TaxRecordInfo = lazy(() => import('../components/Dashboard/Management/TaxRecords/TaxRecordInfo.jsx'))
 
 const ManagementRoutes = [
   <Route key='filaments' path='management/filaments' element={<Filaments />} />,

src/routes/ProductionRoutes.jsx

@@ -1,15 +1,35 @@
+import { lazy } from 'react'
 import { Route } from 'react-router-dom'
 
-import ProductionOverview from '../components/Dashboard/Production/ProductionOverview'
-import Printers from '../components/Dashboard/Production/Printers'
-import ControlPrinter from '../components/Dashboard/Production/Printers/ControlPrinter.jsx'
-import PrinterInfo from '../components/Dashboard/Production/Printers/PrinterInfo.jsx'
-import Jobs from '../components/Dashboard/Production/Jobs.jsx'
-import JobInfo from '../components/Dashboard/Production/Jobs/JobInfo.jsx'
-import SubJobs from '../components/Dashboard/Production/SubJobs.jsx'
-import SubJobInfo from '../components/Dashboard/Production/SubJobs/SubJobInfo.jsx'
-import GCodeFiles from '../components/Dashboard/Production/GCodeFiles'
-import GCodeFileInfo from '../components/Dashboard/Production/GCodeFiles/GCodeFileInfo.jsx'
+const ProductionOverview = lazy(
+  () => import('../components/Dashboard/Production/ProductionOverview')
+)
+const Printers = lazy(
+  () => import('../components/Dashboard/Production/Printers')
+)
+const ControlPrinter = lazy(
+  () => import('../components/Dashboard/Production/Printers/ControlPrinter.jsx')
+)
+const PrinterInfo = lazy(
+  () => import('../components/Dashboard/Production/Printers/PrinterInfo.jsx')
+)
+const Jobs = lazy(() => import('../components/Dashboard/Production/Jobs.jsx'))
+const JobInfo = lazy(
+  () => import('../components/Dashboard/Production/Jobs/JobInfo.jsx')
+)
+const SubJobs = lazy(
+  () => import('../components/Dashboard/Production/SubJobs.jsx')
+)
+const SubJobInfo = lazy(
+  () => import('../components/Dashboard/Production/SubJobs/SubJobInfo.jsx')
+)
+const GCodeFiles = lazy(
+  () => import('../components/Dashboard/Production/GCodeFiles')
+)
+const GCodeFileInfo = lazy(
+  () =>
+    import('../components/Dashboard/Production/GCodeFiles/GCodeFileInfo.jsx')
+)
 
 const ProductionRoutes = [
   <Route

vite.config.js

@@ -8,7 +8,20 @@ export default defineConfig({
   base: './',
   plugins: [react(), svgo(), svgr(), eslintPlugin()],
   build: {
-    outDir: 'build'
+    outDir: 'build',
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          antd: ['antd'],
+          codemirror: [
+            '@codemirror/lang-javascript',
+            '@codemirror/lang-python' /* etc */
+          ],
+          three: ['three', 'gcode-preview'],
+          'react-vendor': ['react', 'react-dom', 'react-router-dom']
+        }
+      }
+    }
   },
   server: {
     allowedHosts: ['dev.tombutcher.work'],

wrangler.jsonc

@@ -0,0 +1,4 @@
+{
+  "name": "farmcontrol-ui",
+  "pages_build_output_dir": "./build"
+}