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

feature: Layered Navigation (Filters) #797

Merged
merged 134 commits into from
Jun 3, 2019
Merged
Changes from 1 commit
Commits
Show all changes
134 commits
Select commit Hold shift + click to select a range
9d16fb3
Create components for filter button in category page header, filter m…
AlexeyKaryka Dec 20, 2018
2789247
Merge & Update
Jan 21, 2019
3bd1548
Adjusted Category components for filters and replaced placeholder fil…
Jan 21, 2019
c6fc7af
Adjusting Icon components to optimized syntax
Jan 21, 2019
8185ced
Filter component improvements, Added swatch and default renderer, imp…
Jan 22, 2019
116890a
Filter render components and styles
Jan 22, 2019
0227917
Design adjustments
Jan 23, 2019
507430a
Filters adjustments
Jan 23, 2019
0443d60
Current filters
Jan 23, 2019
ea32f32
Filter lists & block adjustment - improving state management
Jan 23, 2019
cf6f4da
Style adjustments
Jan 23, 2019
b715208
Attempting to fix re-render issue
Jan 24, 2019
56fb22c
Removing state and using props again, partial fix
Jan 24, 2019
31927b4
Current filters adjustment, code cleanup
Jan 24, 2019
0c1f981
Code cleanup and swatch styles adjustments
Jan 24, 2019
7459cd4
Merge branch 'temp/layered-nav-fix' into feature/layered-navigation
Jan 24, 2019
1841af1
Component styles, code cleanup
Jan 24, 2019
f6c9f9a
Swatch adjustment
Jan 24, 2019
f5a7002
Code cleanup
Jan 24, 2019
ad39d5c
Code cleanup, code splitting, URL functionality
Jan 25, 2019
1819a91
URL clear feature
Jan 25, 2019
663274c
Get Filter params from URL
Jan 25, 2019
6b7d7eb
Filters URL query
Jan 28, 2019
0a3c6cd
Cleanup
Jan 28, 2019
1b32eca
Cleanup console logs
Jan 28, 2019
6ea2274
Drawer adjustment & styles update
Jan 28, 2019
f56578d
Update to newest release
Jan 30, 2019
a5d0760
Merge branch 'feature/yarn-upgrade' into feature/layered-navigation
Jan 30, 2019
b138454
Code cleanup & fixing pagination functions
Jan 30, 2019
b352057
PropTypes work in progress
Jan 30, 2019
fef24a6
Adding PropTypes
Jan 30, 2019
cd2adad
Filter Search update
Jan 31, 2019
ca879ac
PropTypes update
Jan 31, 2019
58d51e0
Merge branch 'release/2.0' into feature/layered-navigation
codeAdrian Jan 31, 2019
2d4157b
Merge branch 'release/2.0' of https://github.com/magento-research/pwa…
Jan 31, 2019
4be992e
Merge branch 'feature/layered-navigation' of github.com:codeAdrian/pw…
Jan 31, 2019
bcc416a
Fixed uppercase component name
Jan 31, 2019
744e3b5
Fixed uppercase component name
Jan 31, 2019
9da2ecd
Component uppercase name fix
Jan 31, 2019
d448e46
Revert filter changes
Jan 31, 2019
97996ca
Update failing test
Jan 31, 2019
e1ce65b
Merge with latest release, fix conflicts
Feb 28, 2019
0c42774
Fix test for PurchaseHistory page filter
Feb 28, 2019
fc4b72a
Improving graphql query & code cleanup
Mar 4, 2019
99e1b88
Code cleanup & Fix static typing
Mar 4, 2019
ec04f3c
Fix failing test
Mar 4, 2019
482fc8e
Merge branch 'develop' into feature/layered-navigation
supernova-at Mar 6, 2019
8c1fb94
Fix z-index
Mar 7, 2019
942eecf
Merge with develop and fix conflicts
Mar 7, 2019
e277144
Merge branch 'feature/layered-navigation' of github.com:codeAdrian/pw…
Mar 7, 2019
5742255
Merge branch 'develop' into feature/layered-navigation
codeAdrian Mar 7, 2019
9426a50
Merge branch 'develop' into feature/layered-navigation
codeAdrian Mar 13, 2019
7516fbe
Add required props to small_image in category gql
sirugh Mar 21, 2019
153f68b
Merge branch 'develop' into feature/layered-navigation
sirugh Mar 21, 2019
f55e52d
Merge branch 'develop' into feature/layered-navigation
sirugh Mar 22, 2019
f66e083
Merge branch 'develop' into feature/layered-navigation
codeAdrian Mar 26, 2019
f1ff6f6
Improved URL generation on filter clear, added extra actions, code cl…
Mar 26, 2019
4cc4415
CSS Fix
Mar 26, 2019
8b73800
CSS z-index fix
Mar 26, 2019
dd37636
Fix layered navigation bug
Mar 27, 2019
123655a
Merge branch 'develop' into feature/layered-navigation
codeAdrian Mar 27, 2019
fef6c31
Merge branch 'develop' into feature/layered-navigation
codeAdrian Mar 28, 2019
3f98d38
Remove prevPageTotal
Mar 28, 2019
895fbfd
CSS cleanup
Mar 28, 2019
61d03a2
Rename filter props
Mar 28, 2019
a034291
Removed generateColor constant
Mar 28, 2019
ca81667
Remove unused option
Mar 28, 2019
f7ab947
Filter redux store init with URL instead of component mount
Mar 28, 2019
e8ab64f
Replace getDerivedStateFromProps with connected catalog store in redux
Mar 28, 2019
468509a
Replace duplicate filterOption.add and filterOption.remove with filte…
Mar 28, 2019
438b6f7
Merge branch 'develop' into feature/layered-navigation
codeAdrian Mar 29, 2019
1174a66
Revert commit
Mar 29, 2019
f000b0e
Remove unused reducer, connect filterModal to redux
Mar 29, 2019
7df6d8d
Added conditional rendering to filter button
Mar 29, 2019
5c43965
Clean up modal controls on filter modal
Mar 29, 2019
19cd3da
Replaced var with const in iterator
Mar 29, 2019
82c3500
Rename add and remove filter functions
Mar 29, 2019
6922ad0
Replace filter swatch with default swatch component
Mar 29, 2019
47e8aee
filterSearch improvements
Mar 29, 2019
76af05c
Fix filter modal css - replace value with var
Mar 29, 2019
eb2d531
Merge branch 'develop' into feature/layered-navigation
codeAdrian Apr 1, 2019
b6aa5a5
Split categoryContent component into container and component, fix bro…
Apr 1, 2019
571fd1b
Merge branch 'develop' into feature/layered-navigation
codeAdrian Apr 2, 2019
920a2bb
Merge branch 'develop' into feature/layered-navigation
codeAdrian Apr 8, 2019
efa17bb
Fix eslint errors
Apr 15, 2019
7298060
Merge branch 'develop' into feature/layered-navigation
codeAdrian Apr 18, 2019
1a85088
Strip HTML from filter label and remove dangerouslySetInnerHtml - tem…
Apr 18, 2019
74fef5c
Remove unused const and improved filter search
Apr 18, 2019
8603257
Merge branch 'develop' into feature/layered-navigation
jimbo Apr 29, 2019
b59f969
Merge branch 'develop' into feature/layered-navigation
codeAdrian Apr 29, 2019
2941768
Refactoring with React portal
May 2, 2019
264d84d
Merge branch 'feature/layered-navigation-withPortal' into feature/lay…
May 2, 2019
7a7e52c
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 2, 2019
c3d4b92
Replace div element with more appropriate aside element for modal
May 2, 2019
c95df08
Move Portal to root div
May 2, 2019
a547039
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 3, 2019
c0dc68d
Added focus shifting
May 3, 2019
c13975b
Revert focus fix
May 3, 2019
1f5da7c
Add filers to search results page and style them
May 6, 2019
c0bef34
Filter modal CSS adjusments - positioning and transition
May 6, 2019
d822143
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 6, 2019
cf1dc80
Merge branch 'feature/layered-navigation' of github.com:codeAdrian/pw…
May 6, 2019
f30bc57
Style guide & CSS update
May 6, 2019
2027e4a
Proptype updates & code cleanup
May 6, 2019
17b852e
Merge branch 'develop' into feature/layered-navigation
jimbo May 6, 2019
f07c0a8
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 7, 2019
a404541
Code cleanup and improving modal component
May 7, 2019
77a22b5
Quick fix: var name
May 7, 2019
c49d9b5
Adjust modal props
jimbo May 7, 2019
0ca5b48
Minor fixes
May 8, 2019
5a52a88
Styles update
May 8, 2019
361d6dd
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 9, 2019
1d27903
Fix reset filter search issue
May 9, 2019
d0bbdbd
Fix page reset on filter reset
May 9, 2019
1ddcc11
Class apply fix
May 9, 2019
361e7b0
Preserve page number on filter change
May 9, 2019
073242e
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 10, 2019
3f93c0f
Fix Search page filter
May 10, 2019
ac7fc04
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 13, 2019
8707335
Fix filter UX issues
May 13, 2019
87bc75b
Add comment to util functions
May 13, 2019
a0d0b2d
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 14, 2019
e640fe0
Fix filters persistence issue
May 14, 2019
156fa22
Fix filter persistence on modal close
May 14, 2019
ccf5444
Remove unused import
May 14, 2019
605a46b
Merge branch 'develop' into feature/layered-navigation
dpatil-magento May 16, 2019
9110c3c
CSS fixes
May 17, 2019
06f4963
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 24, 2019
0e122d3
Merge branch 'develop' into feature/layered-navigation
dpatil-magento May 27, 2019
a64cc38
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 28, 2019
66e92cb
Merge branch 'develop' into feature/layered-navigation
codeAdrian May 28, 2019
c4bf3cc
Resolve conflicts with hooks refactor
jimbo Jun 1, 2019
23f7ffe
Merge branch 'develop' into feature/layered-navigation
jimbo Jun 1, 2019
696b825
Minor fixes and cleanup
Jun 1, 2019
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Code cleanup and swatch styles adjustments
Adrian Bece committed Jan 24, 2019

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
commit 0c1f981360b151c677c3098c285cbab04d17be20
Original file line number Diff line number Diff line change
@@ -14,12 +14,10 @@
}

.iconWrapper {
color: white;
position: absolute;
top: 50%;
bottom: 0;
left: 0;
right: 0;
transform: translateY(-50%);
display: flex;
height: 100%;
}

.swatchLabel {
Original file line number Diff line number Diff line change
@@ -40,7 +40,7 @@ const FilterSwatch = ({
}}
/>
<span className={classes.iconWrapper}>
<Icon src={Checkmark} size={32} />
<Icon src={Checkmark} size={36} />
</span>
</Fragment>
)}
Original file line number Diff line number Diff line change
@@ -22,21 +22,7 @@
display: block;
}

.counter {
display: flex;
justify-content: space-evenly;
align-items: center;
border: 1px solid black;
border-radius: 15px;
height: 1.5rem;
min-width: 3.375rem;
background-color: white;
margin-right: 1rem;
font-size: 0.75rem;
line-height: 1rem;
}

.counterAndCloseButtonContainer {
.closeWrapper {
display: flex;
justify-content: space-between;
}
Original file line number Diff line number Diff line change
@@ -62,7 +62,7 @@ class FilterBlock extends Component {
<div className={classes.root}>
<div className={classes.optionHeader}>
<div className={classes.optionName}>{name}</div>
<div className={classes.counterAndCloseButtonContainer}>
<div className={classes.closeWrapper}>
<button
onClick={this.optionToggle}
className={classes.optionToggleButton}
Original file line number Diff line number Diff line change
@@ -13,7 +13,7 @@ class FiltersCurrent extends Component {
};

render() {
const { chosenFilterOptions, classes, id } = this.props;
const { chosenFilterOptions, classes, keyPrefix } = this.props;
const { removeOption } = this;

return (
3 changes: 2 additions & 1 deletion packages/venia-concept/src/reducers/catalog.js
Original file line number Diff line number Diff line change
@@ -10,7 +10,8 @@ const initialState = {
currentPage: 1,
pageSize: 6,
prevPageTotal: null,
chosenFilterOptions: {}
chosenFilterOptions: {},
appliedFilterOptions: {}
Copy link
Contributor

@sirugh sirugh Mar 27, 2019

Choose a reason for hiding this comment

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

Is this prop necessary anymore? I couldn't see it used anywhere.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

You are right, thanks for catching that. It must have slipped through the previous conflicts I have resolved. Code has been updated with "prevPageTotal" references, reducers and tests removed.

};

const reducerMap = {