Skip to content

Commit 115160c

Browse files
elainefan331elainefan331
authored
Merge pull request #116 from NeuroJSON/dev-fan
sync staging with dev-fan branch
2 parents 2b6078e + bfc1416 commit 115160c

File tree

16 files changed

+945
-47
lines changed

16 files changed

+945
-47
lines changed

‎.github/workflows/build-deploy-neurojsonio.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ jobs:
2727
# PUBLIC_URL="/" yarn build
2828
export PUBLIC_URL="/"
2929
export REACT_APP_API_URL="/api/v1"
30+
export REACT_APP_USE_CORS=false
3031
yarn build
3132
3233
- name: Copy JS libraries

‎.github/workflows/build-deploy-zodiac.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ jobs:
3636
# PUBLIC_URL="/dev/${{ env.BRANCH_NAME }}/" yarn build
3737
export PUBLIC_URL="/dev/${{ env.BRANCH_NAME }}/"
3838
export REACT_APP_API_URL="/dev/${{ env.BRANCH_NAME }}/api/v1"
39+
export REACT_APP_USE_CORS=true
3940
yarn build
4041
4142
- name: Copy JS libraries (jdata, bjdata etc.)

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
node_modules
66
.DS_Store
77
package-lock.json
8+
cspell.json
89

910
build
1011

‎backend/src/controllers/activity.controller.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -360,7 +360,7 @@ const trackView = async (req, res) => {
360360
}
361361
};
362362

363-
// get most viewd datasets
363+
// get most viewed datasets
364364
const getMostViewedDatasets = async (req, res) => {
365365
try {
366366
const limit = parseInt(req.query.limit) || 10;

‎package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@
6161
"@types/pako": "^2.0.3",
6262
"@typescript-eslint/eslint-plugin": "^5.31.0",
6363
"@typescript-eslint/parser": "^5.31.0",
64+
"cspell": "7",
6465
"eslint": "^8.21.0",
6566
"eslint-config-prettier": "^8.3.0",
6667
"eslint-config-react-app": "^7.0.1",
@@ -76,7 +77,8 @@
7677
"build": "craco build || react-scripts build",
7778
"test": "craco test || react-scripts test",
7879
"eject": "craco eject || react-scripts eject",
79-
"lint": "eslint 'src/**/*.{js,jsx,ts,tsx}' --ext .js,.jsx,.ts,.tsx"
80+
"lint": "eslint 'src/**/*.{js,jsx,ts,tsx}' --ext .js,.jsx,.ts,.tsx",
81+
"spellcheck": "cspell ."
8082
},
8183
"browserslist": {
8284
"production": [

‎src/components/NavBar/NavItems.tsx‎

Lines changed: 239 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,14 @@
1-
import { Toolbar, Grid, Button, Typography, Box, Tooltip } from "@mui/material";
1+
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
2+
import {
3+
Toolbar,
4+
Grid,
5+
Button,
6+
Typography,
7+
Box,
8+
Tooltip,
9+
Menu,
10+
MenuItem,
11+
} from "@mui/material";
212
import UserButton from "components/User/UserButton";
313
import UserLogin from "components/User/UserLogin";
414
import UserSignup from "components/User/UserSignup";
@@ -24,21 +34,66 @@ const NavItems: React.FC = () => {
2434
const [loginOpen, setLoginOpen] = useState(false);
2535
const [signupOpen, setSignupOpen] = useState(false);
2636

37+
// Resources dropdown state
38+
const [resourcesAnchor, setResourcesAnchor] = useState<null | HTMLElement>(
39+
null
40+
);
41+
const resourcesOpen = Boolean(resourcesAnchor);
42+
2743
const handleLogout = () => {
2844
dispatch(logoutUser());
2945
navigate("/");
3046
};
3147

48+
const handleResourcesClick = (event: React.MouseEvent<HTMLElement>) => {
49+
setResourcesAnchor(event.currentTarget);
50+
};
51+
52+
const handleResourcesClose = () => {
53+
setResourcesAnchor(null);
54+
};
55+
56+
const resourcesMenu = [
57+
{
58+
category: "Converter",
59+
items: [
60+
{
61+
text: "neuroj for Python",
62+
url: "https://neurojson.org/Page/python-jdata",
63+
},
64+
{ text: "neuroj for shell", url: "https://neurojson.org/Page/neuroj" },
65+
],
66+
},
67+
{
68+
category: "MATLAB/Octave",
69+
items: [
70+
{ text: "jsonlab", url: "" },
71+
{ text: "jdict", url: "" },
72+
{ text: "jnifty", url: "" },
73+
{ text: "jsnirfy", url: "" },
74+
],
75+
},
76+
{
77+
category: "Python",
78+
items: [
79+
{ text: "jdata", url: "https://neurojson.org/Page/python-jdata" },
80+
{ text: "bjdata", url: "https://neurojson.org/Page/python-bjdata" },
81+
],
82+
},
83+
{
84+
category: "Format Specifications",
85+
items: [
86+
{ text: "JData", url: "" },
87+
{ text: "BJData", url: "" },
88+
{ text: "JNIfTI", url: "" },
89+
{ text: "JSNIRF", url: "" },
90+
{ text: "JMesh", url: "" },
91+
{ text: "JGIFTI", url: "" },
92+
],
93+
},
94+
];
95+
3296
return (
33-
// <Toolbar sx={{ marginTop: "0.5rem" }}>
34-
// <Grid
35-
// container
36-
// alignItems="center"
37-
// sx={{
38-
// maxWidth: "100%",
39-
// }}
40-
// >
41-
// <Grid item xs={12} sm={12} md={5} lg={5}>
4297
<>
4398
<Toolbar
4499
sx={{
@@ -145,7 +200,7 @@ const NavItems: React.FC = () => {
145200
textAlign: "center",
146201
}}
147202
>
148-
{[
203+
{/* {[
149204
{ text: "About", url: RoutesEnum.ABOUT },
150205
{ text: "Wiki", url: "https://neurojson.org/Wiki" },
151206
{ text: "Search", url: RoutesEnum.SEARCH },
@@ -255,7 +310,113 @@ const NavItems: React.FC = () => {
255310
</Link>
256311
)}
257312
</Grid>
313+
))} */}
314+
315+
{[
316+
{ text: "About", url: RoutesEnum.ABOUT },
317+
{ text: "Wiki", url: "https://neurojson.org/Wiki" },
318+
{ text: "Search", url: RoutesEnum.SEARCH },
319+
{ text: "Databases", url: RoutesEnum.DATABASES },
320+
].map(({ text, url }) => (
321+
<Grid item key={text}>
322+
{url?.startsWith("https") ? (
323+
<a
324+
href={url}
325+
target="_blank"
326+
rel="noopener noreferrer"
327+
style={{ textDecoration: "none" }}
328+
>
329+
<Typography
330+
align="center"
331+
fontWeight={600}
332+
lineHeight={"1.5rem"}
333+
letterSpacing={"0.05rem"}
334+
sx={{
335+
fontSize: {
336+
xs: "0.8rem",
337+
sm: "1rem",
338+
},
339+
color: Colors.white,
340+
transition: "color 0.3s ease, transform 0.3s ease",
341+
textTransform: "uppercase",
342+
"&:hover": {
343+
transform: "scale(1.2)",
344+
cursor: "pointer",
345+
},
346+
}}
347+
>
348+
{text}
349+
</Typography>
350+
</a>
351+
) : (
352+
<Link to={url} style={{ textDecoration: "none" }}>
353+
<Typography
354+
align="center"
355+
fontWeight={600}
356+
lineHeight={"1.5rem"}
357+
letterSpacing={"0.05rem"}
358+
sx={{
359+
fontSize: {
360+
xs: "0.8rem",
361+
sm: "1rem",
362+
},
363+
color: Colors.white,
364+
transition: "color 0.3s ease, transform 0.3s ease",
365+
textTransform: "uppercase",
366+
"&:hover": {
367+
transform: "scale(1.2)",
368+
cursor: "pointer",
369+
},
370+
}}
371+
>
372+
{text}
373+
</Typography>
374+
</Link>
375+
)}
376+
</Grid>
258377
))}
378+
379+
{/* Resources Dropdown */}
380+
<Grid item>
381+
<Box
382+
onClick={handleResourcesClick}
383+
sx={{
384+
display: "flex",
385+
alignItems: "center",
386+
gap: 0.5,
387+
cursor: "pointer",
388+
}}
389+
>
390+
<Typography
391+
align="center"
392+
fontWeight={600}
393+
lineHeight={"1.5rem"}
394+
letterSpacing={"0.05rem"}
395+
sx={{
396+
fontSize: {
397+
xs: "0.8rem",
398+
sm: "1rem",
399+
},
400+
color: Colors.white,
401+
transition: "color 0.3s ease, transform 0.3s ease",
402+
textTransform: "uppercase",
403+
"&:hover": {
404+
transform: "scale(1.2)",
405+
},
406+
}}
407+
>
408+
Resources
409+
</Typography>
410+
<KeyboardArrowDownIcon
411+
sx={{
412+
color: Colors.white,
413+
fontSize: "1.2rem",
414+
transition: "transform 0.3s ease",
415+
transform: resourcesOpen ? "rotate(180deg)" : "rotate(0deg)",
416+
}}
417+
/>
418+
</Box>
419+
</Grid>
259420
</Box>
260421

261422
{/* User Button */}
@@ -281,6 +442,73 @@ const NavItems: React.FC = () => {
281442
{/* </Grid> */}
282443
{/* </Grid> */}
283444
</Toolbar>
445+
446+
{/* Resources Dropdown Menu */}
447+
<Menu
448+
anchorEl={resourcesAnchor}
449+
open={resourcesOpen}
450+
onClose={handleResourcesClose}
451+
PaperProps={{
452+
sx: {
453+
bgcolor: Colors.darkPurple,
454+
color: Colors.white,
455+
minWidth: "280px",
456+
maxHeight: "500px",
457+
mt: 1,
458+
},
459+
}}
460+
>
461+
{resourcesMenu.map((section, sectionIndex) => (
462+
<Box key={section.category}>
463+
{sectionIndex > 0 && (
464+
<Box
465+
sx={{
466+
borderTop: `1px solid ${Colors.lightGray}40`,
467+
mx: 1,
468+
my: 0.5,
469+
}}
470+
/>
471+
)}
472+
<MenuItem
473+
disabled
474+
sx={{
475+
color: Colors.green,
476+
fontWeight: 700,
477+
fontSize: "0.85rem",
478+
opacity: "1 !important",
479+
"&.Mui-disabled": {
480+
opacity: 1,
481+
},
482+
}}
483+
>
484+
{section.category}
485+
</MenuItem>
486+
{section.items.map((item) => (
487+
<MenuItem
488+
key={item.text}
489+
onClick={() => {
490+
if (item.url) {
491+
window.open(item.url, "_blank");
492+
handleResourcesClose();
493+
}
494+
}}
495+
sx={{
496+
pl: 3,
497+
fontSize: "0.9rem",
498+
color: item.url ? Colors.white : Colors.lightGray,
499+
cursor: item.url ? "pointer" : "default",
500+
"&:hover": {
501+
bgcolor: item.url ? Colors.purpleGrey : "transparent",
502+
color: item.url ? Colors.darkPurple : Colors.lightGray,
503+
},
504+
}}
505+
>
506+
{item.text}
507+
</MenuItem>
508+
))}
509+
</Box>
510+
))}
511+
</Menu>
284512
<UserLogin
285513
open={loginOpen}
286514
onClose={() => setLoginOpen(false)}

‎src/components/NodeInfoPanel.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ const formatSize = (bytes?: number): string => {
4141
};
4242

4343
// convert the date format
44-
const dateCoverter = (date?: string): string => {
44+
const dateConverter = (date?: string): string => {
4545
if (date === undefined) return "N/A";
4646
const newDate = new Date(Number(date) * 1000);
4747
const result = new Intl.DateTimeFormat("en-US", {
@@ -189,7 +189,7 @@ const NodeInfoPanel: React.FC<NodeInfoPanelProps> = ({
189189

190190
<Grid item xs={12}>
191191
<Typography sx={{ color: Colors.green, fontWeight: "Bold" }}>
192-
NeuroJSON-Cuated Datasets
192+
NeuroJSON-Curated Datasets
193193
</Typography>
194194
{dbInfo ? (
195195
<Typography sx={{ color: Colors.lightGray }}>
@@ -245,7 +245,7 @@ const NodeInfoPanel: React.FC<NodeInfoPanelProps> = ({
245245
Database Creation Time
246246
</Typography>
247247
<Typography>
248-
{dateCoverter(dbInfo.instance_start_time)}
248+
{dateConverter(dbInfo.instance_start_time)}
249249
</Typography>
250250
</Grid>
251251
<Grid item xs={12}>

‎src/components/NodesFilter/FilterMenu.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@ const FilterMenu: React.FC<FilterMenuProps> = ({
144144
</Typography>
145145
<ModalitiesFilter
146146
onFilter={onModalitiesFilter}
147-
homeSeletedModalities={homeSelectedModalities}
147+
homeSelectedModalities={homeSelectedModalities}
148148
/>
149149
</Box>
150150
</Box>

0 commit comments

Comments
 (0)