refactor: implement code review changes

package.json

@@ -61,6 +61,7 @@
     "date-fns": "2.29.3",
     "html-entities": "^2.3.3",
     "i18next": "23.2.10",
+    "i18next-intervalplural-postprocessor": "3.0.0",
     "intl": "^1.2.5",
     "intl-pluralrules": "2.0.1",
     "lodash": "^4.17.21",

src/app/domain/osReceive/services/shareFilesService.spec.ts

@@ -30,7 +30,7 @@ const mockCozyClient = {
   getStackClient: jest.fn(() => ({
     uri: 'http://mocked-uri',
     fetchJSON: mockFetchJSON,
-    token: { accessToken: 'mocked-access-token' }
+    getAuthorizationHeader: (): string => 'mocked-authorization-header'
   }))
 } as unknown as CozyClient
 

src/app/domain/osReceive/services/shareFilesService.ts

@@ -10,7 +10,7 @@ import { getErrorMessage } from 'cozy-intent'
 
 const downloadFilesInParallel = async (
   fileInfos: FileMetadata[],
-  token: string
+  headers: string
 ): Promise<string[]> => {
   const fileURIs = await Promise.all(
     fileInfos.map(async fileInfo => {
@@ -22,7 +22,7 @@ const downloadFilesInParallel = async (
         fromUrl: url,
         toFile: path,
         headers: {
-          Authorization: `Bearer ${token}`
+          Authorization: headers
         }
       }
 
@@ -64,13 +64,13 @@ export const fetchFilesByIds = async (
       fileIds.map(fileId => fetchFileMetadata(client, fileId))
     )
 
-    const authToken = client.getStackClient().token.accessToken
+    const headers = client.getStackClient().getAuthorizationHeader()
 
-    if (!authToken) {
+    if (!headers) {
       throw new Error('uploadFileMultiple: token is undefined, aborting')
     }
 
-    const fileURIs = await downloadFilesInParallel(fileInfos, authToken)
+    const fileURIs = await downloadFilesInParallel(fileInfos, headers)
 
     // We want to call the callback before opening the share dialog
     // This is to handle the case where the Share library throws an error,

src/app/view/OsReceive/OsReceiveProvider.tsx

@@ -148,7 +148,10 @@ export const OsReceiveProvider = ({
 
         // Here we encountered a real error, so we clear the state and display an error message
         return handleError(
-          t('errors.shareFiles', { count: state.filesToShare.length }),
+          t('errors.shareFiles', {
+            postProcess: 'interval',
+            count: state.filesToShare.length
+          }),
           () => {
             OsReceiveLogger.error(
               'Global failure in files to share, clearing state',
@@ -170,7 +173,11 @@ export const OsReceiveProvider = ({
       <OsReceiveDispatchContext.Provider value={dispatch}>
         {children}
 
-        {state.filesToShare.length > 0 && <LoadingOverlay />}
+        {state.filesToShare.length > 0 && (
+          <LoadingOverlay
+            loadingMessage={t('services.osReceive.shareFiles.downloadingFiles')}
+          />
+        )}
       </OsReceiveDispatchContext.Provider>
     </OsReceiveStateContext.Provider>
   )

src/locales/en.json

@@ -19,8 +19,8 @@
     "serverError": "An error occurred while processing your request",
     "cacheCheckError": "An error occurred while processing your request",
     "print": "Failed to print, please try again.",
-    "shareFiles_one": "We couldn't share your file, please try again.",
-    "shareFiles_other": "We couldn't share your files, please try again."
+    "shareFiles_other": "We couldn't share your files, please try again.",
+    "shareFiles_interval": "(1)[We couldn't share your file, please try again.]||||(2-inf)[We couldn't share your files, please try again.]"
   },
   "logout_dialog": {
     "cancel": "Cancel",
@@ -168,4 +168,4 @@
       "unlock": "Unlock"
     }
   }
-}
+}

src/locales/es.json

@@ -13,8 +13,8 @@
     "unknown_error": "Ha ocurrido un error inesperado, por favor inténtalo de nuevo.",
     "reset": "Volver al inicio",
     "platformNotSupported": "Plataforma no compatible con esta solicitud",
-    "shareFiles_one": "No pudimos compartir tu archivo, por favor intenta de nuevo.",
-    "shareFiles_other": "No pudimos compartir tus archivos, por favor intenta de nuevo."
+    "shareFiles_other": "No pudimos compartir tus archivos, por favor intenta de nuevo.",
+    "shareFiles_interval": "(1)[No pudimos compartir tu archivo, por favor intenta de nuevo.]||||(2-inf)[No pudimos compartir tus archivos, por favor intenta de nuevo.]"
   },
   "logout_dialog": {
     "cancel": "Cancelar",
@@ -149,4 +149,4 @@
       "unlock": "Desbloquear"
     }
   }
-}
+}

src/locales/fr.json

@@ -17,8 +17,8 @@
     "reset": "Revenir à l'accueil",
     "showDetails": "Voir les détails de l'erreur",
     "platformNotSupported": "Plateforme non supportée pour cette demande",
-    "shareFiles_one": "Nous n'avons pas pu partager votre fichier, veuillez réessayer.",
-    "shareFiles_other": "Nous n'avons pas pu partager vos fichiers, veuillez réessayer."
+    "shareFiles_other": "Nous n'avons pas pu partager vos fichiers, veuillez réessayer.",
+    "shareFiles_interval": "(1)[Nous n'avons pas pu partager votre fichier, veuillez réessayer.]||||(2-inf)[Nous n'avons pas pu partager vos fichiers, veuillez réessayer.]"
   },
   "logout_dialog": {
     "cancel": "Annuler",
@@ -170,4 +170,4 @@
       "unlock": "Déverrouiller"
     }
   }
-}
+}

src/locales/i18n.ts

@@ -1,4 +1,5 @@
 import _i18n, { Resource } from 'i18next'
+import intervalPlural from 'i18next-intervalplural-postprocessor'
 import 'intl'
 import 'intl-pluralrules'
 import { initReactI18next, useTranslation } from 'react-i18next'
@@ -13,6 +14,13 @@ import fr from './fr.json'
 
 const i18nLogger = Minilog('i18n')
 
+intervalPlural.setOptions({
+  // these are the defaults
+  intervalSeparator: '||||',
+  intervalRegex: /\((\S*)\).*?\[((.|\n)*)\]/, // pre 3.0 /\((\S*)\).*{((.|\n)*)}/,
+  intervalSuffix: '_interval'
+})
+
 // Translation resources are loaded from the src/locales folder, and pulled in by the transifex-client
 const resources: Record<string, Resource> = {
   en: {
@@ -43,6 +51,7 @@ const language = getSupportedLanguageCode(getLocales()[0].languageCode)
 // Initialize i18next with resources and settings
 _i18n
   .use(initReactI18next)
+  .use(intervalPlural)
   .init({
     resources: resources,
     lng: language,

src/ui/LoadingOverlay/LoadingOverlay.stories.tsx

@@ -11,4 +11,6 @@ const LoadingOverlayMeta = {
 
 export default LoadingOverlayMeta
 
-export const Default = (): JSX.Element => <LoadingOverlay />
+export const Default = (): JSX.Element => (
+  <LoadingOverlay loadingMessage="Loading Overlay" />
+)

src/ui/LoadingOverlay/index.tsx

@@ -6,11 +6,11 @@ import { Typography } from '/ui/Typography'
 import ProgressBar from '/components/Bar'
 import { CozyTheme } from '/ui/CozyTheme/CozyTheme'
 import { getDimensions } from '/libs/dimensions'
-import { useI18n } from '/locales/i18n'
 
 import { hPadding, styles } from '/ui/LoadingOverlay/LoadingOverlay.styles'
 
 export interface LoadingOverlayProps extends ViewProps {
+  loadingMessage: string
   style?: StyleProp<ViewStyle>
 }
 
@@ -22,26 +22,25 @@ const progressBarConfig = {
   height: 4
 }
 
-export const LoadingOverlay = ({ style }: LoadingOverlayProps): JSX.Element => {
-  const { t } = useI18n()
-
+export const LoadingOverlay = ({
+  loadingMessage,
+  style
+}: LoadingOverlayProps): JSX.Element => (
   // Always want inverted here because the overlay is on top of a dark background
-  return (
-    <CozyTheme variant="inverted">
-      <View style={[styles.container, style]}>
-        <BlurView style={styles.absolute} blurType="dark" blurAmount={10} />
-
-        <View style={styles.containerContent}>
-          <Typography variant="body1" style={{ marginBottom: hPadding * 0.5 }}>
-            {t('services.osReceive.shareFiles.downloadingFiles')}
-          </Typography>
-
-          <ProgressBar
-            width={getDimensions().screenWidth - hPadding}
-            {...progressBarConfig}
-          />
-        </View>
+  <CozyTheme variant="inverted">
+    <View style={[styles.container, style]}>
+      <BlurView style={styles.absolute} blurType="dark" blurAmount={10} />
+
+      <View style={styles.containerContent}>
+        <Typography variant="body1" style={{ marginBottom: hPadding * 0.5 }}>
+          {loadingMessage}
+        </Typography>
+
+        <ProgressBar
+          width={getDimensions().screenWidth - hPadding}
+          {...progressBarConfig}
+        />
       </View>
-    </CozyTheme>
-  )
-}
+    </View>
+  </CozyTheme>
+)

yarn.lock

@@ -11311,6 +11311,11 @@ human-signals@^2.1.0:
   resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0"
   integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==
 
+[email protected]:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/i18next-intervalplural-postprocessor/-/i18next-intervalplural-postprocessor-3.0.0.tgz#35580abdaff5e838c44c22740a7178063b7bdd0b"
+  integrity sha512-ZJWg2Gcb0kQqVI7kygLj9wVwQHK3mzRAg94uLsdoHqss0M9n0HSPr1pThd2AttkBsJFWR26G18hnKCqcTB8shQ==
+
 [email protected]:
   version "23.2.10"
   resolved "https://registry.yarnpkg.com/i18next/-/i18next-23.2.10.tgz#a9db1aaf84d8853da402888c837aeaf8fa7f71e2"