@uppy/core: reference updated i18n in Restricter (#5118)

Fixes: https://github.com/transloadit/uppy/issues/5115

packages/@uppy/core/src/Restricter.ts

@@ -3,7 +3,6 @@
 import prettierBytes from '@transloadit/prettier-bytes'
 // @ts-ignore untyped
 import match from 'mime-match'
-import Translator from '@uppy/utils/lib/Translator'
 import type { Body, Meta, UppyFile } from '@uppy/utils/lib/UppyFile'
 import type { I18n } from '@uppy/utils/lib/Translator'
 import type { State, NonNullableUppyOptions } from './Uppy'
@@ -58,12 +57,15 @@ class RestrictionError<M extends Meta, B extends Body> extends Error {
 }
 
 class Restricter<M extends Meta, B extends Body> {
-  i18n: Translator['translate']
+  getI18n: () => I18n
 
   getOpts: () => NonNullableUppyOptions<M, B>
 
-  constructor(getOpts: () => NonNullableUppyOptions<M, B>, i18n: I18n) {
-    this.i18n = i18n
+  constructor(
+    getOpts: () => NonNullableUppyOptions<M, B>,
+    getI18n: () => I18n,
+  ) {
+    this.getI18n = getI18n
     this.getOpts = (): NonNullableUppyOptions<M, B> => {
       const opts = getOpts()
 
@@ -88,7 +90,7 @@ class Restricter<M extends Meta, B extends Body> {
       const nonGhostFiles = existingFiles.filter((f) => !f.isGhost)
       if (nonGhostFiles.length + addingFiles.length > maxNumberOfFiles) {
         throw new RestrictionError(
-          `${this.i18n('youCanOnlyUploadX', {
+          `${this.getI18n()('youCanOnlyUploadX', {
             smart_count: maxNumberOfFiles,
           })}`,
         )
@@ -108,7 +110,7 @@ class Restricter<M extends Meta, B extends Body> {
 
           if (totalFilesSize > maxTotalFileSize) {
             throw new RestrictionError(
-              this.i18n('exceedsSize', {
+              this.getI18n()('exceedsSize', {
                 size: prettierBytes(maxTotalFileSize),
                 file: addingFile.name,
               }),
@@ -141,7 +143,7 @@ class Restricter<M extends Meta, B extends Body> {
       if (!isCorrectFileType) {
         const allowedFileTypesString = allowedFileTypes.join(', ')
         throw new RestrictionError(
-          this.i18n('youCanOnlyUploadFileTypes', {
+          this.getI18n()('youCanOnlyUploadFileTypes', {
             types: allowedFileTypesString,
           }),
           { file } as { file: UppyFile<M, B> },
@@ -152,7 +154,7 @@ class Restricter<M extends Meta, B extends Body> {
     // We can't check maxFileSize if the size is unknown.
     if (maxFileSize && file.size != null && file.size > maxFileSize) {
       throw new RestrictionError(
-        this.i18n('exceedsSize', {
+        this.getI18n()('exceedsSize', {
           size: prettierBytes(maxFileSize),
           file: file.name,
         }),
@@ -163,7 +165,7 @@ class Restricter<M extends Meta, B extends Body> {
     // We can't check minFileSize if the size is unknown.
     if (minFileSize && file.size != null && file.size < minFileSize) {
       throw new RestrictionError(
-        this.i18n('inferiorSize', {
+        this.getI18n()('inferiorSize', {
           size: prettierBytes(minFileSize),
         }),
         { file } as { file: UppyFile<M, B> },
@@ -185,7 +187,9 @@ class Restricter<M extends Meta, B extends Body> {
     const { minNumberOfFiles } = this.getOpts().restrictions
     if (minNumberOfFiles && Object.keys(files).length < minNumberOfFiles) {
       throw new RestrictionError(
-        this.i18n('youHaveToAtLeastSelectX', { smart_count: minNumberOfFiles }),
+        this.getI18n()('youHaveToAtLeastSelectX', {
+          smart_count: minNumberOfFiles,
+        }),
       )
     }
   }
@@ -195,7 +199,7 @@ class Restricter<M extends Meta, B extends Body> {
     error: RestrictionError<M, B>
   } {
     const error = new RestrictionError<M, B>(
-      this.i18n('missingRequiredMetaFieldOnFile', { fileName: file.name }),
+      this.getI18n()('missingRequiredMetaFieldOnFile', { fileName: file.name }),
     )
     const { requiredMetaFields } = this.getOpts().restrictions
     const missingFields: string[] = []

packages/@uppy/core/src/Uppy.test.ts

@@ -7,6 +7,7 @@ import fs from 'node:fs'
 import path from 'node:path'
 import prettierBytes from '@transloadit/prettier-bytes'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
+import type { Locale } from '@uppy/utils/lib/Translator'
 import Core from './index.ts'
 import UIPlugin from './UIPlugin.ts'
 import BasePlugin, {
@@ -1540,6 +1541,18 @@ describe('src/Core', () => {
     })
 
     it('should change restrictions on the fly', () => {
+      const fr_FR: Locale<0 | 1> = {
+        strings: {
+          youCanOnlyUploadFileTypes:
+            'Vous pouvez seulement téléverser: %{types}',
+        },
+        pluralize(n) {
+          if (n <= 1) {
+            return 0
+          }
+          return 1
+        },
+      }
       const core = new Core({
         restrictions: {
           allowedFileTypes: ['image/jpeg'],
@@ -1560,6 +1573,25 @@ describe('src/Core', () => {
       }
 
       core.setOptions({
+        locale: fr_FR,
+      })
+
+      try {
+        core.addFile({
+          source: 'vi',
+          name: 'foo1.png',
+          type: 'image/png',
+          // @ts-ignore
+          data: new File([sampleImage], { type: 'image/png' }),
+        })
+      } catch (err) {
+        expect(err).toMatchObject(
+          new Error('Vous pouvez seulement téléverser: image/jpeg'),
+        )
+      }
+
+      core.setOptions({
+        locale: fr_FR,
         restrictions: {
           allowedFileTypes: ['image/png'],
         },

packages/@uppy/core/src/Uppy.ts

@@ -460,7 +460,10 @@ export class Uppy<M extends Meta, B extends Body> {
       info: [],
     })
 
-    this.#restricter = new Restricter<M, B>(() => this.opts, this.i18n)
+    this.#restricter = new Restricter<M, B>(
+      () => this.opts,
+      () => this.i18n,
+    )
 
     this.#storeUnsubscribe = this.store.subscribe(
       // eslint-disable-next-line