diff --git a/frontend/src/components/homepage/stats.js b/frontend/src/components/homepage/stats.js index 1901fa35f4..c970ed5ed9 100644 --- a/frontend/src/components/homepage/stats.js +++ b/frontend/src/components/homepage/stats.js @@ -3,6 +3,7 @@ import shortNumber from 'short-number'; import messages from './messages'; import { useOsmStatsQuery, useSystemStatisticsQuery } from '../../api/stats'; +import StatsInfoFooter from '../statsInfoFooter'; export const StatsNumber = (props) => { const value = shortNumber(props.value); @@ -38,8 +39,10 @@ export const StatsSection = () => { const hasStatsLoaded = hasTmStatsLoaded && hasOsmStatsLoaded; return ( - <> -
+
+ + +
{ value={hasStatsLoaded ? tmStatsData.data.mappersOnline : undefined} />
- +
); }; diff --git a/frontend/src/components/partnerMapswipeStats/overview.js b/frontend/src/components/partnerMapswipeStats/overview.js index 0eeaf21818..eb88287fa6 100644 --- a/frontend/src/components/partnerMapswipeStats/overview.js +++ b/frontend/src/components/partnerMapswipeStats/overview.js @@ -30,7 +30,7 @@ export const formatSecondsToTwoUnits = (seconds, shortFormat = false) => { years: 'yrs', months: 'mos', weeks: 'wks', - days: 'ds', + days: 'days', hours: 'hrs', minutes: 'mins', seconds: 'secs', @@ -82,8 +82,11 @@ export const Overview = () => { customPlaceholder={} ready={!isLoading && !isRefetching} > +

+ {data?.nameInsideProvider} +

diff --git a/frontend/src/components/partnerMapswipeStats/swipesByOrganization.js b/frontend/src/components/partnerMapswipeStats/swipesByOrganization.js index 9209740dc3..7a94ae5956 100644 --- a/frontend/src/components/partnerMapswipeStats/swipesByOrganization.js +++ b/frontend/src/components/partnerMapswipeStats/swipesByOrganization.js @@ -80,11 +80,10 @@ export const SwipesByOrganization = ({ contributionsByOrganization = [] }) => { }, []); return ( -
+

-
{contributionsByOrganization.length === 0 && ( diff --git a/frontend/src/components/partnerMapswipeStats/swipesByProjectType.js b/frontend/src/components/partnerMapswipeStats/swipesByProjectType.js index 399c00f608..5d79f22cc6 100644 --- a/frontend/src/components/partnerMapswipeStats/swipesByProjectType.js +++ b/frontend/src/components/partnerMapswipeStats/swipesByProjectType.js @@ -82,7 +82,7 @@ export const SwipesByProjectType = ({ contributionsByProjectType = [] }) => { }, []); return ( -
+

diff --git a/frontend/src/components/partners/leaderboard.js b/frontend/src/components/partners/leaderboard.js index aeb2cb7087..c2cddd1920 100644 --- a/frontend/src/components/partners/leaderboard.js +++ b/frontend/src/components/partners/leaderboard.js @@ -4,10 +4,13 @@ import messages from '../../views/messages'; import { StatsSection } from './partnersStats'; import { Activity } from './partnersActivity'; import { CurrentProjects } from './currentProjects'; +import StatsInfoFooter from '../statsInfoFooter'; export const Leaderboard = ({ partner, partnerStats }) => { return (
+ +

{partner.primary_hashtag diff --git a/frontend/src/components/partners/partners.js b/frontend/src/components/partners/partners.js index 3557a5e7d0..2a01708188 100644 --- a/frontend/src/components/partners/partners.js +++ b/frontend/src/components/partners/partners.js @@ -95,7 +95,7 @@ export function PartnersCard({ details }) { - + { className={'w-25-l w-50-m w-100 mv1'} />

-
); }; diff --git a/frontend/src/components/projectStats/edits.js b/frontend/src/components/projectStats/edits.js index 9059c5ba76..b3bdb46d11 100644 --- a/frontend/src/components/projectStats/edits.js +++ b/frontend/src/components/projectStats/edits.js @@ -4,7 +4,7 @@ import projectMessages from './messages'; import userDetailMessages from '../userDetail/messages'; import { MappingIcon, HomeIcon, RoadIcon, EditIcon } from '../svgIcons'; import { StatsCard } from '../statsCard'; -import StatsTimestamp from '../statsTimestamp'; +import StatsInfoFooter from '../statsInfoFooter'; export const EditsStats = ({ data }) => { const { changesets, buildings, roads, edits } = data; @@ -18,30 +18,32 @@ export const EditsStats = ({ data }) => {

-
-
- } - description={} - value={changesets || 0} - /> - } - description={} - value={edits || 0} - /> - } - description={} - value={buildings || 0} - /> - } - description={} - value={roads || 0} - /> +
+ +
+ } + description={} + value={changesets || 0} + /> + } + description={} + value={edits || 0} + /> + } + description={} + value={buildings || 0} + /> + } + description={} + value={roads || 0} + /> +
); diff --git a/frontend/src/components/statsInfoFooter/index.jsx b/frontend/src/components/statsInfoFooter/index.jsx index abe69a640a..b3cf5a2ea3 100644 --- a/frontend/src/components/statsInfoFooter/index.jsx +++ b/frontend/src/components/statsInfoFooter/index.jsx @@ -2,27 +2,37 @@ import { useIntl } from 'react-intl'; import { useOsmStatsMetadataQuery } from '../../api/stats'; import { dateOptions } from '../statsTimestamp'; +import { InfoIcon } from '../svgIcons'; +import '../../views/partnersMapswipeStats.scss'; -export default function StatsInfoFooter() { +export default function StatsInfoFooter({ className }) { const intl = useIntl(); const { data: osmStatsMetadata } = useOsmStatsMetadataQuery(); return ( -
- - These statistics come from{' '} - - ohsomeNow Stats - {' '} - and were last updated at{' '} - {intl.formatDate(osmStatsMetadata?.max_timestamp, dateOptions)} ( - {intl.timeZone}). +
+ + + + These statistics come from{' '} + + ohsomeNow Stats + {' '} + and were last updated at{' '} + + {intl.formatDate(osmStatsMetadata?.max_timestamp, dateOptions)} + {' '} + ({intl.timeZone}) +
); diff --git a/frontend/src/components/teamsAndOrgs/featureStats.js b/frontend/src/components/teamsAndOrgs/featureStats.js index b5b31ca9c3..5522e0f66a 100644 --- a/frontend/src/components/teamsAndOrgs/featureStats.js +++ b/frontend/src/components/teamsAndOrgs/featureStats.js @@ -7,7 +7,7 @@ import userDetailMessages from '../userDetail/messages'; import { OHSOME_STATS_BASE_URL, defaultChangesetComment } from '../../config'; import { RoadIcon, HomeIcon, WavesIcon, MarkerIcon } from '../svgIcons'; import { StatsCard } from '../statsCard'; -import StatsTimestamp from '../statsTimestamp'; +import StatsInfoFooter from '../statsInfoFooter'; export const FeatureStats = () => { const [stats, setStats] = useState({ edits: 0, buildings: 0, roads: 0, pois: 0, waterways: 0 }); @@ -42,33 +42,36 @@ export const FeatureStats = () => {

-
- } - description={} - value={stats.buildings || 0} - className={'w-25-l w-50-m w-100 mv1'} - /> - } - description={} - value={stats.roads || 0} - className={'w-25-l w-50-m w-100 mv1'} - /> - } - description={} - value={stats.pois || 0} - className={'w-25-l w-50-m w-100 mv1'} - /> - } - description={} - value={stats.waterways || 0} - className={'w-25-l w-50-m w-100 mv1'} - /> + + +
+ } + description={} + value={stats.buildings || 0} + className={'w-25-l w-50-m w-100 mv1'} + /> + } + description={} + value={stats.roads || 0} + className={'w-25-l w-50-m w-100 mv1'} + /> + } + description={} + value={stats.pois || 0} + className={'w-25-l w-50-m w-100 mv1'} + /> + } + description={} + value={stats.waterways || 0} + className={'w-25-l w-50-m w-100 mv1'} + /> +
); diff --git a/frontend/src/components/userDetail/elementsMapped.js b/frontend/src/components/userDetail/elementsMapped.js index 1e1655c56f..6dc4b3bc31 100644 --- a/frontend/src/components/userDetail/elementsMapped.js +++ b/frontend/src/components/userDetail/elementsMapped.js @@ -125,6 +125,8 @@ export const ElementsMapped = ({ userStats, osmStats }) => { return (
+ +
{ unitLess={osmStats?.waterway?.modified?.unit_less} />
- -
); }; diff --git a/frontend/src/views/home.js b/frontend/src/views/home.js index 2d423e0b89..7b40ac7c5c 100644 --- a/frontend/src/views/home.js +++ b/frontend/src/views/home.js @@ -8,7 +8,6 @@ import { WhoIsMapping } from '../components/homepage/whoIsMapping'; import { Testimonials } from '../components/homepage/testimonials'; import { Alert } from '../components/alert'; import homeMessages from '../components/homepage/messages'; -import StatsTimestamp from '../components/statsTimestamp/'; export function Home() { return ( @@ -24,9 +23,6 @@ export function Home() { } > -
- -
diff --git a/frontend/src/views/partnersMapswipeStats.css b/frontend/src/views/partnersMapswipeStats.css deleted file mode 100644 index 3bf7e57d23..0000000000 --- a/frontend/src/views/partnersMapswipeStats.css +++ /dev/null @@ -1,17 +0,0 @@ -.mapswipe-stats-info-banner { - background-color: #d9d7d7; - width: fit-content; - margin-left: 20px; - border-radius: 3px; -} - -.mapswipe-stats-info-banner::before { - content: ''; - position: absolute; - left: -20px; - top: 0; - bottom: 0; - width: 20px; - background-color: #d9d7d7; - clip-path: polygon(100% 0, 0 50%, 100% 100%); -} diff --git a/frontend/src/views/partnersMapswipeStats.js b/frontend/src/views/partnersMapswipeStats.js index c9015d3640..b3b097b804 100644 --- a/frontend/src/views/partnersMapswipeStats.js +++ b/frontend/src/views/partnersMapswipeStats.js @@ -19,7 +19,7 @@ import { SwipesByProjectType } from '../components/partnerMapswipeStats/swipesBy import { SwipesByOrganization } from '../components/partnerMapswipeStats/swipesByOrganization'; import messages from './messages'; import { fetchLocalJSONAPI } from '../network/genericJSONRequest'; -import './partnersMapswipeStats.css'; +import './partnersMapswipeStats.scss'; const PagePlaceholder = () => (
@@ -46,7 +46,7 @@ const PagePlaceholder = () => ( const InfoBanner = () => { return ( -
+
@@ -141,16 +141,16 @@ export const PartnersMapswipeStats = () => {
-
+
{getSwipes()}
-
+
{getTimeSpentContributing()} @@ -158,7 +158,7 @@ export const PartnersMapswipeStats = () => {
-
+
{ const [partnerStats, setPartnerStats] = useState(null); const [error, loading, partner] = useFetch(`partners/${id}/`); - // navigate to /leaderboard path when no tab param present - useEffect(() => { - if (!tabname) { - navigate('leaderboard'); - } - }, [navigate, tabname]); - const fetchData = async (name) => { try { let hashtag = name.trim(); @@ -73,12 +66,10 @@ export const PartnersStats = () => { function getTabContent() { switch (tabname) { - case 'leaderboard': - return ; case 'mapswipe': return ; default: - return <>; + return ; } } @@ -86,6 +77,13 @@ export const PartnersStats = () => { .filter((key) => key.startsWith('link')) .filter((link) => partner[link]); + // remove Map Swipe tab if mapswipe_group_id not present + const modifiedTabData = !partner?.mapswipe_group_id + ? tabData.filter((tab) => tab.id !== 'mapswipe') + : tabData; + + const activeTab = tabname === 'mapswipe' ? 'mapswipe' : 'leaderboard'; + return ( { )}
- {tabData.map(({ id: tabId, title }) => ( + {modifiedTabData.map(({ id: tabId, title }) => (
navigate(`/partners/${id}/stats/${tabId}`)} + onClick={() => + tabId === 'leaderboard' + ? navigate(`/partners/${id}/stats`) + : navigate(`/partners/${id}/stats/${tabId}`) + } onKeyDown={() => {}} >

{title}