process constants which are returned in array

frontend/src/AppBuilder/_hooks/useAppData.js

@@ -16,7 +16,7 @@ import { usePrevious } from '@dnd-kit/utilities';
 import { deepCamelCase } from '@/_helpers/appUtils';
 import { useEventActions } from '../_stores/slices/eventsSlice';
 import useRouter from '@/_hooks/use-router';
-import { navigate } from '../_utils/misc';
+import { extractEnvironmentConstantsFromConstantsList, navigate } from '../_utils/misc';
 import { getWorkspaceId } from '@/_helpers/utils';
 import { shallow } from 'zustand/shallow';
 import { fetchAndSetWindowTitle, pageTitles, defaultWhiteLabellingSettings } from '@white-label/whiteLabelling';
@@ -176,6 +176,8 @@ const useAppData = (appId, moduleId, mode = 'edit', { environmentId, versionId }
           ? await orgEnvironmentConstantService.getConstantsFromPublicApp(slug)
           : await orgEnvironmentConstantService.getConstantsFromApp();
 
+      constantsResp.constants = extractEnvironmentConstantsFromConstantsList(constantsResp?.constants, 'production');
+
       const pages = appData.pages.map((page) => {
         return page;
       });

frontend/src/AppBuilder/_utils/misc.js

@@ -24,6 +24,26 @@ export async function copyToClipboard(text) {
   }
 }
 
+export const extractEnvironmentConstantsFromConstantsList = (constantsList = [], environmentName = 'development') => {
+  try {
+    return constantsList.map((constant) => {
+      if (constant.values && Array.isArray(constant.values)) {
+        const { value } = constant.values.find((value) => value.environmentName === environmentName);
+        return {
+          id: constant.id,
+          name: constant.name,
+          value,
+          type: constant.type,
+        };
+      } else {
+        return constant;
+      }
+    });
+  } catch (error) {
+    return [];
+  }
+};
+
 export function setTablePageIndex(tableId, index) {
   if (_.isEmpty(tableId)) {
     console.log('No table is associated with this event.');