Skip to content

Commit 9dcdd38

Browse files
subinasrsubinasr
committed
feat(montandon): add Montandon landing page
add link to montandon landing page under Learn > Resources menu
1 parent 70435bd commit 9dcdd38

File tree

8 files changed

+575
-1
lines changed

8 files changed

+575
-1
lines changed

‎.changeset/silver-cups-cut.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
---
2+
"go-web-app": minor
3+
---
4+
5+
Add Montandon landing page
6+
7+
- Add a basic landing page for Montandon with links and information
8+
- Add link to Montandon landing page to Learn > Resources menu

‎app/src/App/routes/index.tsx‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1226,6 +1226,20 @@ const obsoleteFieldReportDetails = customWrapRoute({
12261226
},
12271227
});
12281228

1229+
const montandonLandingPage = customWrapRoute({
1230+
parent: rootLayout,
1231+
path: 'montandon-landing',
1232+
component: {
1233+
render: () => import('#views/MontandonLandingPage'),
1234+
props: {},
1235+
},
1236+
wrapperComponent: Auth,
1237+
context: {
1238+
title: 'Montandon',
1239+
visibility: 'anything',
1240+
},
1241+
});
1242+
12291243
const wrappedRoutes = {
12301244
fourHundredFour,
12311245
rootLayout,
@@ -1306,6 +1320,7 @@ const wrappedRoutes = {
13061320
threeWProjectDetail,
13071321
termsAndConditions,
13081322
operationalLearning,
1323+
montandonLandingPage,
13091324
...regionRoutes,
13101325
...countryRoutes,
13111326
...surgeRoutes,

‎app/src/components/Navbar/i18n.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,8 @@
3030
"userMenuPERDescription":"The PER Approach is a continuous and flexible process that enables National Societies to assess, measure and analyse the strengths and gaps of its preparedness and response mechanism.",
3131
"userMenuGlobalSummary":"Global Summary",
3232
"userMenuGlobalPerformance":"Global Performance",
33+
"userMenuMontandonItem":"Montandon - the Global Crisis Data Bank",
34+
"userMenuMontandonItemDescription":"Montandon - the world's largest disaster database, containing data on hazards, impacts, and what actions were taken to address them.",
3335
"userMenuCatalogueResources":"Catalogue of Resources",
3436
"userMenuStartPER":"Start PER Process",
3537
"userMenuGlobal3WProjectDescription":"The Programmatic Partnership is an innovative and ambitious three-year partnership between the IFRC, many of our member National Societies, and the European Union.",

‎app/src/components/Navbar/index.tsx‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -497,6 +497,19 @@ function Navbar(props: Props) {
497497
name="resources"
498498
className={styles.optionDetail}
499499
>
500+
<div className={styles.menuItemWithDescription}>
501+
<DropdownMenuItem
502+
type="link"
503+
to="montandonLandingPage"
504+
variant="tertiary"
505+
state={{ earlyWarning: true }}
506+
>
507+
{strings.userMenuMontandonItem}
508+
</DropdownMenuItem>
509+
<div className={styles.description}>
510+
{strings.userMenuMontandonItemDescription}
511+
</div>
512+
</div>
500513
<div className={styles.menuItemWithDescription}>
501514
<DropdownMenuItem
502515
type="link"
@@ -507,7 +520,7 @@ function Navbar(props: Props) {
507520
{strings.userMenuCatalogueSurgeServicesItem}
508521
</DropdownMenuItem>
509522
<div className={styles.description}>
510-
{strings.userMenuCatalogueSurgeServicesItem}
523+
{strings.userMenuCatalogueSurgeServicesItemDescription}
511524
</div>
512525
</div>
513526
<div className={styles.menuItemWithDescription}>

‎app/src/views/MontandonLandingPage/i18n.json‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
{
2+
"namespace": "montandonLandingPage",
3+
"strings": {
4+
"montandonPageTitle": "Montandon - The Global Crisis Data Bank",
5+
"montandonHeading": "Montandon - The Global Crisis Data Bank",
6+
"montandonHeadingDescription": "Montandon is the world’s largest disaster database—a global public good with applications far beyond IFRC. Montandon integrates three key types of data: 1) forecasted and recorded natural hazards; 2) impact data on these hazards; and 3) operational response data (where available). Montandon contains more than millions of records about hazards and their impacts for hundreds of thousands of events.",
7+
8+
"sourceButtonTitle": "Source",
9+
"sourcePopupTitle": "Source Data",
10+
"stacIdLabel": "ID",
11+
"stacIdValue": "stac-fastapi",
12+
"stacVersionLabel": "STAC Version",
13+
"stacVersionValue": "1.0.0",
14+
"validLabel": "Valid",
15+
"validValue": "Yes",
16+
"stacLocationText": "The STAC metadata file is located at",
17+
"montandonEoapi": "Montandon EoAPI",
18+
19+
"sharePopupTitle": "Share",
20+
"emailLabel": "Email",
21+
"shareUrlLabel": "Share the URL of this page:",
22+
23+
"videoTitle": "IFRC GO Platform: Mapping global crises' historical data with Montandon",
24+
25+
"resources": "Resources",
26+
"visitGithub": "GitHub",
27+
"goWiki": "GO Wiki",
28+
"apiDescription": "OpenAPI service description",
29+
"apiDocumentation": "OpenAPI service documentation",
30+
31+
"blogPosts": "Blog Posts",
32+
"leveragingDataBlogPostTitle": "Leveraging data to learn from past disasters",
33+
"scaledUpSystemsBlogPostTitle": "Scaled-up ambitions require scaled-up systems",
34+
35+
"contact": "Contact",
36+
"contactName": "Justin Ginetti",
37+
"contactInfo": "Senior Officer, Information Management and Risk Analysis, IFRC",
38+
39+
"accessAPILabel": "Access API",
40+
"exploreRadiantEarthLabel": "Explore Radiant Earth API"
41+
}
42+
}

‎app/src/views/MontandonLandingPage/index.tsx‎

Lines changed: 254 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,254 @@
1+
import {
2+
DrefTwoIcon,
3+
MailIcon,
4+
ShareLineIcon,
5+
} from '@ifrc-go/icons';
6+
import {
7+
Container,
8+
DropdownMenu,
9+
TextInput,
10+
TextOutput,
11+
} from '@ifrc-go/ui';
12+
import { useTranslation } from '@ifrc-go/ui/hooks';
13+
14+
import Link from '#components/Link';
15+
import Page from '#components/Page';
16+
17+
import i18n from './i18n.json';
18+
import styles from './styles.module.css';
19+
20+
// TODO: Does this need translation?
21+
const emailSubject = encodeURIComponent('Explore Montandon Data');
22+
const linkToMontandon = 'https://radiantearth.github.io/stac-browser/#/external/montandon-eoapi-stage.ifrc.org/stac/';
23+
const emailBody = encodeURIComponent(`Sharing with you a link to Montandon API: ${linkToMontandon}`);
24+
const mailtoLink = `mailto:?subject=${emailSubject}&body=${emailBody}`;
25+
26+
const noOp = () => {};
27+
28+
/** @knipignore */
29+
// eslint-disable-next-line import/prefer-default-export
30+
export function Component() {
31+
const strings = useTranslation(i18n);
32+
33+
return (
34+
<Page
35+
className={styles.montandonLandingPage}
36+
title={strings.montandonPageTitle}
37+
heading={strings.montandonHeading}
38+
description={strings.montandonHeadingDescription}
39+
mainSectionClassName={styles.content}
40+
actions={(
41+
<>
42+
<DropdownMenu
43+
label={strings.sourcePopupTitle}
44+
icons={<DrefTwoIcon className={styles.icon} />}
45+
preferredPopupWidth={30}
46+
withoutDropdownIcon
47+
persistent
48+
>
49+
<Container
50+
heading={strings.sourcePopupTitle}
51+
withHeaderBorder
52+
withInternalPadding
53+
contentViewType="vertical"
54+
>
55+
<div className={styles.stacDescription}>
56+
<TextOutput
57+
strongLabel
58+
label={strings.stacIdLabel}
59+
value={strings.stacIdValue}
60+
/>
61+
<TextOutput
62+
strongLabel
63+
label={strings.stacVersionLabel}
64+
value={strings.stacVersionValue}
65+
/>
66+
<TextOutput
67+
strongLabel
68+
label={strings.validLabel}
69+
value={strings.validValue}
70+
/>
71+
<div className={styles.separator} />
72+
{strings.stacLocationText}
73+
<TextInput
74+
name="link"
75+
value="https://montandon-eoapi-stage.ifrc.org/stac/"
76+
onChange={noOp}
77+
readOnly
78+
/>
79+
</div>
80+
</Container>
81+
</DropdownMenu>
82+
<DropdownMenu
83+
icons={<ShareLineIcon className={styles.icon} />}
84+
label={strings.sharePopupTitle}
85+
withoutDropdownIcon
86+
preferredPopupWidth={30}
87+
persistent
88+
>
89+
<Container
90+
heading={strings.sharePopupTitle}
91+
withHeaderBorder
92+
withInternalPadding
93+
withFooterBorder
94+
contentViewType="vertical"
95+
footerContent={(
96+
<Link
97+
href={mailtoLink}
98+
icons={<MailIcon className={styles.icon} />}
99+
variant="secondary"
100+
external
101+
>
102+
{strings.emailLabel}
103+
</Link>
104+
)}
105+
>
106+
{strings.shareUrlLabel}
107+
<Link
108+
href="https://radiantearth.github.io/stac-browser/#/external/montandon-eoapi-stage.ifrc.org/stac/"
109+
variant="tertiary"
110+
external
111+
>
112+
https://radiantearth.github.io/stac-browser/#/external/montandon-eoapi-stage.ifrc.org/stac/
113+
</Link>
114+
</Container>
115+
</DropdownMenu>
116+
</>
117+
)}
118+
infoContainerClassName={styles.iframeEmbed}
119+
info={(
120+
<iframe
121+
className={styles.iframe}
122+
src="https://www.youtube.com/embed/BEWxqYfrQek"
123+
title={strings.videoTitle}
124+
allow=""
125+
allowFullScreen
126+
/>
127+
)}
128+
>
129+
<Container
130+
className={styles.resources}
131+
contentViewType="grid"
132+
numPreferredGridContentColumns={3}
133+
spacing="comfortable"
134+
>
135+
<Container
136+
className={styles.guideCard}
137+
heading={strings.resources}
138+
contentViewType="vertical"
139+
withHeaderBorder
140+
withInternalPadding
141+
>
142+
<Link
143+
href="https://github.com/IFRCGo/monty-stac-extension/blob/main/README.md"
144+
external
145+
withLinkIcon
146+
>
147+
{strings.visitGithub}
148+
</Link>
149+
<Link
150+
href="https://go-wiki.ifrc.org/en/home"
151+
external
152+
withLinkIcon
153+
>
154+
{strings.goWiki}
155+
</Link>
156+
<Link
157+
href="https://montandon-eoapi-stage.ifrc.org/stac/api"
158+
external
159+
withLinkIcon
160+
>
161+
{strings.apiDescription}
162+
</Link>
163+
<Link
164+
href="https://montandon-eoapi-stage.ifrc.org/stac/api.html"
165+
external
166+
withLinkIcon
167+
>
168+
{strings.apiDocumentation}
169+
</Link>
170+
</Container>
171+
172+
<Container
173+
className={styles.guideCard}
174+
heading={strings.blogPosts}
175+
contentViewType="vertical"
176+
withHeaderBorder
177+
withInternalPadding
178+
>
179+
<Link
180+
href="https://ifrcgoproject.medium.com/toward-a-more-comprehensive-understanding-of-disasters-fc422d65377"
181+
external
182+
withLinkIcon
183+
>
184+
{strings.leveragingDataBlogPostTitle}
185+
</Link>
186+
187+
<Link
188+
href="https://ifrcgoproject.medium.com/scaled-up-ambitions-require-scaled-up-systems-4a92456fab59"
189+
external
190+
withLinkIcon
191+
>
192+
{strings.scaledUpSystemsBlogPostTitle}
193+
</Link>
194+
</Container>
195+
196+
<Container
197+
className={styles.guideCard}
198+
heading={strings.contact}
199+
contentViewType="vertical"
200+
withHeaderBorder
201+
withInternalPadding
202+
>
203+
<Link
204+
href="mailto:[email protected]"
205+
variant="primary"
206+
external
207+
>
208+
[email protected]
209+
</Link>
210+
<div>
211+
<div className={styles.contactInformation}>
212+
{strings.contactName}
213+
</div>
214+
<div>
215+
{strings.contactInfo}
216+
</div>
217+
</div>
218+
<Link
219+
href="mailto:[email protected]"
220+
variant="tertiary"
221+
external
222+
>
223+
[email protected]
224+
</Link>
225+
</Container>
226+
227+
</Container>
228+
<Container
229+
contentViewType="vertical"
230+
heading="Other links"
231+
withHeaderBorder
232+
>
233+
<Link
234+
href="https://montandon-eoapi-stage.ifrc.org/stac/api.html"
235+
withUnderline
236+
withLinkIcon
237+
external
238+
>
239+
{strings.accessAPILabel}
240+
</Link>
241+
<Link
242+
href="https://radiantearth.github.io/stac-browser/#/external/montandon-eoapi-stage.ifrc.org/stac/"
243+
withUnderline
244+
withLinkIcon
245+
external
246+
>
247+
{strings.exploreRadiantEarthLabel}
248+
</Link>
249+
</Container>
250+
</Page>
251+
);
252+
}
253+
254+
Component.displayName = 'montandonLandingPage';

0 commit comments

Comments
 (0)