Merge branch 'testing'

configs/SecurityHeaders.js

@@ -11,7 +11,7 @@
 */
 const ContentSecurityPolicy = `
   default-src 'self' *.qurancdn.com cdn.plaid.com;
-  script-src 'self' 'unsafe-inline' 'unsafe-eval' https://www.googletagmanager.com https://www.google-analytics.com https://ssl.google-analytics.com https://vitals.vercel-insights.com  https://www.givingloop.org https://code.jquery.com https://www.google.com https://js.stripe.com https://ipinfo.io https://snap.licdn.com https://cdn.mouseflow.com https://www.paypal.com  https://wchat.eu.freshchat.com https://cdn.plaid.com https://cdnjs.cloudflare.com https://cdn.amplitude.com https://cdn.logrocket.io https://www.gstatic.com https://js.stripe.com;
+  script-src 'self' 'unsafe-inline' 'unsafe-eval' https://www.googletagmanager.com https://www.google-analytics.com https://ssl.google-analytics.com https://vitals.vercel-insights.com  https://www.givingloop.org https://code.jquery.com https://www.google.com https://js.stripe.com https://ipinfo.io https://snap.licdn.com https://cdn.mouseflow.com https://www.paypal.com  https://wchat.eu.freshchat.com https://cdn.plaid.com https://cdnjs.cloudflare.com https://cdn.amplitude.com https://cdn.logrocket.io https://www.gstatic.com https://js.stripe.com https://www.clarity.ms;
   font-src 'self' 'unsafe-inline' 'unsafe-eval' givingloop.org fonts.gstatic.com https://www.givingloop.org;
   frame-src 'self' 'unsafe-inline' 'unsafe-eval' https://js.stripe.com/v3 js.stripe.com  https://www.paypal.com www.paypal.com https://wchat.eu.freshchat.com https://www.google.com www.google.com www.youtube.com;
   style-src 'self' 'unsafe-inline' 'unsafe-eval' *.givingloop.org givingloop.org fonts.googleapis.com fonts.googleapis.com wchat.eu.freshchat.com;

src/components/Course/CourseDetails/Tabs/MainDetails/DetailSection/EditorsDetails/index.tsx

@@ -15,10 +15,11 @@ const EditorsDetails: React.FC<Props> = ({ editors }) => {
   let displayNames;
   if (editorNames.length === 1) {
     displayNames = editorNames[0];
-  } else if (editorNames.length === 2) {
-    displayNames = `${editorNames[0]} ${t('and')} ${editorNames[1]}`;
-  } else if (editorNames.length >= 3) {
-    displayNames = `${editorNames[0]}, ${editorNames[1]} ${t('and')} ${editorNames[2]}`;
+  } else if (editorNames.length >= 2) {
+    // Take all names except the last one and join them with commas
+    const namesExceptLast = editorNames.slice(0, -1).join(', ');
+    // Add the last name with 'and'
+    displayNames = `${namesExceptLast} ${t('and')} ${editorNames[editorNames.length - 1]}`;
   }
   return <span>{displayNames}</span>;
 };

src/components/Navbar/SettingsDrawer/TranslationSection.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable max-lines */
 import { useCallback, useMemo } from 'react';
 
 import { Action } from '@reduxjs/toolkit';
@@ -67,19 +68,23 @@ const TranslationSection = () => {
 
   const renderTranslations = useCallback(
     (data: TranslationsResponse) => {
+      const availableTranslations = selectedTranslations.filter((selectedId) =>
+        data.translations.some((translation) => translation.id === selectedId),
+      );
+
       const firstSelectedTranslation = data.translations.find(
-        (translation) => translation.id === selectedTranslations[0],
+        (translation) => translation.id === availableTranslations[0],
       );
 
       let selectedValueString = t('settings.no-translation-selected');
-      if (selectedTranslations.length === 1) selectedValueString = firstSelectedTranslation?.name;
-      if (selectedTranslations.length === 2) {
+      if (availableTranslations.length === 1) selectedValueString = firstSelectedTranslation?.name;
+      if (availableTranslations.length === 2) {
         selectedValueString = t('settings.value-and-other', {
           value: firstSelectedTranslation?.name,
           othersCount: localizedSelectedTranslations,
         });
       }
-      if (selectedTranslations.length > 2) {
+      if (availableTranslations.length > 2) {
         selectedValueString = t('settings.value-and-others', {
           value: firstSelectedTranslation?.name,
           othersCount: localizedSelectedTranslations,

src/components/dls/Footer/TitleAndDescription.tsx

@@ -1,19 +1,12 @@
-import Trans from 'next-translate/Trans';
 import useTranslation from 'next-translate/useTranslation';
 
 import styles from './Footer.module.scss';
 
-import Link, { LinkVariant } from '@/dls/Link/Link';
 import QuranTextLogo from '@/icons/quran-text-logo.svg';
-import { logButtonClick } from '@/utils/eventLogger';
 
 const TitleAndDescription = () => {
   const { t } = useTranslation('common');
 
-  const onHiringAnnouncementClicked = () => {
-    logButtonClick('footer_hiring_announcement');
-  };
-
   return (
     <div className={styles.titleAndDescriptionContainer}>
       <div className={styles.headingContainer}>
@@ -23,21 +16,6 @@ const TitleAndDescription = () => {
         <div className={styles.title}>{t('footer.title')}</div>
       </div>
       <p className={styles.description}>{t('footer.description')}</p>
-      <div className={styles.hiringAnnouncementContainer}>
-        <Trans
-          components={{
-            link: (
-              <Link
-                href="https://www.quran.foundation/careers"
-                variant={LinkVariant.Blend}
-                onClick={onHiringAnnouncementClicked}
-                isNewTab
-              />
-            ),
-          }}
-          i18nKey="common:footer.hiring"
-        />
-      </div>
     </div>
   );
 };