F query form

Summary

• Added QueryForm component as per caosdb/customers/leibniz-zmt/management#191
• Added linting (npm run lint)
• Added testing (npm test -- --coverage)
• Styling has been done with npx prettier -w src/
• New implementation of Await component (needed by the map, I only moved it here)

See caosdb-webui!96 (merged) and https://gitlab.indiscale.com/caosdb/src/caosdb-webui-legacy-adapter/-/tree/main

Focus

• Many changes due to auto-formatting with npx prettier -w src/. Can be ignored.
• Important changes in QueryForm.jsx and QueryForm.helpers.js

Known Issues:

• reference filter are not fully supported yet (you can trick the current implementation by using datatype "text" for a reference property).
• back-references are not supported
• datetime has a simple text field. maybe that should be smarter in the future
• form validation does not work (so you could put anything into the filter inputs)

Test Environment

• Mock up: npm run mock go to either http://localhost:[port]/ or http://localhost:[port]/page.html to see a mock up.
• 1. Pack with npm pack.
  2. Then install this packge into the legacy adapter.
  3. Then npm run build to build the legacy adapter.
  4. Create a conf/ext/json/query-form-tabs.json, see example below which works for the demo profile
  5. Set build property BUILD_MODULE_LEGACY_QUERY_FORM=DISABLED.
  6. Copy the query-form.bundle.js into your webinterface (src/ext/js/) (and make it if necessary)

Example Tabs config. No config means not tabs.

[
  {
    "id": "manufacturer",
    "recordType": "Manufacturer",
    "label": "Manufacturer",
    "description": "Show matching manufacturers",
    "filterDefinitions": [
      {
        "property": "longitude",
        "min": -180.0,
        "max": 180.0,
        "unit": "°",
        "datatype": "double"
      }, {
        "property": "latitude",
        "min": -90.0,
        "max": 90.0,
        "unit": "°",
        "datatype": "double"
      }
    ]
  }, {
    "id": "musicalinstrument",
    "recordType": "MusicalInstrument",
    "label": "Musical Instrument",
    "description": "Show only matching musical instruments",
    "filterDefinitions": [
      {
        "property": "price",
        "datatype": "double",
        "step": 0.01,
        "unit": "€",
        "min": 0.0
      }, {
        "property": "manufacturer",
        "datatype": "text"
      }, {
        "property": "electric",
        "datatype": "boolean"
      }
    ]
  }
]

Check List for the Author

Please, prepare your MR for a review. Be sure to write a summary and a focus and create gitlab comments for the reviewer. They should guide the reviewer through the changes, explain your changes and also point out open questions. For further good practices have a look at our review guidelines

• Reference related issues
• Up-to-date CHANGELOG.md (or not necessary)
• Annotations in code (Gitlab comments)
  • Intent of new code
  • Problems with old code
  • Why this implementation?

Check List for the Reviewer

• I understand the intent of this MR
• Up-to-date CHANGELOG.md (or not necessary)
• The test environment setup works and the intended behavior is reproducible in the test environment
• In-code documentation and comments are up-to-date.
• Check: Are there specifications? Are they satisfied?

For further good practices have a look at our review guidelines.