-
Notifications
You must be signed in to change notification settings - Fork 4
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
docs: complex table filters example #489
Conversation
|
@@ -38,7 +38,7 @@ const preview: Preview = { | |||
], | |||
'Candidate Components', | |||
'UX Patterns', | |||
['Table', ['Table', 'Filters']], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This sorting is not working when taking stories into consideration. Need to dig deeper to understand why.
} from 'src/components' | ||
import { DatePickerWithDisabledYears } from 'src/components/data-entry/DatePicker/DatePicker.stories' | ||
import { SelectWithRangePicker } from 'docs/Candidate Components/Directory/Date Range Filter/SelectWithRangePicker' | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Extracted everything table related that would be re-used into TableStoryUtils.tsx
|
||
const preview: Preview = { | ||
parameters: { | ||
layout: 'centered', | ||
options: { | ||
// TODO https://mparticle-eng.atlassian.net/browse/UNI-1214 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Tried implementing this on this PR but it's more complex than I was expecting, to pulled it out.
@@ -0,0 +1,201 @@ | |||
import type { ReactNode } from 'react' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Essencially pulled from Observability example, but kept everything in a single file and simplified a lot of it. No logic included, only UI.
@@ -1,5 +1,5 @@ | |||
import { Collapse as AntCollapse } from 'antd' | |||
import { type CollapseProps as AntCollapseProps } from 'antd' | |||
import type { CollapseProps as AntCollapseProps } from 'antd' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
suggested by eslint
🎉 This PR is included in version 1.35.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
Summary
Documentation work and a change to an ESLint rule.
This PR brings the Observability complex filters implementation in a simplified version as to showcase an example of complex table filters to be used in the library.
New structure:
Testing Plan
Reference Issue (For mParticle employees only. Ignore if you are an outside contributor)