Skip to content

Commit 43d12a5

Browse files
mihirsamdarshimihirsamdarshi
committed
Merge branch 'dev' into refactor/vite
# Conflicts: # src/LandingPage/landingPage.jsx # src/LandingPage/openOfficeHour.jsx # src/sass/landingPage.scss # src/sass/main.scss # yarn.lock
2 parents 41c4b22 + 29994d6 commit 43d12a5

File tree

17 files changed

+526
-368
lines changed

17 files changed

+526
-368
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,12 +27,12 @@
2727
"react-dom": "18.3.1",
2828
"react-google-recaptcha": "^3.1.0",
2929
"react-helmet": "^6.1.0",
30+
"react-lite-youtube-embed": "^2.4.0",
3031
"react-redux": "8.0.5",
3132
"react-responsive": "^10.0.0",
3233
"react-router-dom": "^6.22.3",
3334
"react-table": "^7.7.0",
3435
"react-tooltip": "^5.11.2",
35-
"react-youtube": "^10.1.0",
3636
"redux": "^4.0.1",
3737
"redux-thunk": "^2.3.0",
3838
"tocbot": "^4.25.0",

‎src/LandingPage/announcementBanner.jsx

Lines changed: 0 additions & 55 deletions
This file was deleted.

‎src/LandingPage/components/subscribeDataUpdates.jsx

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import React from 'react';
2+
import { trackEvent } from '../../GoogleAnalytics/googleAnalytics';
3+
4+
// Function to render landing page announcement
5+
function SubscribeDataUpdates() {
6+
return (
7+
<div className="data-update-signup col-12 mb-4">
8+
<h1 className="data-updates-signup-title display-3">Subscribe to our data updates</h1>
9+
<div className="data-updates-signup-content mb-4 lead">
10+
Stay in the know about the latest data releases and available resources from the
11+
MoTrPAC Data Hub.
12+
</div>
13+
<a
14+
href={import.meta.env.REACT_APP_DATA_UPDATES_SIGNUP_URL}
15+
className="btn btn-primary btn-lg"
16+
role="button"
17+
target="_blank"
18+
rel="noopener noreferrer"
19+
onClick={trackEvent.bind(
20+
this,
21+
'User Engagement',
22+
'subscribe_data_updates',
23+
'Landing Page',
24+
'Data updates signup',
25+
)}
26+
>
27+
SUBSCRIBE
28+
</a>
29+
</div>
30+
);
31+
}
32+
33+
export default SubscribeDataUpdates;

‎src/LandingPage/landingPage.jsx

Lines changed: 46 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,31 @@
1+
import React, { useCallback, useState, useEffect } from 'react';
2+
import { connect } from 'react-redux';
13
import PropTypes from 'prop-types';
2-
import React, { useCallback, useEffect, useState } from 'react';
4+
import { Link, Navigate } from 'react-router-dom';
35
import { Helmet } from 'react-helmet';
4-
import { connect } from 'react-redux';
56
import { useMediaQuery } from 'react-responsive';
6-
import { Link, Navigate } from 'react-router-dom';
7-
import YouTube from 'react-youtube';
7+
import LiteYouTubeEmbed from 'react-lite-youtube-embed';
88

9-
// import network figure 4e visualization dataset
9+
import OpenOfficeHour from './openOfficeHour';
1010
import Footer from '../Footer/footer';
11-
import IconSet from '../lib/iconSet';
12-
import landingPageStructuredData from '../lib/searchStructuredData/landingPage';
11+
import SubscribeDataUpdates from './components/subscribeDataUpdates';
1312
import BackgroundVideo from './components/backgroundVideo';
13+
// import network figure 4e visualization dataset
1414
import Figure1C from './components/figure1c';
1515
import VisNetworkReactComponent from './components/visNetwork';
16-
import PromoteBanner from './promoteBanner';
17-
18-
// eslint-disable-next-line import/no-extraneous-dependencies
19-
import '@styles/landingPage.scss'
16+
import landingPageStructuredData from '../lib/searchStructuredData/landingPage';
17+
import IconSet from '../lib/iconSet';
2018

21-
import LayerRunner from '../assets/LandingPageGraphics/Data_Layer_Runner.png';
2219
import LogoMoTrPACWhite from '../assets/LandingPageGraphics/logo-motrpac-white.png';
20+
import LayerRunner from '../assets/LandingPageGraphics/Data_Layer_Runner.png';
21+
// import RatFigurePaass1b from '../assets/LandingPageGraphics/rat-figure-pass1b.svg';
2322
import NatureIssueCover from '../assets/LandingPageGraphics/nature_issue_cover.jpg';
23+
// import network figure 4e visualization dataset
2424
import landscapeFigure4eNetworkData from '../data/landscape_figure_4e';
2525

26+
// eslint-disable-next-line import/no-extraneous-dependencies
27+
import '@styles/landingPage.scss'
28+
2629
// animated down arrow icon
2730
function AnimatedDownArrow() {
2831
return (
@@ -32,6 +35,14 @@ function AnimatedDownArrow() {
3235
);
3336
}
3437

38+
function AnimatedDownArrowDark() {
39+
return (
40+
<div className="animated-down-arrow pb-4 w-100">
41+
<img src={IconSet.ArrowDownAnimatedDark} alt="down-arrow" />
42+
</div>
43+
);
44+
}
45+
3546
// configs for visjs network visualization rendering
3647
const options = {
3748
height: '100%',
@@ -103,22 +114,6 @@ export function LandingPage({ isAuthenticated, profile }) {
103114
};
104115
}
105116

106-
// youtube video player configuration
107-
const onPlayerReady = (event) => {
108-
// access to player in all event handlers via event.target
109-
event.target.pauseVideo();
110-
};
111-
112-
const opts = {
113-
height: '390',
114-
width: '640',
115-
playerVars: {
116-
// https://developers.google.com/youtube/player_parameters
117-
autoplay: 0,
118-
cc_load_policy: 1,
119-
},
120-
};
121-
122117
return (
123118
<div className="row marketing content-container">
124119
<Helmet>
@@ -274,17 +269,15 @@ export function LandingPage({ isAuthenticated, profile }) {
274269
<div className="w-100 h-100 d-flex align-items-center">
275270
<div className="section-content-container container text-center">
276271
<div
277-
className="embedContainer embed-responsive embed-responsive-16by9 mt-lg-4"
272+
className="embedContainer embed-responsive mt-lg-4"
278273
id="youtube-tutorial-video-container"
279274
>
280-
<YouTube
281-
videoId="3zHnzUMo_vw"
282-
opts={opts}
283-
onReady={onPlayerReady}
284-
loading="lazy"
275+
<LiteYouTubeEmbed
276+
id="3zHnzUMo_vw"
277+
params="autoplay=0&cc_load_policy=1"
278+
poster="maxresdefault"
285279
title="Data Hub Tutorial Video"
286-
className="embed-youtube-video-container"
287-
iframeClassName="embed-responsive-item border border-dark"
280+
iframeClass="embed-responsive-item border border-dark"
288281
/>
289282
</div>
290283
<div className="container text-center mt-4">
@@ -300,22 +293,22 @@ export function LandingPage({ isAuthenticated, profile }) {
300293
<div className="w-100 h-100 d-flex align-items-center">
301294
<div className="section-content-container container text-center">
302295
<div className="row content-code-repository d-flex align-items-center">
303-
<div className="feature-image col-12 col-md-5 mx-auto">
296+
<div className="feature-image col-12 col-md-6 mx-auto">
304297
<img
305298
src={LayerRunner}
306299
className="img-fluid data-layer-runner"
307300
alt="Data Layer Runner"
308301
loading="lazy"
309302
/>
310303
</div>
311-
<div className="content col-12 col-md-7">
304+
<div className="content col-12 col-md-6">
312305
<h1>
313306
<span className="material-icons">terminal</span>
314307
</h1>
315308
<p>
316-
Deep dive into our source codes integral to the MoTrPAC 6
309+
Deep dive into the source code essential to the MoTrPAC 6
317310
month old rats performing endurance training exercise study,
318-
from ingestion to QC and from processing to analysis.
311+
from ingestion to QC, and from processing to analysis.
319312
</p>
320313
<Link
321314
to="/code-repositories"
@@ -326,13 +319,21 @@ export function LandingPage({ isAuthenticated, profile }) {
326319
</Link>
327320
</div>
328321
</div>
329-
<div className="row mt-4" id="join-office-hour">
330-
<PromoteBanner />
331-
</div>
332322
</div>
333323
</div>
334-
<div className="w-100 homepage-footer-container">
335-
<Footer />
324+
<AnimatedDownArrowDark />
325+
</section>
326+
<section className="eighth">
327+
<div className="w-100 h-100">
328+
<div className="section-content-container container text-center d-flex align-items-center">
329+
<div className="panel-content-container">
330+
<OpenOfficeHour />
331+
<SubscribeDataUpdates />
332+
</div>
333+
</div>
334+
<div className="w-100 homepage-footer-container">
335+
<Footer />
336+
</div>
336337
</div>
337338
</section>
338339
</div>

‎src/LandingPage/openOfficeHour.jsx

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import React from 'react';
2+
import { trackEvent } from '../GoogleAnalytics/googleAnalytics';
3+
4+
// Function to render landing page announcement
5+
function OpenOfficeHour() {
6+
return (
7+
<div className="office-hour-signup col-12 border p-5" id="join-office-hour">
8+
<h1 className="office-hour-title display-2">Join Us</h1>
9+
<div className="office-hour-content mb-4 lead">
10+
Come join us at the next virtual office hour on
11+
{' '}
12+
{import.meta.env.REACT_APP_OFFICE_HOUR_DAY}
13+
{' '}
14+
{import.meta.env.REACT_APP_OFFICE_HOUR_DATE}
15+
{' '}
16+
at 11:00 am Pacific Time and learn more about our data.
17+
</div>
18+
<a
19+
href={import.meta.env.REACT_APP_OFFICE_HOUR_SIGNUP_URL}
20+
className="btn btn-dark btn-lg"
21+
role="button"
22+
target="_blank"
23+
rel="noopener noreferrer"
24+
onClick={trackEvent.bind(
25+
this,
26+
'User Engagement',
27+
'open_office_hour',
28+
'Landing Page',
29+
import.meta.env.REACT_APP_OFFICE_HOUR_DATE,
30+
)}
31+
>
32+
SIGN UP
33+
</a>
34+
</div>
35+
);
36+
}
37+
38+
export default OpenOfficeHour;

‎src/LandingPage/promoteBanner.jsx

Lines changed: 0 additions & 34 deletions
This file was deleted.

‎src/MultiOmicsWorkingGroups/preCAWG.jsx

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -529,11 +529,15 @@ function PreCAWG() {
529529
analysis on these data, complete the steps below:
530530
<ol>
531531
<li>
532-
Ensure you are listed on the required IRB for your institution.
532+
<strong>Ensure you are listed on the required IRB for your institution.</strong>
533533
</li>
534534
<li>
535-
Become listed as a MoTrPAC member on the main site with your
536-
institutional email: Reach out to{' '}
535+
<strong>
536+
Become listed as a MoTrPAC member on the main site with your institutional email.
537+
</strong>
538+
{' '}
539+
Reach out to
540+
{' '}
537541
<a href="mailto:[email protected]" target="_blank" rel="noreferrer">
538542
[email protected]
539543
</a>

‎src/Navbar/navbar.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,7 +276,7 @@ export function Navbar({
276276
</Link>
277277
{!userType || (userType && userType !== 'internal') ? (
278278
<a
279-
href="https://docs.google.com/forms/d/e/1FAIpQLScjGxwsHDDsE4P4j1VNvIUR73cEyh9SJrofxuQyHqucl0GhBg/viewform"
279+
href={import.meta.env.REACT_APP_DATA_UPDATES_SIGNUP_URL}
280280
className="dropdown-item"
281281
target="_blank"
282282
rel="noreferrer"

‎src/Search/searchReducer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export const defaultSearchState = {
2828
},
2929
fields: [
3030
'gene_symbol',
31-
'metabolite',
31+
'metabolite_refmet',
3232
'feature_ID',
3333
'tissue',
3434
'assay',

0 commit comments

Comments
 (0)