Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

YDA-5059: add hierarchical keyword selector #380

Merged
merged 17 commits into from
Jan 31, 2025

Conversation

claravox
Copy link
Contributor

@claravox claravox commented Dec 11, 2024

Of the UI tests, I have run this against the ui_meta tests (including the new one I added) and it passes those.

Main changes:

  • New TreeKeyword selector using antd (react)
  • TreeKeyword selector supports both keywords specified in a tree structure and free-form keywords
  • Move common theming code up to index.js for less duplicated code
  • Move common metadata form fields to a shared directory for less manual copying of changes
  • Create new webpack, package.json configuration for more custom building commands

This was tested on a Yoda before the update to irods 4.3.3 etc.

@@ -0,0 +1,237 @@
import React from 'react'
import axios from 'axios'
import { TreeSelect, ConfigProvider, theme } from 'antd'
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I find TreeSelect from antd is really nice for the keyword selector, but I am a little bit concerned about how much bigger it makes the final js file (goes from about 800kb to 1.2 mb). This also makes the metadata form load a little slower. Not sure if there is some tree shaking I can do.

@claravox claravox changed the title Development keyword selector YDA-5059: add hierarchical keyword selector Dec 11, 2024
@claravox claravox marked this pull request as ready for review December 11, 2024 15:31
@claravox claravox marked this pull request as draft December 16, 2024 08:13
@claravox claravox marked this pull request as ready for review December 16, 2024 15:28
@lwesterhof lwesterhof self-requested a review January 30, 2025 13:23
@claravox
Copy link
Contributor Author

In the end I kept the dark theme on the TreeKeywordSelector the same dark and white theme across all themes (uu, vu, wur) to keep it consistent with the theming we already have on react-select fields in dark mode.

Copy link
Member

@lwesterhof lwesterhof left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@lwesterhof lwesterhof force-pushed the development-keyword-selector branch from e533449 to 47dc493 Compare January 31, 2025 12:50
@lwesterhof lwesterhof merged commit 2227f7c into development Jan 31, 2025
10 checks passed
@lwesterhof lwesterhof deleted the development-keyword-selector branch January 31, 2025 13:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants