Error when adding new product

[Evaldash]

Hi, I seem to have encountered a few issues, namely when I add a new product I get this error:

Here's my schema, I've tried it with even just a few fields, I still get the same error when adding the product (even though the product gets added successfully...)

export const DBproductSchema = buildSchema<DBProduct>({
    name: "Product",
    properties: {
        imageUrl: imageUrlDisplay,

        name: {
            title: "Name",
            validation: { required: true },
            dataType: "string"
        },

        searchableName:{
            title: "Searchable name",
            validation: {required: true},
            dataType: "string"
        },

        typicalShelfLife:{
            title: "Typical shelf life",
            validation: { required: true },
            dataType: "string"
        },

        typicallyStoredIn: {
            title: "Typically stored in",
            validation: { required: true },
            dataType: "string",

            config: {
                enumValues: {
                    "Šaldytuve": "Šaldytuve",
                    "Šaldiklyje": "Šaldiklyje",
                    "Lentynoje": "Lentynoje",
                    "Rūsyje": "Rūsyje"
                }
            }
        },

        drinkable:{
            title: "Drinkable",
            validation: {required: false},
            dataType: "boolean"
        },
        weighable:{
            title: "Weighable",
            validation: {required: false},
            dataType: "boolean"
        },
        countable:{
            title: "Countable",
            validation: {required: false},
            dataType: "boolean"
        },
        cantExpire:{
            title: "Can't expire",
            validation: {required: false},
            dataType: "boolean"
        },

        category: {
            title: "Category",
            validation: { required: true },
            dataType: "string",
            config:{
                enumValues: {
                    "-": "-",
                    "Pieno produktai": "Pieno produktai",
                    "Vaisiai": "Vaisiai",
                    "Daržovės": "Daržovės",
                    "Prieskoniai": "Prieskoniai",
                }
            }
        },
    },
});

What am i doing wrong?

[Evaldash]

For some reason it thinks it's an existing product, when I'm adding a new one?..

[Evaldash]

I managed to figure it out. It seems to be an incompatibility with react 18, since when I switch

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

to

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

no errors are thrown...

[fgatti675]

That's interesting, I'll try reproducing your error and let you know

[Adkaros]

I'm able to reproduce the same exact issue, using react 18.1.0.

Seems to happen with the demo code included in quickstart

[fgatti675]

Hi guys, we will be working on making FireCMS 1.0 compatible with React 18. In the meantime, I could make it work reverting to previous dependencies:

package.json:

{
  "name": "my-cms",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@camberi/firecms": "^1.0.0",
    "@emotion/react": "^11.7.1",
    "@emotion/styled": "^11.6.0",
    "@mui/icons-material": "^5",
    "@mui/lab": "^5.0.0-alpha.68",
    "@mui/material": "^5",
    "@mui/styles": "^5",
    "@types/jest": "^27.0.1",
    "@types/node": "^16.7.13",
    "@types/react": "^17.0.20",
    "@types/react-dom": "^17.0.9",
    "firebase": "^9",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router": "^6",
    "react-router-dom": "^6",
    "react-scripts": "5.0.0",
    "typescript": "^4.4.2",
    "web-vitals": "^2.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

and index.tsx:

import React from 'react';
import ReactDOM from "react-dom";

import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

ReactDOM.render(
    <App/>,
    document.getElementById("root")
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

[fgatti675]

Hi can you try with version 1.0.2? It should work fine with React 18 and the default app by CRA