From ec5bf3c56ba7cb3b3de7cc8aecaafd9fcac567e0 Mon Sep 17 00:00:00 2001
From: Timo Tuominen <tituomin@gmail.com>
Date: Thu, 19 Oct 2023 18:03:30 +0300
Subject: [PATCH] Send current locale to insight api

---
 .../indicators/IndicatorCausalVisualisation.tsx    | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/components/indicators/IndicatorCausalVisualisation.tsx b/components/indicators/IndicatorCausalVisualisation.tsx
index b2853498..c820d051 100644
--- a/components/indicators/IndicatorCausalVisualisation.tsx
+++ b/components/indicators/IndicatorCausalVisualisation.tsx
@@ -2,6 +2,7 @@ import React, { ReactElement, useState, useEffect } from 'react';
 import styled from 'styled-components';
 import { usePlan } from 'context/plan';
 import { useTheme } from 'common/theme';
+import { useTranslation } from 'common/i18n';
 import { aplans } from 'common/api';
 import { Alert } from 'reactstrap';
 import { captureException } from 'common/sentry';
@@ -274,6 +275,7 @@ const InteractiveCausalChain = ({ nodes }) => {
 function IndicatorCausalVisualisation({ actionId }: Props) {
   const plan = usePlan();
   const isServer = typeof window === 'undefined';
+  const { i18n } = useTranslation();
 
   const [isLoaded, setIsLoaded] = useState(false);
   const [error, setError] = useState(null);
@@ -282,13 +284,13 @@ function IndicatorCausalVisualisation({ actionId }: Props) {
   useEffect(() => {
     // React advises to declare the async function directly inside useEffect
     async function fetchData() {
+      const params = {
+        plan: plan.identifier,
+        action: actionId,
+        language: i18n.language,
+      };
       aplans
-        .get('insight', {
-          params: {
-            plan: plan.identifier,
-            action: actionId,
-          },
-        })
+        .get('insight', { params })
         .then((result) => {
           setData(result);
           setIsLoaded(true);