@argusoft/medplat-app-shell 1.0.6 → 1.0.8

package/src/common/fontPreferences/fontSizeProvider.jsx

@@ -0,0 +1,34 @@
+import PropTypes from 'prop-types';
+import { createContext, useContext, useEffect, useMemo, useState } from 'react';
+
+const FontSizeContext = createContext();
+
+export const FontSizeProvider = ({ children }) => {
+  const storedFontSize = Number(localStorage.getItem('fontSize')) || 2; // Default to "Medium"
+  const [fontSize, setFontSize] = useState(storedFontSize);
+
+  useEffect(() => {
+    let root = document.documentElement;
+
+    const fontSizeValues = {
+      1: 14, // px
+      2: 16,
+      3: 18,
+      4: 20,
+    };
+    const baseSize = fontSizeValues[fontSize];
+    root.style.setProperty('--base-font-size', `${baseSize}px`);
+
+    localStorage.setItem('fontSize', fontSize.toString());
+  }, [fontSize]);
+
+  const contextValue = useMemo(() => ({ fontSize, setFontSize }), [fontSize]);
+
+  return <FontSizeContext.Provider value={contextValue}>{children}</FontSizeContext.Provider>;
+};
+
+FontSizeProvider.propTypes = {
+  children: PropTypes.node,
+};
+
+export const useFontSize = () => useContext(FontSizeContext);

package/src/common/fontPreferences/fontSizeSelector.jsx

@@ -0,0 +1,116 @@
+import { Box, Typography } from '@mui/material';
+import { alpha, useTheme } from '@mui/material/styles';
+import { useFontSize } from './fontSizeProvider';
+
+const FontSizeSelectorWrapper = () => {
+  const { fontSize, setFontSize } = useFontSize();
+  const theme = useTheme();
+  const isDark = theme.palette.mode === 'dark';
+
+  const fontSizeArray = [
+    { id: 1, label: 'Small', size: 'text-[12px]' },
+    { id: 2, label: 'Medium', size: 'text-[14px]' },
+    { id: 3, label: 'Large', size: 'text-[16px]' },
+    { id: 4, label: 'Extra Large', size: 'text-[18px]' },
+  ];
+
+  const activeFont = fontSizeArray[fontSize - 1] || fontSizeArray[1];
+
+  return (
+    <Box
+      sx={{
+        mx: 2,
+        mb: 1.2,
+        p: 1.35,
+        borderRadius: '16px',
+        border: `1px solid ${theme.palette.custom?.shellBorder}`,
+        background: isDark ? alpha('#fff', 0.03) : alpha('#0f172a', 0.025),
+      }}
+    >
+      <Box className="flex items-start justify-between gap-3">
+        <Box>
+          <Typography variant="body2" sx={{ fontWeight: 700, color: theme.palette.text.primary }}>
+            Font Size
+          </Typography>
+        </Box>
+        <Box
+          sx={{
+            px: 0.95,
+            py: 0.35,
+            borderRadius: '999px',
+            background: isDark
+              ? alpha(theme.palette.custom?.shellAccent || '#4da8da', 0.18)
+              : alpha(theme.palette.custom?.shellAccent || '#1c6fb7', 0.1),
+            color: theme.palette.text.primary,
+            fontSize: '0.68rem',
+            fontWeight: 700,
+          }}
+        >
+          {activeFont.label}
+        </Box>
+      </Box>
+
+      <Box
+        sx={{
+          mt: 1,
+          display: 'grid',
+          gridTemplateColumns: 'repeat(2, minmax(0, 1fr))',
+          gap: 0.8,
+        }}
+      >
+        {fontSizeArray.map((option) => {
+          const isActive = option.id === fontSize;
+
+          return (
+            <Box
+              key={option.id}
+              component="button"
+              type="button"
+              onClick={() => setFontSize(option.id)}
+              sx={{
+                border: 'none',
+                textAlign: 'left',
+                p: 1,
+                borderRadius: '12px',
+                cursor: 'pointer',
+                transition: 'all 180ms ease',
+                background: isActive
+                  ? isDark
+                    ? alpha(theme.palette.custom?.shellAccent || '#4da8da', 0.2)
+                    : alpha(theme.palette.custom?.shellAccent || '#1c6fb7', 0.12)
+                  : isDark
+                    ? alpha('#fff', 0.04)
+                    : alpha('#0f172a', 0.03),
+                color: theme.palette.text.primary,
+                boxShadow: isActive
+                  ? isDark
+                    ? '0 10px 22px rgba(2, 8, 23, 0.22)'
+                    : '0 10px 22px rgba(148, 163, 184, 0.16)'
+                  : 'none',
+                '&:hover': {
+                  background: isDark
+                    ? alpha(theme.palette.custom?.shellAccent || '#4da8da', isActive ? 0.24 : 0.12)
+                    : alpha(theme.palette.custom?.shellAccent || '#1c6fb7', isActive ? 0.14 : 0.08),
+                },
+              }}
+            >
+              <Typography
+                sx={{
+                  fontWeight: 700,
+                  fontSize: '0.8rem',
+                }}
+              >
+                {option.label}
+              </Typography>
+              <Typography variant="caption" sx={{ color: theme.palette.custom?.shellMuted, fontSize: '0.68rem' }}>
+                {12 + (option.id - 1) * 2}px
+              </Typography>
+            </Box>
+          );
+        })}
+      </Box>
+    </Box>
+  );
+};
+
+export default FontSizeSelectorWrapper;

package/src/common/getAssignedFeature/getAssignedFeature.js

@@ -0,0 +1,32 @@
+import { showToast } from '@/common/toaster/toaster';
+export const getAssignedFeature = async (state, linearMenuItems) => {
+  try {
+    if (linearMenuItems[state] != null && !linearMenuItems[state].systemConstraintConfigs) {
+      // const [config, webTemplateConfigResponse] = await Promise.all([
+      //   systemConstraintConfigs(linearMenuItems[state].id),
+      //   webTemplateConfig(linearMenuItems[state].id),
+      // ]);
+
+      const assignedFeature = {
+        ...linearMenuItems[state],
+        // systemConstraintConfigs: config.data,
+        // webTemplateConfigs: webTemplateConfigResponse.data,
+      };
+      return assignedFeature;
+    } else {
+      const newState = state.replace(/^techo(?=\.)/, 'medplat');
+      if (linearMenuItems[newState] != null && !linearMenuItems[newState].systemConstraintConfigs) {
+        const assignedFeature = {
+          ...linearMenuItems[newState],
+        };
+        return assignedFeature;
+      }
+    }
+  } catch (error) {
+    console.error(error);
+    showToast({
+      message: 'Not able to fetch Assigned Features',
+      type: 'error',
+    });
+  }
+};

package/src/common/interceptors/AxiosInterceptor.js

@@ -0,0 +1,216 @@
+import axios from 'axios';
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { useLoader } from '@/layout/LoaderContext';
+import useRefreshToken from '@/hooks/useRefreshToken';
+import PropTypes from 'prop-types';
+import APP_CONFIG from '@/common/constants/app.constant';
+import { showToast } from '@/common/toaster/toaster';
+import { v4 as uuidv4 } from 'uuid';
+import GeneralUtil from '@/common/services/util/GeneralUtil';
+
+const api = axios.create({
+  baseURL: APP_CONFIG.apiPath,
+});
+
+let loaderDisabled = false;
+export const setGlobalLoaderDisabled = (value) => {
+  loaderDisabled = value;
+};
+
+const isLoaderDisabledRoute = () => loaderDisabled;
+
+const AxiosInterceptor = ({ children }) => {
+  const [isLoaded, setIsLoaded] = useState(false);
+  const { showLoader, hideLoader } = useLoader();
+  const [pendingApiCalls, setPendingApiCalls] = useState(0);
+  const [loaderStartTime, setLoaderStartTime] = useState(null);
+  const { manualRefresh, refreshToken } = useRefreshToken({});
+
+  const showLoaderRef = useRef(showLoader);
+  const hideLoaderRef = useRef(hideLoader);
+  const manualRefreshRef = useRef(manualRefresh);
+  const refreshTokenRef = useRef(refreshToken);
+
+  // Use Refs for synchronous access inside interceptors to avoid race conditions
+  const pendingApiCallsRef = useRef(0);
+  const loaderStartTimeRef = useRef(null);
+
+  useEffect(() => {
+    showLoaderRef.current = showLoader;
+    hideLoaderRef.current = hideLoader;
+    manualRefreshRef.current = manualRefresh;
+    refreshTokenRef.current = refreshToken;
+  }, [showLoader, hideLoader, manualRefresh, refreshToken]);
+
+  useEffect(() => {
+    if (pendingApiCalls === 0 && loaderStartTime) {
+      const elapsed = new Date().getTime() - loaderStartTime;
+      const remainingTime = Math.max(0, 500 - elapsed);
+      const t = setTimeout(() => {
+        hideLoaderRef.current();
+        setLoaderStartTime(null);
+        loaderStartTimeRef.current = null;
+      }, remainingTime);
+      return () => clearTimeout(t);
+    }
+  }, [pendingApiCalls, loaderStartTime]);
+
+  const safeParse = (val) => {
+    if (!val) return null;
+    try {
+      return JSON.parse(val);
+    } catch (e) {
+      console.error('Invalid token JSON in localStorage:', val, e);
+      return null;
+    }
+  };
+
+  const reqInterceptor = useCallback(
+    async (config) => {
+      config.headers = config.headers || {};
+
+      const tokenString = localStorage.getItem('token');
+      let token = safeParse(tokenString);
+      const pathname = window.location.pathname;
+      const disableLoaderForRoute = isLoaderDisabledRoute(pathname);
+
+      if (token) {
+        try {
+          // Proactively refresh the token if it's been 10 minutes or is close to expiring
+          await manualRefreshRef.current(token);
+          const updatedTokenString = localStorage.getItem('token');
+          token = safeParse(updatedTokenString) || token;
+        } catch (e) {
+          console.error('Proactive refresh failed', e);
+        }
+      }
+
+      config.headers['X-Client-Date-Time'] = GeneralUtil.formatLocalDateTime();
+
+      pendingApiCallsRef.current += 1;
+      setPendingApiCalls(pendingApiCallsRef.current);
+
+      if (config?.showLoader !== false && !disableLoaderForRoute) {
+        if (!loaderStartTimeRef.current) {
+          const now = new Date().getTime();
+          loaderStartTimeRef.current = now;
+          setLoaderStartTime(now);
+        }
+        showLoaderRef.current();
+      }
+      if (token?.access_token) {
+        config.headers['Authorization'] = `Bearer ${token.access_token}`;
+        config.headers['Pageid'] = config.headers['Pageid'] || uuidv4();
+        if (!config.headers['Content-Type']) {
+          config.type === 'fileUpload'
+            ? (config.headers['Content-Type'] = 'multipart/form-data')
+            : (config.headers['Content-Type'] = 'application/json');
+        }
+      }
+      return config;
+    },
+    [] // Stable dependencies
+  );
+
+  const reqErrInterceptor = useCallback((error) => {
+    pendingApiCallsRef.current = Math.max(0, pendingApiCallsRef.current - 1);
+    setPendingApiCalls(pendingApiCallsRef.current);
+    return Promise.reject(error.config || error);
+  }, []);
+
+  const resInterceptor = useCallback((response) => {
+    pendingApiCallsRef.current = Math.max(0, pendingApiCallsRef.current - 1);
+    setPendingApiCalls(pendingApiCallsRef.current);
+    return response;
+  }, []);
+
+  const resErrInterceptor = useCallback(
+    async (error) => {
+      const originalRequest = error?.config;
+      const response = error?.response;
+      const status = response?.status;
+
+      // Decrement pending calls as this specific request attempt has completed (even if with error)
+      pendingApiCallsRef.current = Math.max(0, pendingApiCallsRef.current - 1);
+      setPendingApiCalls(pendingApiCallsRef.current);
+
+      if (originalRequest) {
+        originalRequest.headers = originalRequest.headers || {};
+      }
+
+      // Handle 401 Unauthorized - trigger token refresh and retry
+      if (status === 401 && !originalRequest?._retry) {
+        originalRequest._retry = true;
+        try {
+          const tokenString = localStorage.getItem('token');
+          const token = safeParse(tokenString);
+          
+          if (token) {
+            // Wait for the token refresh (singleton logic is handled in the hook)
+            await refreshTokenRef.current(token);
+            
+            // Get the updated token after refresh
+            const updatedTokenString = localStorage.getItem('token');
+            const newAccessToken = safeParse(updatedTokenString);
+
+            if (newAccessToken?.access_token) {
+              originalRequest.headers['Authorization'] = `Bearer ${newAccessToken.access_token}`;
+              // Re-issue the request. api(originalRequest) will increment pendingApiCalls again in reqInterceptor.
+              return api(originalRequest);
+            }
+          }
+        } catch (refreshError) {
+          console.error('Refresh token failed in interceptor', refreshError);
+          // If refresh fails, useRefreshToken already handles logout/redirect
+          return Promise.reject(refreshError);
+        }
+      } else if (status === 400) {
+        if (
+          response?.data?.error === 'invalid_grant' &&
+          response?.data?.error_description?.indexOf('Invalid refresh token') >= 0
+        ) {
+          showToast({ message: 'Session Expired', type: 'error' });
+        }
+      } else if (status === -1) {
+        if (error.response) {
+          error.response.data = {
+            error: 'server_unreachable',
+            error_description: 'Server unreachable, please try after some time.',
+            message: 'Server unreachable, please try after some time.',
+          };
+        }
+      } else if (!status) {
+        error.response = {
+          data: {
+            error: 'reason_unknown',
+            error_description: 'Something went wrong, please try after some time or refresh.',
+            message: 'Something went wrong, please try after some time or refresh.',
+          },
+        };
+      }
+      
+      return Promise.reject(error);
+    },
+    [] // Stable dependencies
+  );
+
+  useEffect(() => {
+    const reqInterceptorEject = api.interceptors.request.use(reqInterceptor, reqErrInterceptor);
+    const resInterceptorEject = api.interceptors.response.use(resInterceptor, resErrInterceptor);
+
+    setIsLoaded(true);
+
+    return () => {
+      api.interceptors.request.eject(reqInterceptorEject);
+      api.interceptors.response.eject(resInterceptorEject);
+    };
+  }, [reqInterceptor, reqErrInterceptor, resInterceptor, resErrInterceptor]);
+
+  return isLoaded ? children : null;
+};
+
+AxiosInterceptor.propTypes = {
+  children: PropTypes.any,
+};
+
+export { AxiosInterceptor, api };

package/src/common/languageTranslator/TranslationContext.js

@@ -0,0 +1,5 @@
+import { createContext, useContext } from 'react';
+
+export const TranslationContext = createContext();
+
+export const useTranslateProvider = () => useContext(TranslationContext);

package/src/common/languageTranslator/TranslationProvider.jsx

@@ -0,0 +1,24 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { TranslationContext } from './TranslationContext';
+
+const TranslationProvider = ({ children }) => {
+  const { t } = useTranslation();
+
+  const translate = (value) => {
+    const key = typeof value === "string" ? value?.replace(/\s+/g, '') : value;
+    const translatedValue = t(key);
+    return translatedValue !== key ? translatedValue : value;
+  };
+
+  const contextValue = React.useMemo(() => ({ translate }), [translate]);
+
+  return <TranslationContext.Provider value={contextValue}>{children}</TranslationContext.Provider>;
+};
+
+TranslationProvider.propTypes = {
+  children: PropTypes.node,
+};
+
+export default TranslationProvider;

package/src/common/languageTranslator/i18n.js

@@ -0,0 +1,49 @@
+// i18n.js
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+
+const buildResources = (translations = {}) => {
+  const resources = {};
+
+  Object.entries(translations || {}).forEach(([langKey, namespaces]) => {
+    resources[langKey] = {
+      translation: Object.values(namespaces || {}).reduce((acc, obj) => ({ ...acc, ...obj }), {}),
+    };
+  });
+
+  if (!resources.en) {
+    resources.en = { translation: {} };
+  }
+
+  return resources;
+};
+
+export const initializeI18n = (translations, preferredLanguage) => {
+  const resources = buildResources(translations);
+  const language = preferredLanguage || 'en';
+
+  if (i18n.isInitialized) {
+    Object.entries(resources).forEach(([langKey, namespaces]) => {
+      i18n.removeResourceBundle(langKey, 'translation');
+      i18n.addResourceBundle(langKey, 'translation', namespaces.translation, true, true);
+    });
+
+    // Always call changeLanguage so react-i18next re-evaluates translations
+    // after resource bundles are updated — even if the language key hasn't changed.
+    i18n.changeLanguage(language);
+
+    return i18n;
+  }
+
+  i18n.use(initReactI18next).init({
+    resources,
+    lng: language,
+    fallbackLng: 'en',
+    interpolation: {
+      escapeValue: false, // React already escapes strings
+    },
+    nsSeparator: false,
+  });
+
+  return i18n;
+};

package/src/common/services/AuthenticateService.js

@@ -0,0 +1,116 @@
+import APP_CONFIG from '@/common/constants/app.constant';
+import { api as API } from '@/common/interceptors/AxiosInterceptor';
+import axios from 'axios';
+
+import GeneralUtil from '@/common/services/util/GeneralUtil';
+
+let clientId = 'imtecho-ui';
+let clientSecret = 'imtecho-ui-secret';
+let basePath = APP_CONFIG.serverPath;
+let encryptionKey;
+let initVector;
+
+const encodedClienSecret = btoa(clientId + ':' + clientSecret);
+const encrypt = async (data) => {
+  try {
+    return await GeneralUtil.getEncodedData(encryptionKey, initVector, data);
+  } catch (error) {
+    console.error(error);
+    return null;
+  }
+};
+
+export const getSystemNotice = async () => {
+  return await API.get('/mobile/systemNotice');
+};
+
+export const getApkInfo = async () => {
+  return await API.get('/mobile/apkInfo');
+};
+
+export const getKeyAndIV = async () => {
+  try {
+    const response = await API.get('/login/get-key-and-iv', {
+      withCredentials: true, // Important!
+    });
+    encryptionKey = response.data.key;
+    initVector = response.data.initVector;
+    return;
+  } catch (error) {
+    console.error(error);
+    return null;
+  }
+};
+
+export const loginService = async (userName, password, loginAs, totpCode) => {
+  await getKeyAndIV();
+  const data = new URLSearchParams({
+    grant_type: 'password',
+    username: await encrypt(userName),
+    password: await encrypt(password),
+    loginas: loginAs,
+    client_id: clientId,
+  });
+  // Two-factor authentication code (Google Authenticator). Sent on the second login attempt
+  // when the backend has signalled that 2FA is required for this user.
+  if (totpCode) {
+    data.append('totp_code', totpCode);
+  }
+  const config = {
+    headers: {
+      Authorization: 'Basic ' + encodedClienSecret,
+      'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
+      'X-Client-Date-Time': GeneralUtil.formatLocalDateTime(),
+    },
+    withCredentials: true,
+  };
+  return await axios.post(basePath + '/oauth/token', data, config);
+};
+
+export const getLoggedInUser = async () => {
+  let reqForUser = {
+    method: 'GET',
+    url: '/login/principle',
+  };
+  return await API(reqForUser);
+};
+
+export const getFeatures = async () => {
+  return await API.get('/login/menu');
+};
+
+export const getFeaturesV2 = async () => {
+  return await API.get('/login/menuV2');
+};
+
+export const refreshAccessToken = async (token) => {
+  if (token) {
+    let data = new URLSearchParams({
+      grant_type: 'refresh_token',
+      refresh_token: token.refresh_token,
+    });
+
+    const config = {
+      headers: {
+        Authorization: 'Basic ' + encodedClienSecret,
+        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
+        'X-Client-Date-Time': GeneralUtil.formatLocalDateTime(),
+      },
+    };
+    const response = await axios.post(basePath + '/oauth/token', data, config);
+
+    return response.data;
+  }
+  return null;
+};
+
+export const logout = async (data) => {
+  const doNotsendUserName =
+    GeneralUtil.isBahaar || GeneralUtil.isSewaRural || GeneralUtil.isMedplat || GeneralUtil.isPhmp;
+
+  if (doNotsendUserName) {
+    return API.post(`/user/logout?clientId=${data?.clientId}`);
+  } else {
+    return API.get(`/user/logout?clientId=${data?.clientId}&userName=${data?.userName}`);
+  }
+};

package/src/common/services/DownloadFile.js

@@ -0,0 +1,35 @@
+import { fileTypeFromBlob } from 'file-type';
+import { FormConfiguratorService } from '@/common/services/FormConfiguratorService';
+
+const downloadFile = async (versionReferenceUUID, mediaUUID) => {
+  try {
+    const response = (await FormConfiguratorService.getFile(versionReferenceUUID, mediaUUID)).data;
+    let fileType = await fileTypeFromBlob(response);
+    const dataUrl = URL.createObjectURL(response);
+
+    let image = null;
+    if (!fileType) {
+      fileType = {};
+      console.warn('File type is undefined. Defaulting to base64 encoding.');
+      fileType.mime = 'application/xml';
+    }
+
+    if (fileType.mime === 'application/xml') {
+      image = await blobToBase64(response);
+    }
+    return { fileType, dataUrl, image };
+  } catch (error) {
+    console.error('Error:', error);
+  }
+};
+
+const blobToBase64 = (blob) => {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onloadend = () => resolve(reader.result); // Base64 string
+    reader.onerror = reject;
+    reader.readAsDataURL(blob); // Converts blob to Base64
+  });
+};
+
+export default downloadFile;

package/src/common/services/ForgotPassword.js

@@ -0,0 +1,18 @@
+import { api } from '@/common/interceptors/AxiosInterceptor';
+import GeneralUtil from './util/GeneralUtil';
+
+export const forgotPasswordGenerateOTP = (params) => {
+    if (GeneralUtil.isTecho) {
+        return api.put('auth/forgotpassword/generateotp', params);
+    } else {
+        return api.post('auth/forgotpassword/generateotp', params);
+    }
+}
+
+export const forgotPasswordVerifyOTP = (params) => {
+    if (GeneralUtil.isTecho) {
+        return api.put('auth/forgotpassword/verifyotp', params);
+    } else {
+        return api.post('auth/forgotpassword/verifyotp', params);
+    }
+}