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

Highlight matching cells in temporal cell types within the Record Selector #1889

Open
seancolsen opened this issue Nov 3, 2022 · 2 comments
Assignees
Labels
ready Ready for implementation type: enhancement New feature or request work: frontend Related to frontend code in the mathesar_ui directory
Milestone

Comments

@seancolsen
Copy link
Contributor

seancolsen commented Nov 3, 2022

Current behavior

  • In the Record Selector, searching for a record via text columns show results that highlight the cells which match and don't match the search query.

  • Columns of type "Date", "Date & Time", "Time", and "Duration" do not highlight the matching values like this.

  • Notice how in the image below we have a search term 04/15/2025 which matches
    the cell in the first row, but that matching cell is not colored yellow like the other matches

    image

Desired behavior

  • The temporal column types highlight the matches and non-matches.
  • They should not highlight any sub-string matches (as the text columns will).
  • The highlighting should be done by comparing the canonical values so that if the user enters a date like "7/3/2020", then a cell that displays a date of "07/03/2020" will be highlighted to match (even though its format differs from the format in the search query).

Implementation

  • We should probably make changes in DateTimeCell.svelte.
  • Notice how TextBoxCell.svelte accepts a searchValue prop? We should add that prop to DateTimeCell as well. (The searchValue prop is already passed to DateTimeCell via CellFabric.svelte.)
  • Then DateTimeCell should use dayjs to attempt to format the search value to match the canonical value returned from the API. In the screenshot above, the API value is "2025-04-15 AD". We need to format dates, date-times, times, and durations to match those API formats. We may need to consider timezones in some cases too.
@seancolsen seancolsen added ready Ready for implementation type: enhancement New feature or request work: frontend Related to frontend code in the mathesar_ui directory labels Nov 3, 2022
@seancolsen seancolsen added this to the 2023 or later milestone Nov 3, 2022
@seancolsen seancolsen mentioned this issue Jan 5, 2023
7 tasks
@github-actions
Copy link

This issue has not been updated in 90 days and is being marked as stale.

@dikwickley
Copy link

This issue is still present. I will be working on it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
ready Ready for implementation type: enhancement New feature or request work: frontend Related to frontend code in the mathesar_ui directory
Projects
No open projects
Development

Successfully merging a pull request may close this issue.

3 participants