m/umami
1
0
Fork 0
mirror of https://github.com/kremalicious/umami.git synced 2025-02-14 21:10:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2119 from AkashRajpurohit/feat/country-flag-on-realtime-page

Browse Source 
feat: ✨ Country flag added on real time page
This commit is contained in:
Mike Cao 2023-07-14 22:27:11 -07:00 committed by GitHub
commit 1b46888d6a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/pages/realtime/RealtimeCountries.js
View File

@ -1,17 +1,26 @@
import { useCallback } from 'react';
import { useRouter } from 'next/router';
import DataTable from 'components/metrics/DataTable';
import useLocale from 'hooks/useLocale';
import useCountryNames from 'hooks/useCountryNames';
import useMessages from 'hooks/useMessages';
import classNames from 'classnames';
import styles from './RealtimeCountries.module.css';
export function RealtimeCountries({ data }) {
const { formatMessage, labels } = useMessages();
const { locale } = useLocale();
const countryNames = useCountryNames(locale);
const { basePath } = useRouter();
const renderCountryName = useCallback(
({ x }) => <span className={locale}>{countryNames[x]}</span>,
[countryNames, locale],
({ x: code }) => (
<span className={classNames(locale, styles.row)}>
<img src={`${basePath}/images/flags/${code?.toLowerCase() || 'xx'}.png`} alt={code} />
{countryNames[code]}
</span>
),
[countryNames, locale, basePath],
);
return (

5
components/pages/realtime/RealtimeCountries.module.css Normal file
View File

@ -0,0 +1,5 @@
.row {
display: flex;
align-items: center;
gap: 10px;
}