Skip to content

Commit 3ebb408

Browse files
BaalmartBaalmart
authored
Merge pull request #1903 from airqo-platform/staging
move to production
2 parents 917c20e + 211d722 commit 3ebb408

File tree

11 files changed

+551
-554
lines changed

11 files changed

+551
-554
lines changed

‎k8s/netmanager/values-prod.yaml

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
replicaCount: 2
22
image:
33
repository: eu.gcr.io/airqo-250220/airqo-platform-frontend
4-
tag: prod-d0e073b4-1709981759
4+
tag: prod-917c20e8-1710250926
55
pullPolicy: Always
66
imagePullSecrets: []
77
nameOverride: ''

‎k8s/platform/values-stage.yaml

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ replicaCount: 1
22
image:
33
repository: eu.gcr.io/airqo-250220/airqo-stage-next-platform
44
pullPolicy: Always
5-
tag: stage-1d591b59-1710234659
5+
tag: stage-be415f7d-1710261276
66
imagePullSecrets: []
77
nameOverride: ''
88
fullnameOverride: ''

‎platform/src/pages/Home/index.jsx

+49-53
Original file line numberDiff line numberDiff line change
@@ -23,16 +23,46 @@ const Home = () => {
2323
const [open, setOpen] = useState(false);
2424

2525
const [step, setStep] = useState(0);
26-
const totalSteps = 4;
26+
const totalSteps = 3;
2727

28-
useEffect(() => {
29-
const completedCards = cardCheckList.filter((card) => card.completed === true);
30-
setStep(completedCards.length);
31-
}, [cardCheckList]);
28+
const steps = [
29+
{
30+
label: 'Introduction AirQo Analytics demo video',
31+
time: '1 min',
32+
link: '#',
33+
func: () => handleModel(),
34+
disabled: true,
35+
},
36+
{
37+
label: 'Choose location you most interested in',
38+
time: '2 min',
39+
link: '/analytics',
40+
func: () => handleCardClick(1),
41+
},
42+
{
43+
label: 'Complete your AirQo Analytics profile',
44+
time: '4 min',
45+
link: '/settings',
46+
func: () => handleCardClick(2),
47+
},
48+
{
49+
label: 'Practical ways to reduce air pollution',
50+
time: '1 min',
51+
link: 'https://blog.airqo.net/',
52+
func: () => handleCardClick(3),
53+
},
54+
];
3255

3356
useEffect(() => {
34-
dispatch(completeTask(1));
35-
}, []);
57+
const completedCards = cardCheckList.filter((card, index) => {
58+
// Skip the disabled step
59+
if (steps[index] && steps[index].disabled) {
60+
return false;
61+
}
62+
return card.completed === true;
63+
});
64+
setStep(completedCards.length);
65+
}, [cardCheckList, steps]);
3666

3767
const handleModel = () => {
3868
setOpen(!open);
@@ -52,8 +82,8 @@ const Home = () => {
5282
};
5383

5484
const handleCardClick = (id) => {
55-
if (id === 4) {
56-
dispatch(completeTask(4));
85+
if (id === 3) {
86+
dispatch(completeTask(3));
5787
} else {
5888
const card = cardCheckList.find((card) => card.id === id);
5989
if (card) {
@@ -70,33 +100,6 @@ const Home = () => {
70100
}
71101
};
72102

73-
const steps = [
74-
{
75-
label: 'Introduction AirQo Analytics demo video',
76-
time: '1 min',
77-
link: '#',
78-
func: () => handleModel(),
79-
},
80-
{
81-
label: 'Choose location you most interested in',
82-
time: '2 min',
83-
link: '/analytics',
84-
func: () => handleCardClick(2),
85-
},
86-
{
87-
label: 'Complete your AirQo Analytics profile',
88-
time: '4 min',
89-
link: '/settings',
90-
func: () => handleCardClick(3),
91-
},
92-
{
93-
label: 'Practical ways to reduce air pollution',
94-
time: '1 min',
95-
link: 'https://blog.airqo.net/',
96-
func: () => handleCardClick(4),
97-
},
98-
];
99-
100103
return (
101104
<Layout noBorderBottom pageTitle='Home'>
102105
{checkListStatus === 'loading' && checkListData.length === 0 ? (
@@ -124,8 +127,8 @@ const Home = () => {
124127

125128
<div className='w-full grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-5'>
126129
{steps.map((step, index) => {
127-
if (index === 0) {
128-
return null; // Skip displaying the card for the first step
130+
if (step.disabled) {
131+
return null;
129132
}
130133

131134
const card = cardCheckList.find((card) => card.id === index + 1);
@@ -140,8 +143,7 @@ const Home = () => {
140143
<div
141144
key={index}
142145
className='w-full h-[250px] flex flex-col justify-between items-start border-[0.5px] rounded-xl border-grey-150 py-5 px-3 space-y-5 focus:outline-blue-600 focus:ring-2 focus:shadow-lg focus:border-blue-600'
143-
tabIndex={0}
144-
>
146+
tabIndex={0}>
145147
<div className='w-full'>
146148
{card && card.completed === true ? (
147149
<div className='w-14 h-14 flex justify-center items-center rounded-full bg-blue-900'>
@@ -150,9 +152,8 @@ const Home = () => {
150152
) : (
151153
<div
152154
className='text-base w-14 h-14 flex justify-center items-center font-medium rounded-full'
153-
style={{ background: '#F5F5FF' }}
154-
>
155-
<span className='text-blue-600'>{index + 1}</span>
155+
style={{ background: '#F5F5FF' }}>
156+
<span className='text-blue-600'>{index === 0 ? index + 1 : index}</span>
156157
</div>
157158
)}
158159
</div>
@@ -167,8 +168,7 @@ const Home = () => {
167168
<a
168169
onClick={step.func}
169170
className={statusColor}
170-
target={index === 3 ? '_blank' : ''}
171-
>
171+
target={index === 3 ? '_blank' : ''}>
172172
{card && card.status === 'inProgress' ? 'Resume' : statusText}
173173
</a>
174174
</Link>
@@ -194,14 +194,12 @@ const Home = () => {
194194
<Button
195195
path='/analytics'
196196
className='bg-blue-900 text-white rounded-lg w-32 h-12'
197-
dataTestId='get-started-button'
198-
>
197+
dataTestId='get-started-button'>
199198
Start here
200199
</Button>
201200
<a
202201
onClick={handleModel}
203-
className='text-blue-600 text-sm font-normal mt-2 cursor-pointer hidden'
204-
>
202+
className='text-blue-600 text-sm font-normal mt-2 cursor-pointer hidden'>
205203
Show me how
206204
</a>
207205
</div>
@@ -210,12 +208,10 @@ const Home = () => {
210208
className='rounded-md p-9 relative'
211209
style={{
212210
background: '#145DFF08',
213-
}}
214-
>
211+
}}>
215212
<div
216213
onClick={handleModel}
217-
className='absolute z-50 inset-0 flex items-center justify-center cursor-pointer hidden'
218-
>
214+
className='absolute z-50 inset-0 flex items-center justify-center cursor-pointer hidden'>
219215
<PlayIcon />
220216
</div>
221217
<Image src={AnalyticsImage} alt='Analytics Image' width={600} height={350} />

‎website/frontend/App.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,10 @@ const MobileAppPage = React.lazy(() => import('src/pages/OurProducts/MobileAppPa
2828
const APIPage = React.lazy(() => import('src/pages/OurProducts/ApiPage'));
2929
const CalibrationPage = React.lazy(() => import('src/pages/OurProducts/CalibrationPage'));
3030
const QRCodeRedirectPage = React.lazy(() => import('src/pages/ExploreData/Redirect'));
31-
const CleanAirPage = React.lazy(() => import('src/pages/CleanAir'));
31+
const CleanAirPage = React.lazy(() => import('src/pages/CleanAir/CleanAirAbout'));
32+
const CleanAirMemberPage = React.lazy(() => import('src/pages/CleanAir/CleanAirPartners'));
33+
const CleanAirEventsPage = React.lazy(() => import('src/pages/CleanAir/CleanAirEvents'));
34+
const CleanAirResourcesPage = React.lazy(() => import('src/pages/CleanAir/CleanAirPublications'));
3235
const CleanAirEventsDetailsPage = React.lazy(() => import('src/pages/CleanAir/EventDetails'));
3336

3437
import { loadAirQloudSummaryData } from 'reduxStore/AirQlouds/operations';
@@ -119,7 +122,10 @@ const App = () => {
119122
<Route path="/products/api" element={<APIPage />} />
120123
<Route path="/download-apps" element={<QRCodeRedirectPage />} />
121124
<Route path="/products/calibrate" element={<CalibrationPage />} />
122-
<Route path="/clean-air" element={<CleanAirPage />} />
125+
<Route path="/clean-air/about" element={<CleanAirPage />} />
126+
<Route path="/clean-air/membership" element={<CleanAirMemberPage />} />
127+
<Route path="/clean-air/events" element={<CleanAirEventsPage />} />
128+
<Route path="/clean-air/resources" element={<CleanAirResourcesPage />} />
123129
<Route
124130
path="/clean-air/event-details/:uniqueTitle"
125131
element={<CleanAirEventsDetailsPage />}

‎website/frontend/src/components/CleanAir/SecondaryNav/index.js

+20-21
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import React, { useEffect, useState } from 'react';
1+
import React, { useEffect } from 'react';
22
import { useSelector, useDispatch } from 'react-redux';
33
import { setActiveTab } from '../../../../reduxStore/CleanAirNetwork/CleanAir';
44
import PropTypes from 'prop-types';
55
import { useTranslation } from 'react-i18next';
6+
import { Link, useLocation } from 'react-router-dom';
67

78
/**
89
* @description Secondary navigation component for the CleanAir site
@@ -18,34 +19,32 @@ const SecondaryNavComponent = ({ disabledTabs }) => {
1819
t('cleanAirSite.subNav.resources')
1920
];
2021
const dispatch = useDispatch();
21-
const activeTab = useSelector((state) => state.cleanAirData.activeTab);
22-
const [selectedTab, setSelectedTab] = useState(tabs[0]);
22+
const location = useLocation();
2323

2424
useEffect(() => {
25-
setSelectedTab(activeTab);
26-
}, []);
27-
28-
const handleTabClick = (tab) => {
29-
if (!disabledTabs.includes(tab)) {
30-
setSelectedTab(tab);
31-
dispatch(setActiveTab(tab));
25+
const currentTab = tabs.findIndex((tab) => location.pathname.includes(tab.toLowerCase()));
26+
if (currentTab !== -1 && !disabledTabs.includes(currentTab)) {
27+
dispatch(setActiveTab(tabs[currentTab]));
3228
}
33-
};
29+
}, [location, dispatch, tabs, disabledTabs]);
3430

3531
return (
3632
<div className="header-subnav">
3733
<ul className="tabs">
3834
{tabs.map((tab, index) => (
39-
<li
40-
key={index}
41-
className={`${selectedTab === index ? 'active' : ''} ${
42-
disabledTabs.includes(index) ? 'disabled' : ''
43-
}`}
44-
onClick={() => {
45-
handleTabClick(index);
46-
}}>
47-
<span>{tab}</span>
48-
</li>
35+
<Link to={`/clean-air/${tab.toLowerCase()}`} key={index}>
36+
<li
37+
className={`${location.pathname.includes(tab.toLowerCase()) ? 'active' : ''} ${
38+
disabledTabs.includes(index) ? 'disabled' : ''
39+
}`}
40+
onClick={() => {
41+
if (!disabledTabs.includes(index)) {
42+
dispatch(setActiveTab(tab));
43+
}
44+
}}>
45+
<span>{tab}</span>
46+
</li>
47+
</Link>
4948
))}
5049
</ul>
5150
</div>

‎website/frontend/src/components/LanguageSwitcher.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ const LanguageSwitcher = () => {
8787
<div className="clean-air-link">
8888
<p className="desktop-view">
8989
{t('topBanners.languageSwitcher.cleanAirText')}
90-
<Link to="/clean-air">
90+
<Link to="/clean-air/about">
9191
<span>
9292
{t('topBanners.languageSwitcher.linkText')}
9393
<ArrowRightAltIcon

0 commit comments

Comments
 (0)