feat(networks): quadrants locales

Author: ahonestla

client/src/pages/networks/components/clusters/quadrants.tsx

@@ -7,6 +7,7 @@ import { NetworkCommunities, NetworkItems } from "../../../../types/network"
 import { isInProduction } from "../../../../utils/helpers"
 import useOptions from "../../hooks/useOptions"
 import BaseSkeleton from "../../../../components/skeleton/base-skeleton"
+import { useIntl } from "react-intl"
 
 function NetworkNodesQuadrants({ nodes }: { nodes: NetworkItems }) {
   const [selectedCentrality, setSelectedCentrality] = useState("degreeCentrality")
@@ -73,6 +74,7 @@ function NetworkNodesQuadrants({ nodes }: { nodes: NetworkItems }) {
 
 function NetworkClustersQuadrants({ clusters }: { clusters: NetworkCommunities }) {
   const { currentModel } = useOptions()
+  const intl = useIntl()
 
   if (!clusters) return null
   const data = clusters?.map(({ label, color, metrics }) => ({
@@ -94,8 +96,8 @@ function NetworkClustersQuadrants({ clusters }: { clusters: NetworkCommunities }
     <Container fluid>
       {data && (
         <AnalyticsGraph
-          title="Communities quadrants"
-          description="Quadrants of the communities strategic diagram"
+          title={intl.formatMessage({ id: "networks.clusters.quadrants.title" })}
+          description={intl.formatMessage({ id: "networks.clusters.quadrants.description" })}
           options={quadrantOptions}
         />
       )}
@@ -104,6 +106,7 @@ function NetworkClustersQuadrants({ clusters }: { clusters: NetworkCommunities }
 }
 export default function NetworkQuadrants() {
   const { search } = useSearchData()
+  const intl = useIntl()
 
   if (!search?.data && search?.isFetching) return <BaseSkeleton width="100%" height="30rem" className="fr-my-1v" />
 
@@ -112,7 +115,7 @@ export default function NetworkQuadrants() {
       <NetworkClustersQuadrants clusters={search?.data?.network?.clusters} />
       {!isInProduction() && <NetworkNodesQuadrants nodes={search?.data?.network?.items} />}
       <Text className="fr-mt-1w fr-mb-3w fr-message fr-message--info" size="xs">
-        {`For more information about the strategic quadrants see the `}&nbsp;
+        {intl.formatMessage({ id: "networks.clusters.quadrants.faq-link" })}&nbsp;
         <Link href="/about/FAQ?question=q63">{"FAQ"}</Link>
       </Text>
     </Container>

client/src/pages/networks/locales/en.json

@@ -90,6 +90,9 @@
     "networks.clusters.tabs.items": "Communities",
     "networks.clusters.tabs.analytics": "Graphs",
     "networks.clusters.tabs.quadrants": "Quadrants",
+    "networks.clusters.quadrants.title": "Communities quadrants",
+    "networks.clusters.quadrants.description": "Quadrants of the communities strategic diagram",
+    "networks.clusters.quadrants.faq-link": "For more information on quadrants, see the",
     "networks.panel.button": "Communities information",
     "networks.search.error204.title": "No Result",
     "networks.search.error204.text": "This search returns no data.",

client/src/pages/networks/locales/fr.json

@@ -92,6 +92,9 @@
     "networks.clusters.tabs.items": "Communautés",
     "networks.clusters.tabs.analytics": "Graphiques",
     "networks.clusters.tabs.quadrants": "Quadrants",
+    "networks.clusters.quadrants.title": "Quadrants des communautés",
+    "networks.clusters.quadrants.description": "Quadrants du diagramme stratégique des communautés",
+    "networks.clusters.quadrants.faq-link": "Pour plus d'information sur les quadrants, consultez la",
     "networks.panel.button": "Informations des communautés",
     "networks.search.error204.title": "Pas de résultat",
     "networks.search.error204.text": "Cette recherche ne retourne aucune donnée.",