Adding a price widget

gui/app/package-lock.json

@@ -26,6 +26,7 @@
         "@rjsf/validator-ajv8": "^5.24.1",
         "react": "^18.0.0",
         "react-dom": "^18.0.0",
+        "react-number-format": "^5.4.3",
         "react-router": "^7.0.2"
       },
       "devDependencies": {
@@ -7070,6 +7071,16 @@
       "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
       "license": "MIT"
     },
+    "node_modules/react-number-format": {
+      "version": "5.4.3",
+      "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.3.tgz",
+      "integrity": "sha512-VCY5hFg/soBighAoGcdE+GagkJq0230qN6jcS5sp8wQX1qy1fYN/RX7/BXkrs0oyzzwqR8/+eSUrqXbGeywdUQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
     "node_modules/react-reconciler": {
       "version": "0.29.2",
       "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.29.2.tgz",

gui/app/package.json

@@ -40,6 +40,7 @@
     "@rjsf/validator-ajv8": "^5.24.1",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
+    "react-number-format": "^5.4.3",
     "react-router": "^7.0.2"
   },
   "devDependencies": {

gui/app/src/common/crud/widgets/bgfc-price.tsx

@@ -0,0 +1,33 @@
+import { WidgetProps } from "@rjsf/utils";
+import { NumericFormat } from "react-number-format";
+import TextField from "@mui/material/TextField";
+import {InputAdornment} from "@mui/material";
+
+export const BgfcPriceWidget = (props: WidgetProps) => {
+  const { inputRef, onChange, ...other } = props;
+
+  return (
+    <NumericFormat
+      customInput={TextField}
+      getInputRef={inputRef}
+      onValueChange={values => {
+        onChange({
+          target: {
+            name: props.name,
+            value: values.value
+          }
+        });
+      }}
+      slotProps={{
+            input: {
+              startAdornment: <InputAdornment position="end">$</InputAdornment>,
+              endAdornment: <InputAdornment position="start">€</InputAdornment>
+            },
+          }}
+      valueIsNumericString={true}
+      fixedDecimalScale={true}
+      decimalScale={2}
+      defaultValue={0}
+    />
+  );
+}

gui/app/src/common/crud/widgets/crud-text-widget.tsx

@@ -2,13 +2,16 @@ import TextWidget from "@rjsf/core/lib/components/widgets/TextWidget";
 import { FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps } from "@rjsf/utils";
 
 import { ForeignKeyWidget } from "./foreign-key";
+import {BgfcPriceWidget} from "./bgfc-price";
 
 export default function CrudTextWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
   props: WidgetProps<T, S, F>
 ) {
   if (props.schema.hasOwnProperty("foreign_key")) {
     return (<ForeignKeyWidget {...props} />);
-  }else {
+  } else if (props.schema.hasOwnProperty("format") && props.schema.format == "price-bgdc") {
+    return (<BgfcPriceWidget {...props} />);
+  } else {
     return (<TextWidget {...props} />);
   }
 }