cern-sis / react-formule

User-friendly, extensible form builder for React based on JSON Schema and RJSF
https://cern-sis.github.io/react-formule/
MIT License
7 stars 3 forks source link

Provide types for exposed components #41

Open miguelgrc opened 1 month ago

miguelgrc commented 1 month ago

Define types for the components exposed in index.ts for safety and better integration with linters.

Sky-De commented 1 month ago

@miguelgrc hi there, please assign this to me, i would like to fix this, thanks

miguelgrc commented 1 month ago

Thanks for your interest @Sky-De! I have assigned it to you. FYI, related to this, we are about to merge this PR where we are adding some types for the new code editor fields. Let me know if you have any question.

Sky-De commented 1 month ago

@miguelgrc Thanks for the assignment, to prevent any conflict and extra work to resolve those conflicts, I will wait till you merge all pending PRs then I will fork this repository and fix this issue, I will check it again, but I would be grateful if you inform me when you merged PR that you have mentioned in last comment, thanks, sky-de

miguelgrc commented 1 month ago

@Sky-De we've merged #43 :)

Sky-De commented 1 month ago

@miguelgrc thanks for informing me, I will start adding types to 1.PropertyEditor 2.SelectFieldType 3.SchemaPreview 4.FormPreview 5.SelectOrEdit components as clean as possible, but these days I'm a little busy, every day I will work on one of them, and after they are all done I will create PR

Sky-De commented 1 month ago

@miguelgrc Hey again, I need your help, if you don't mind. First of all, I encountered this warning which prevents the app from loading: Screenshot 2024-05-28 043158

then can you please clarify store/schrmaWizard types const initialState = { current: { schema: {}, uiSchema: {}, }, initial: { schema: {}, uiSchema: {}, }, initialConfig: {}, config: {}, field: {}, formData: {}, propKeyEditor: null, error: null, loader: false, version: null, };

you have used { } empty objects instead of the initial value inside those objects which makes it hard to understand what exactly those types should be

also const path = useSelector((state) => state.schemaWizard.field.path); schemaWizard is not part of state, what is that ? and last question does this app work?

miguelgrc commented 1 month ago

Hi @Sky-De, replying to your questions:

  1. Are you trying to run formule or formule-demo? You should run the latter for development, check its readme.

  2. That's actually part of the task, we need to restrict those types and for that we need to first figure out what those types should be. schema and uiSchema will be jsonschemas, whose initial value will be {} (although they're initialized by initSchemaStructure on new schema creation). initialConfig and config are fields we use in CAP to pass various configuration variables, they are something we might want to rethink eventually so for now just treat is as any arbitrary object. field can contain path and uiPath inside, which are arrays of strings. formData is a concept from RJSF (see here) and contains the values of the fields, so pretty hard to type, just assume it's an arbitrary object again. propKeyEditor and error are currently unused, you should simply delete them. version would be an optional string.

  3. That's the correct way to access the redux store. See the docs

  4. Yes, it works and it's being used in CAP, but as I said in 1. you need to run formule-demo, which is a simple app that imports the formule library. The library itself can't be run as it's just that, a library, and not a standalone app.