Adding filterbox to selections in topbar #77
Conversation
|
Deploy preview for catwalk ready! Built with commit d1f0964 |
src/components/field.jsx
Outdated
| {' '} | ||
| {fieldCounts(layout.qListObject.qDimensionInfo, fieldData)} | ||
| <div className="field"> | ||
| <div className="innerContainer"> |
There was a problem hiding this comment.
I think we're using kebab-case elsewhere for classes?
src/components/field.jsx
Outdated
| {fieldCounts(layout.qListObject.qDimensionInfo, fieldData)} | ||
| </div> | ||
| </div> | ||
| {onCancelSelection !== null |
There was a problem hiding this comment.
I'd prefer if we keep logic outside of the templates, could we have this set in a variable and use the variable here instead?
src/components/field.jsx
Outdated
| export function FieldWithoutState({ | ||
| field, fieldData, layout, showFilterbox, model, | ||
| export default function Field({ | ||
| layout, field, fieldData, onCancelSelection, |
There was a problem hiding this comment.
onCancelSelection seems a bit out of place here since it really belongs to the filterbox?
src/components/filterbox.jsx
Outdated
| import VirtualTable from './virtual-table'; | ||
|
|
||
| import './filterbox.pcss'; | ||
| import './field.pcss'; |
There was a problem hiding this comment.
Why is filterbox pulling in field styles?
src/components/filterbox.jsx
Outdated
| @@ -151,21 +153,20 @@ function useSearch(model, selfRef, inputRef) { | |||
| return { onSearch }; | |||
| } | |||
|
|
|||
| export default function Filterbox({ model, layout }) { | |||
| export default function Filterbox({ model, layout, showFilterbox }) { | |||
There was a problem hiding this comment.
Why does the filterbox take a showFilterbox arg? Shouldn't this be controlled in the parent container and never render a filterbox then?
src/components/selection-field.jsx
Outdated
| import Filterbox from './filterbox'; | ||
| import useModel from './use/model'; | ||
| import useLayout from './use/layout'; | ||
| import './table-field.pcss'; |
src/components/selection-field.jsx
Outdated
| import './selection-field.pcss'; | ||
|
|
||
| function SelectionFieldWithoutState({ | ||
| model, layout, field, fieldData, onCancelSelection, |
There was a problem hiding this comment.
Same here, would be nice to avoid onCancelSelection
src/components/selection-field.jsx
Outdated
| return ( | ||
| <div className="popover-wrapper"> | ||
| <div | ||
| className="selectionfield" |
src/components/table-field.pcss
Outdated
| @@ -0,0 +1,51 @@ | |||
| .tablefield { | |||
Refactoring Field and Filterbox to use in TableField and SelectionField components. Adding clear selection of single field.
Closes #54
Closes #68