From 04309034836028802b5bd7be4e7535b8804f6f6e Mon Sep 17 00:00:00 2001
From: Maxime-J <Maxime-J@users.noreply.github.com>
Date: Thu, 2 Nov 2023 14:47:28 +0000
Subject: [PATCH] localize filter tags

---
 src/components/metrics/FilterTags.js         | 4 +++-
 src/components/metrics/FilterTags.module.css | 4 ++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/metrics/FilterTags.js b/src/components/metrics/FilterTags.js
index 554c223a..db8fdcbd 100644
--- a/src/components/metrics/FilterTags.js
+++ b/src/components/metrics/FilterTags.js
@@ -2,10 +2,12 @@ import { safeDecodeURI } from 'next-basics';
 import { Button, Icon, Icons, Text } from 'react-basics';
 import useNavigation from 'components/hooks/useNavigation';
 import useMessages from 'components/hooks/useMessages';
+import useFormat from 'components/hooks/useFormat';
 import styles from './FilterTags.module.css';
 
 export function FilterTags({ params }) {
   const { formatMessage, labels } = useMessages();
+  const { formatValue } = useFormat();
   const {
     router,
     makeUrl,
@@ -34,7 +36,7 @@ export function FilterTags({ params }) {
         return (
           <div key={key} className={styles.tag} onClick={() => handleCloseFilter(key)}>
             <Text>
-              <b>{`${key}`}</b> = {`${safeDecodeURI(params[key])}`}
+              <b>{formatMessage(labels[key])}</b> = {formatValue(safeDecodeURI(params[key]), key)}
             </Text>
             <Icon>
               <Icons.Close />
diff --git a/src/components/metrics/FilterTags.module.css b/src/components/metrics/FilterTags.module.css
index c228dc4e..32bc2f6f 100644
--- a/src/components/metrics/FilterTags.module.css
+++ b/src/components/metrics/FilterTags.module.css
@@ -24,3 +24,7 @@
 .tag:hover {
   background: var(--blue200);
 }
+
+.tag b {
+  text-transform: lowercase;
+}