♻️ small refactor

src/common/components/Module.jsx

@@ -9,12 +9,13 @@ import Text from './Text';
 import Icon from './Icon';
 // import Link from './NextChakraLink';
 import ModalInfo from '../../js_modules/moduleMap/modalInfo';
+import { addQueryToURL } from '../../utils';
 
 function Module({
   onClickHandler, data, containerStyle, leftContentStyle, containerPX, width, currIndex,
   isDone, rightItemHandler, link, textWithLink, mandatory, onDisabledClick,
 }) {
-  const { t } = useTranslation('dashboard');
+  const { t, lang } = useTranslation('dashboard');
   const containerBackground = isDone ? useColorModeValue('featuredLight', 'featuredDark') : useColorModeValue('white', 'primary');
   const commonFontColor = useColorModeValue('gray.600', 'gray.200');
   const [openModal, setOpenModal] = useState(false);
@@ -49,7 +50,7 @@ function Module({
         title={t('modules.target-blank-title')}
         isReadonly
         description={t('modules.target-blank-msg', { title: data.title })}
-        link={data.url}
+        link={addQueryToURL(data.url, { lang })}
         handlerText={t('common:open')}
         closeText={t('common:close')}
         closeButtonVariant="outline"
@@ -212,7 +213,7 @@ Module.propTypes = {
   onDisabledClick: PropTypes.func,
 };
 Module.defaultProps = {
-  onClickHandler: () => {},
+  onClickHandler: () => { },
   data: {},
   containerStyle: {},
   leftContentStyle: {},
@@ -224,7 +225,7 @@ Module.defaultProps = {
   isDone: false,
   currIndex: null,
   mandatory: false,
-  onDisabledClick: () => {},
+  onDisabledClick: () => { },
 };
 
 export default Module;

src/js_modules/syllabus/ProjectInstructions.jsx

@@ -23,6 +23,7 @@ import Heading from '../../common/components/Heading';
 import ModalToCloneProject from './ModalToCloneProject';
 import Text from '../../common/components/Text';
 import Icon from '../../common/components/Icon';
+import { addQueryToURL } from '../../utils';
 
 function ProvisioningPopover({ openInLearnpackAction, provisioningLinks }) {
   return (
@@ -66,7 +67,7 @@ function ProvisioningPopover({ openInLearnpackAction, provisioningLinks }) {
 }
 
 function ButtonsHandler({ currentAsset, setShowCloneModal, vendors, handleStartLearnpack, isForOpenLocaly, startWithLearnpack, variant }) {
-  const { t } = useTranslation('common');
+  const { t, lang } = useTranslation('common');
   const { state } = useCohortHandler();
   const { cohortSession } = state;
   const openInLearnpackAction = t('learnpack.open-in-learnpack-button', {}, { returnObjects: true });
@@ -94,7 +95,7 @@ function ButtonsHandler({ currentAsset, setShowCloneModal, vendors, handleStartL
 
   if (isExternalExercise) {
     return (
-      <Button cursor="pointer" as="a" href={currentAsset.url} target="_blank" size="sm" padding="4px 8px" fontSize="14px" fontWeight="500" background="gray.200" color="blue.default">
+      <Button cursor="pointer" as="a" href={addQueryToURL(currentAsset.url, { lang })} target="_blank" size="sm" padding="4px 8px" fontSize="14px" fontWeight="500" background="gray.200" color="blue.default">
         {t('common:learnpack.start-exercise')}
       </Button>
     );

src/pages/syllabus/[cohortSlug]/[lesson]/[lessonSlug]/index.jsx

@@ -8,7 +8,7 @@ import {
 import useTranslation from 'next-translate/useTranslation';
 import { useRouter } from 'next/router';
 import Head from 'next/head';
-import { isWindow, assetTypeValues, getExtensionName, getStorageItem, languageFix } from '../../../../../utils';
+import { isWindow, assetTypeValues, getExtensionName, getStorageItem, languageFix, addQueryToURL } from '../../../../../utils';
 import asPrivate from '../../../../../common/context/PrivateRouteWrapper';
 import Heading from '../../../../../common/components/Heading';
 import useModuleHandler from '../../../../../common/hooks/useModuleHandler';
@@ -420,7 +420,6 @@ function SyllabusContent() {
 
       if (currTask?.target === 'blank') {
         setCurrentAsset(data);
-        return;
       }
 
       setReadmeUrlPathname(finalPathname);
@@ -1462,7 +1461,7 @@ function SyllabusContent() {
         title={t('dashboard:modules.target-blank-title')}
         isReadonly
         description={t('dashboard:modules.target-blank-msg', { title: clickedPage?.title || currentBlankProps?.title })}
-        link={inputModalLink}
+        link={addQueryToURL(inputModalLink, { lang })}
         handlerText={t('common:open')}
         closeText={t('common:close')}
         closeButtonVariant="outline"

src/utils/index.js

@@ -1,6 +1,7 @@
 /* eslint-disable indent */
 import { addDays, format, isAfter } from 'date-fns';
 import { es } from 'date-fns/locale';
+import { parseQuerys } from './url';
 
 const isWindow = typeof window !== 'undefined';
 
@@ -294,6 +295,14 @@ const getQueryString = (key, def) => {
   return urlParams && (urlParams.get(key) || def);
 };
 
+const addQueryToURL = (url, params = {}) => {
+  const urlObj = new URL(url, window.location.origin);
+  const querys = parseQuerys(params);
+
+  if (Array.from(urlObj.searchParams).length > 0) return `${url}&${querys.slice(1)}`;
+  return `${url}${querys}`;
+};
+
 const createArray = (length) => Array.from({ length }, (_, i) => i);
 const lengthOfString = (string) => (typeof string === 'string' ? string?.replaceAll(/\s/g, '').length : 0);
 
@@ -431,5 +440,5 @@ export {
   sortToNearestTodayDate, isNumber, isDateMoreThanAnyDaysAgo, getQueryString, isValidDate,
   createArray, url, lengthOfString, syncInterval, getBrowserSize, calculateDifferenceDays, intervalToHours, capitalizeFirstLetter,
   adjustNumberBeetwenMinMax, getDiscountedPrice, formatPrice, cleanObject, slugToTitle, decodeBase64,
-  removeSessionStorageItem, languageFix,
+  removeSessionStorageItem, languageFix, addQueryToURL,
 };