diff --git a/client/src/components/report-center-modal/test.jsx b/client/src/components/report-center-modal/test.jsx
index 3aa16db5f..8217e5e5a 100644
--- a/client/src/components/report-center-modal/test.jsx
+++ b/client/src/components/report-center-modal/test.jsx
@@ -3,7 +3,6 @@ import React, { useEffect, useState } from "react";
 import { fetchFilterData } from "../../utils/RenderTemplate";
 import { DeleteFilled } from "@ant-design/icons";
 import { useTranslation } from "react-i18next";
-import jsonic from 'jsonic';
 
 export default function Test({ form }) {
   return (
@@ -24,7 +23,7 @@ function RenderFilters({ templateId }) {
     const fetch = async () => {
       const data = await fetchFilterData({ name: templateId });
       console.log("🚀 ~ fetch ~ data:", data);
-      setState(jsonic(data));
+      setState(JSON.parse(data));
     };
 
     console.log("🚀 ~ useEffect ~ templateId:", templateId);
diff --git a/client/src/utils/RenderTemplate.js b/client/src/utils/RenderTemplate.js
index f7ecf4c71..ace028164 100644
--- a/client/src/utils/RenderTemplate.js
+++ b/client/src/utils/RenderTemplate.js
@@ -385,6 +385,9 @@ const fetchContextData = async (templateObject, jsrAuth) => {
     templateQueryToExecute = atob(generalTemplate.content);
   }
 
+  // TODO: REPORT UPDATE
+  //TemplateQueryToExecute needs to get modified based on sorters/filters set by user from modal.
+
   let contextData = {};
   if (templateQueryToExecute) {
     const { data } = await client.query({