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

MAINT: add banner for town hall #844

Merged
merged 3 commits into from
Nov 6, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
Original file line number Diff line number Diff line change
Expand Up @@ -154,24 +154,30 @@ describe('ExtractionTable', () => {
});
});

it('should remove the filter if the delete button is clicked', () => {
it.only('should remove the filter if the delete button is clicked', () => {
let studysetYear = '';
// ARRANGE
cy.wait('@studysetFixture').then((studysetFixture) => {
const studyset = studysetFixture?.response?.body as StudysetReturn;
const studysetStudies = studyset.studies as StudyReturn[];
studysetYear = studysetStudies[0].year?.toString() || "";
cy.get('input').eq(0).click();
cy.get(`input`)
.eq(0)
.type(studysetStudies[0].year?.toString() || '');
});
cy.get('tbody > tr').should('have.length', 1);
cy.get('[data-testid="CancelIcon"]').should('exist');

// ACT
cy.get('[data-testid="CancelIcon"]').click();
cy.contains(
`Filtering YEAR: ${studysetYear}`
).parent().find('[data-testid="CancelIcon"]').click();

// ASSERT
cy.get('tbody > tr').should('have.length', 3);
cy.get(`[data-testid="CancelIcon"]`).should('not.exist');
cy.contains(
`Filtering YEAR: ${studysetYear}`
).should('not.exist')
});
});

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -422,7 +422,7 @@ describe('DoSleuthImport', () => {

it('should select MKDA and create an MKDA meta analysis', () => {
cy.contains('button', 'Yes').click();
cy.get('[type="radio"]').eq(1).click();
cy.get('[type="radio"]').eq(1).click({ force: true });
cy.contains('button', 'create')
.click()
.wait('@specificationPostFixture')
Expand Down
128 changes: 66 additions & 62 deletions compose/neurosynth-frontend/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,78 +1,82 @@
import Close from '@mui/icons-material/Close';
import { IconButton } from '@mui/material';
import { AxiosError } from 'axios';
import useGoogleAnalytics from 'hooks/useGoogleAnalytics';
import { SnackbarKey, SnackbarProvider } from 'notistack';
import { useEffect, useRef } from 'react';
import { QueryCache, QueryClient, QueryClientProvider } from 'react-query';
import Navbar from 'components/Navbar/Navbar';
import useGetToken from './hooks/useGetToken';
import BaseNavigation from 'pages/BaseNavigation/BaseNavigation';
import { useLocation } from 'react-router-dom';
import Close from "@mui/icons-material/Close";
import { IconButton } from "@mui/material";
import { AxiosError } from "axios";
import useGoogleAnalytics from "hooks/useGoogleAnalytics";
import { SnackbarKey, SnackbarProvider } from "notistack";
import { useEffect, useRef } from "react";
import { QueryCache, QueryClient, QueryClientProvider } from "react-query";
import Navbar from "components/Navbar/Navbar";
import useGetToken from "./hooks/useGetToken";
import BaseNavigation from "pages/BaseNavigation/BaseNavigation";
import { useLocation } from "react-router-dom";
import Downbanner from "components/Downbanner";

const queryClient = new QueryClient({
defaultOptions: {
queries: {
retry: 0,
refetchOnWindowFocus: false,
// staleTime: 5000, // https://tkdodo.eu/blog/practical-react-query#the-defaults-explained
},
defaultOptions: {
queries: {
retry: 0,
refetchOnWindowFocus: false,
// staleTime: 5000, // https://tkdodo.eu/blog/practical-react-query#the-defaults-explained
},
queryCache: new QueryCache({
onError: (error) => {
console.log({ error });
const responseStatus = (error as AxiosError)?.response?.status;
if (responseStatus && responseStatus === 404) {
console.error('could not find resource');
}
},
}),
},
queryCache: new QueryCache({
onError: (error) => {
console.log({ error });
const responseStatus = (error as AxiosError)?.response?.status;
if (responseStatus && responseStatus === 404) {
console.error("could not find resource");
}
},
}),
});

declare global {
interface Window {
gtag?: (
type: 'event' | 'config' | 'get' | 'set' | 'consent',
action: 'login' | 'page_view',
options?: any
) => void;
}
interface Window {
gtag?: (
type: "event" | "config" | "get" | "set" | "consent",
action: "login" | "page_view",
options?: any
) => void;
}
}

function App() {
const notistackRef = useRef<SnackbarProvider>(null);
useGetToken();
useGoogleAnalytics();
const notistackRef = useRef<SnackbarProvider>(null);
useGetToken();
useGoogleAnalytics();

const location = useLocation();
useEffect(() => {
if (window.gtag) {
window.gtag('event', 'page_view', {
page_path: `${location.pathname}${location.search}`,
});
}
}, [location]);
const location = useLocation();
useEffect(() => {
if (window.gtag) {
window.gtag("event", "page_view", {
page_path: `${location.pathname}${location.search}`,
});
}
}, [location]);

const handleCloseSnackbar = (key: SnackbarKey) => (_event: React.MouseEvent) => {
if (notistackRef?.current?.closeSnackbar) notistackRef.current?.closeSnackbar(key);
const handleCloseSnackbar =
(key: SnackbarKey) => (_event: React.MouseEvent) => {
if (notistackRef?.current?.closeSnackbar)
notistackRef.current?.closeSnackbar(key);
};

return (
<QueryClientProvider client={queryClient}>
<SnackbarProvider
ref={notistackRef}
autoHideDuration={8000}
action={(key) => (
<IconButton onClick={handleCloseSnackbar(key)}>
<Close sx={{ color: 'white' }} />
</IconButton>
)}
>
<Navbar />
<BaseNavigation />
</SnackbarProvider>
</QueryClientProvider>
);
return (
<QueryClientProvider client={queryClient}>
<SnackbarProvider
ref={notistackRef}
autoHideDuration={8000}
action={(key) => (
<IconButton onClick={handleCloseSnackbar(key)}>
<Close sx={{ color: "white" }} />
</IconButton>
)}
>
<Downbanner />
<Navbar />
<BaseNavigation />
</SnackbarProvider>
</QueryClientProvider>
);
}

export default App;
101 changes: 57 additions & 44 deletions compose/neurosynth-frontend/src/components/Downbanner.tsx
Original file line number Diff line number Diff line change
@@ -1,52 +1,65 @@
import { Cancel } from '@mui/icons-material';
import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
import { Box, IconButton } from '@mui/material';
import BaseNavigationStyles from 'pages/BaseNavigation/BaseNavigation.styles';
import { useState } from 'react';
import { Cancel } from "@mui/icons-material";
import EmojiPeopleIcon from "@mui/icons-material/EmojiPeople";
import { Box, IconButton, Link } from "@mui/material";
import BaseNavigationStyles from "pages/BaseNavigation/BaseNavigation.styles";
import { useState } from "react";

const localStorageDownBannerKey = "hide-downbanner-nov-6-2024";

const Downbanner: React.FC = () => {
const shouldHide = !!localStorage.getItem('hide-downbanner-sep-13-2024');
const [hideBanner, setHideBanner] = useState(shouldHide);
const shouldHide = !!localStorage.getItem(localStorageDownBannerKey);
const [hideBanner, setHideBanner] = useState(shouldHide);

if (hideBanner) return <></>;
if (hideBanner) return <></>;

return (
<Box
sx={{
backgroundColor: 'secondary.main',
color: 'primary.contrastText',
width: '100%',
paddingY: '0.5rem',
}}
>
<Box
sx={[
BaseNavigationStyles.pagesContainer,
{
marginY: '0',
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
},
]}
>
<Box display="flex" alignItems="center">
<ErrorOutlineIcon sx={{ mr: '1rem' }} />
Neurosynth-compose will be undergoing planned maintenance and will be offline on
friday (Sep/13/2024)
</Box>
<IconButton
onClick={() => {
localStorage.setItem('hide-downbanner-sep-13-2024', 'true');
setHideBanner(true);
}}
sx={{ padding: 0, ':hover': { backgroundColor: 'secondary.light' } }}
>
<Cancel />
</IconButton>
</Box>
return (
<Box
sx={{
backgroundColor: "primary.dark",
color: "primary.contrastText",
width: "100%",
paddingY: "0.5rem",
}}
>
<Box
sx={[
BaseNavigationStyles.pagesContainer,
{
marginY: "0",
display: "flex",
alignItems: "center",
justifyContent: "space-between",
},
]}
>
<Box display="flex" alignItems="center">
<EmojiPeopleIcon sx={{ mr: "1rem" }} />
Join us next Wednesday, November 13th at 19:00 ET for the inaugural
Neurosynth Compose Virtual Town Hall!{" "}
<Link
color="primary.contrastText"
sx={{ marginLeft: "4px" }}
href="https://smmo1.mjt.lu/lnk/AUUAAFUYj_MAAAAYAkQAAMQWKMIAAAABy9QAAd5pACejZgBnKVfVT2hXpDCyQC6H3aykCv_XyAAbJus/1/mr5Wo-0t0LWaATWN2bFHLA/aHR0cHM6Ly90YWxseS5zby9yLzN5cWIwNA"
target="_blank"
>
Click here to register
</Link>
</Box>
);
<IconButton
onClick={() => {
localStorage.setItem(localStorageDownBannerKey, "true");
setHideBanner(true);
}}
sx={{
padding: 0,
":hover": { backgroundColor: "secondary.light" },
}}
>
<Cancel />
</IconButton>
</Box>
</Box>
);
};

export default Downbanner;
Loading