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

Add multi-filtering to tables; refactor details pages into tabs #63

Merged
merged 4 commits into from
Feb 26, 2024

Conversation

ohltyler
Copy link
Member

@ohltyler ohltyler commented Oct 23, 2023

Description

This PR achieves 4 main things:

  1. Adds a general & reusable MultiSelectFilter component that can be added to tables for filtering by subset of available options (e.g., workflow status).
  2. Enhance existing workflow list table with the added filter, + with a debouncing search bar
  3. Refactor the workflow details page into 3 main tabs- Editor, Launches, and Prototype, with the url path persisting the selected tab
  4. Implements a basic launches table with similar multi-select filtering and debounced searching capabilities. This is added under the Launches tab. Note I've added dummy data there for testing & demo purposes.

With the refactoring, this also does some minor styling & padding changes for consistency, and adds boilerplate pages for the unfinished Launches and Prototypes pages under their respective tabs

Demo video (table enhancements):

screen-capture.21.webm

Demo video (new workflow details tabs):

screen-capture.22.webm

Issues Resolved

Makes progress on #8, #13, #15

Check List

  • Commits are signed per the DCO using --signoff

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.
For more information on following Developer Certificate of Origin and signing off your commits, please check here.

@ohltyler ohltyler marked this pull request as draft October 23, 2023 22:10
@ohltyler ohltyler changed the title Add multi-filtering to tables; refactor details pages into tabs [WIP] Add multi-filtering to tables; refactor details pages into tabs Oct 23, 2023
@ohltyler ohltyler marked this pull request as ready for review October 23, 2023 23:21
return;
}
const newFilters = [...filters];
// @ts-ignore
Copy link
Member Author

Choose a reason for hiding this comment

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

TLDR of adding all of these ignores is due to IDE complaints that the type fields don't match. This is due to differences in EUI vs. OUI and their respective documentation. This follows the latest OUI documentation.

interface MultiSelectFilterProps {
title: string;
filters: EuiFilterSelectItem[];
setSelectedFilters: (filters: EuiFilterSelectItem[]) => void;
Copy link
Member Author

Choose a reason for hiding this comment

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

We have this setter as a prop since typically any filter changes will need to be propagated to the parent component(s).

@@ -11,6 +11,7 @@ import { saveWorkflow } from '../utils';
import { rfContext, AppState, removeDirty } from '../../../store';

interface WorkflowDetailHeaderProps {
tabs: any[];
Copy link
Member Author

Choose a reason for hiding this comment

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

Tab isn't exposed by EUI/OUI library so we set as any.

Signed-off-by: Tyler Ohlsen <[email protected]>
@ohltyler ohltyler changed the title [WIP] Add multi-filtering to tables; refactor details pages into tabs Add multi-filtering to tables; refactor details pages into tabs Oct 23, 2023
@ohltyler ohltyler self-assigned this Jan 26, 2024
Copy link
Member

@amitgalitz amitgalitz left a comment

Choose a reason for hiding this comment

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

Overall LGTM, maybe try to make sure we can still reproduce same video as in description with latest main OSD branch

@ohltyler ohltyler merged commit edcd453 into opensearch-project:main Feb 26, 2024
4 checks passed
opensearch-trigger-bot bot pushed a commit that referenced this pull request Feb 26, 2024
@ohltyler ohltyler deleted the add-tabs branch February 26, 2024 18:36
ohltyler added a commit that referenced this pull request Feb 26, 2024
…#83)

Signed-off-by: Tyler Ohlsen <[email protected]>
(cherry picked from commit edcd453)

Co-authored-by: Tyler Ohlsen <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants