alt/zot-wo-auth
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Made the filters sticky

Browse Source 
Signed-off-by: Amelia-Maria Breda <ambreda@cisco.com>
This commit is contained in:
Amelia-Maria Breda 2022-11-03 15:58:29 +01:00 committed by Raul Kele
parent 45e3af8958
commit 4f5dec70bc
3 changed files with 19 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
package-lock.json generated
View File

@ -28,6 +28,7 @@
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^6.2.1",
"react-sticky-el": "^2.0.9",
"web-vitals": "^2.1.3"
},
"devDependencies": {
@ -17910,6 +17911,15 @@
"node": ">=10"
}
},
"node_modules/react-sticky-el": {
"version": "2.0.9",
"resolved": "https://registry.npmjs.org/react-sticky-el/-/react-sticky-el-2.0.9.tgz",
"integrity": "sha512-JFjFWlaB7gn5bszZlRQ/VKxK3zHiViJdn0EhQ/6WImun5Xbx3OMUX2rirr0QLSEo27dwvoSE4HkIFr30QAScfg==",
"peerDependencies": {
"react": ">=16.3.0",
"react-dom": ">=16.3.0"
}
},
"node_modules/react-transition-group": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.2.tgz",
@ -33786,6 +33796,12 @@
}
}
},
"react-sticky-el": {
"version": "2.0.9",
"resolved": "https://registry.npmjs.org/react-sticky-el/-/react-sticky-el-2.0.9.tgz",
"integrity": "sha512-JFjFWlaB7gn5bszZlRQ/VKxK3zHiViJdn0EhQ/6WImun5Xbx3OMUX2rirr0QLSEo27dwvoSE4HkIFr30QAScfg==",
"requires": {}
},
"react-transition-group": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.2.tgz",

1
package.json
View File

@ -23,6 +23,7 @@
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^6.2.1",
"react-sticky-el": "^2.0.9",
"web-vitals": "^2.1.3"
},
"devDependencies": {

3
src/components/Explore.jsx
View File

@ -5,6 +5,7 @@ import React, { useEffect, useMemo, useRef, useState } from 'react';
import RepoCard from './RepoCard.jsx';
import Loading from './Loading';
import Typography from '@mui/material/Typography';
import Sticky from 'react-sticky-el';
import Alert from '@mui/material/Alert';
import { Container, FormControl, Grid, InputLabel, MenuItem, Select, Stack } from '@mui/material';
@ -258,7 +259,7 @@ function Explore() {
</Grid>
<Grid container item xs={12} spacing={5} pt={1}>
<Grid item xs={3}>
{renderFilterCards()}
<Sticky>{renderFilterCards()}</Sticky>
</Grid>
<Grid item xs={9}>
{!(exploreData && exploreData.length) && !isLoading ? (