chore: merge release back to develop

.gitignore

@@ -21,3 +21,6 @@ firebase-debug.log
 
 # Exclude ini files because they have customer specific data
 ini/*.ini
+
+# Ignore working area for i18n checks
+.temp-translations

CHANGELOG.md

@@ -1,3 +1,39 @@
+# [4.25.0](https://github.com/jwplayer/ott-web-app/compare/v4.23.2...v4.25.0) (2023-08-01)
+
+
+### Bug Fixes
+
+* add missing Spanish translations ([2270049](https://github.com/jwplayer/ott-web-app/commit/22700493c6e3bb9a247684aa353002d68cbde509))
+* add per-provider flag for subscription change tests ([19cd475](https://github.com/jwplayer/ott-web-app/commit/19cd4752177a0c816e257a1192337b41664af37b))
+* choose offer modal without pricing options ([bc8389e](https://github.com/jwplayer/ott-web-app/commit/bc8389e3ab9f0c343e25d3dcf60f139b56204f34))
+* disable change subscription button when subscription is cancelled and can't renew ([be09ba2](https://github.com/jwplayer/ott-web-app/commit/be09ba2b3cb8ae6688e7673f8216e31b02e38bf0))
+* hide cancel button for inplayer configs ([8f71448](https://github.com/jwplayer/ott-web-app/commit/8f714488fc5d21725f9a8d1286326f38c7b9608c))
+* move additional logic to container ([7a350fa](https://github.com/jwplayer/ott-web-app/commit/7a350fab301e841d9a7c126033e6045247fbec52))
+* move logic from user and payment to paymentcontainer ([6b7a72a](https://github.com/jwplayer/ott-web-app/commit/6b7a72ab5126431f8a19dae18cd992d1f59cffd6))
+* move useoffers call to payments ([1cfcf45](https://github.com/jwplayer/ott-web-app/commit/1cfcf454231d101d9975c50958fb07d32dfff9dd))
+* offerswitch props ([d79f779](https://github.com/jwplayer/ott-web-app/commit/d79f779c7ac9a7ff5a46ce4702df68f8145fa572))
+* pr comments ([c9d5bbb](https://github.com/jwplayer/ott-web-app/commit/c9d5bbba4f1c29adf733d678a981a6cfd968574f))
+* remove unnecessary redirect ([4a8a5ff](https://github.com/jwplayer/ott-web-app/commit/4a8a5ff75759ba76fd07361cc2f7670f70a9ade7))
+* **seo:** fix seo score ([2274c9b](https://github.com/jwplayer/ott-web-app/commit/2274c9b5999507a96f781ee5d5ba1501b00036e5))
+* tests ([0654af6](https://github.com/jwplayer/ott-web-app/commit/0654af6665bc1b542ea1148fb64cc00806b8446b))
+* **watchhistory:** improve watch history storage calls and fix bugs ([9fd1774](https://github.com/jwplayer/ott-web-app/commit/9fd17746d27490d43fe6f595252bba29c9e20d02))
+
+
+### Features
+
+* initial inplayer subscription change implementation ([b335b69](https://github.com/jwplayer/ott-web-app/commit/b335b69f6429bb73a72cd8a442f5e52fdf77084b))
+* **project:** add new `cardImageAspectRatio` custom param for playlists ([65264eb](https://github.com/jwplayer/ott-web-app/commit/65264eb5ae99fcbfb9348de01e9ed6a8f64c9cf0))
+* **project:** fix lhci workflow ([466e8e3](https://github.com/jwplayer/ott-web-app/commit/466e8e3650d769bdcf324539d7c27e1fb6d8df11))
+* **project:** lighthouse actions triggering ([0d004eb](https://github.com/jwplayer/ott-web-app/commit/0d004eb216c4dec331be93e0c35d3e369861b11a))
+* **project:** lighthouse check ([3ba3617](https://github.com/jwplayer/ott-web-app/commit/3ba36174b114a46905942ed3ede1f085654c9729))
+* **project:** remove ImageData type ([6f993c6](https://github.com/jwplayer/ott-web-app/commit/6f993c608a98fa4c6269a0ccf69058f434054f81))
+* **project:** use a native fallback for image service ([0fc9bd6](https://github.com/jwplayer/ott-web-app/commit/0fc9bd6fcf71d43e336d1759410a2a5a5c40352b))
+* **series:** add native support for next episodes ([1f11d6a](https://github.com/jwplayer/ott-web-app/commit/1f11d6a445813957277abcaedf3975ec6fb05bc1))
+* **series:** use named params ([ba6560e](https://github.com/jwplayer/ott-web-app/commit/ba6560e53ac291e671b53c9206eeaf197c135253))
+* temporary FE handling for downgrade subscription ([53ee10d](https://github.com/jwplayer/ott-web-app/commit/53ee10d7e26c9a9dea5454c00ae869b115169a7d))
+
+
+
 ## [4.23.2](https://github.com/jwplayer/ott-web-app/compare/v4.23.1...v4.23.2) (2023-07-06)
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jw-ott-webapp",
-  "version": "4.23.2",
+  "version": "4.25.0",
   "main": "index.js",
   "repository": "https://github.com/jwplayer/ott-web-app.git",
   "author": "JW Player",
@@ -19,6 +19,8 @@
     "test-commit": "TZ=UTC LC_ALL=en_US.UTF-8 vitest run --changed HEAD~1 --coverage",
     "test-update": "TZ=UTC LC_ALL=en_US.UTF-8 vitest run --update",
     "i18next": "i18next src/{components,containers,pages,services,stores}/**/{**/,/}*.{ts,tsx} && node ./scripts/i18next/generate.js",
+    "i18next-diff": "yarn i18next && npx ts-node ./scripts/i18next/diff-translations",
+    "i18next-update": "npx ts-node ./scripts/i18next/update-translations && yarn i18next",
     "format": "run-s -c format:*",
     "format:eslint": "eslint \"{**/*,*}.{js,ts,jsx,tsx}\" --fix",
     "format:prettier": "prettier --write \"{**/*,*}.{js,ts,jsx,tsx}\"",
@@ -91,6 +93,7 @@
     "allure-commandline": "^2.17.2",
     "codeceptjs": "3.4.1",
     "confusing-browser-globals": "^1.0.10",
+    "csv-parse": "^5.4.0",
     "depcheck": "^1.4.3",
     "eslint": "^7.31.0",
     "eslint-plugin-codeceptjs": "^1.3.0",

public/locales/en/common.json

@@ -11,8 +11,8 @@
     "close": "Cancel",
     "confirm": "Yes"
   },
-  "default_site_name": "My OTT Application",
   "default_description": "JW OTT Webapp is an open-source, dynamically generated video website.",
+  "default_site_name": "My OTT Application",
   "filter_videos_by": "Filter videos by {{name}}",
   "filter_videos_by_genre": "Filter videos by genre",
   "home": "Home",

public/locales/en/demo.json

@@ -1,6 +1,6 @@
 {
-  "app_config_not_found": "Invalid or Missing App Config",
   "app_config_learn_more": "Learn more about App Configs",
+  "app_config_not_found": "Invalid or Missing App Config",
   "cancel_config_id": "Cancel",
   "click_to_unselect_config": "(click here to unselect this config)",
   "currently_previewing_config": "You are currently previewing config: '{{configSource}}'",

public/locales/es/common.json

@@ -11,8 +11,8 @@
     "close": "Cancelar",
     "confirm": "Sí"
   },
-  "default_site_name": "Mi aplicación OTT",
   "default_description": "La OTT WebApp de JW es un sitio web de videos de código abierto generado dinamicamente.",
+  "default_site_name": "Mi aplicación OTT",
   "filter_videos_by": "Filtrar videos por {{name}}",
   "filter_videos_by_genre": "Filtrar videos por género",
   "home": "Inicio",

public/locales/es/demo.json

@@ -1,6 +1,6 @@
 {
-  "app_config_not_found": "Configuración de aplicación inválida o no encontrada",
   "app_config_learn_more": "Más información sobre App Configs",
+  "app_config_not_found": "Configuración de aplicación inválida o no encontrada",
   "cancel_config_id": "Cancelar",
   "click_to_unselect_config": "(haz clic aquí para deseleccionar esta configuración)",
   "currently_previewing_config": "Actualmente estás previsualizando la configuración: '{{configSource}}'",

public/locales/es/user.json

@@ -70,14 +70,14 @@
     "billing_history": "Historial de facturación",
     "cancel_subscription": "Cancelar suscripción",
     "card_number": "Número de tarjeta",
-    "change_plan": "",
-    "change_plan_error": "",
+    "change_plan": "Cambiar De Plan",
+    "change_plan_error": "Hubo un problema al guardar los cambios en el plan de tu suscripción.",
     "change_subscription": "Cambiar suscripción",
     "complete_subscription": "Completar suscripción",
-    "current_plan": "",
+    "current_plan": "PLAN ACTUAL",
     "daily_subscription": "Suscripción diaria",
-    "downgrade_on": "",
-    "downgrade_plan_success": "",
+    "downgrade_on": "Degradaciónde plan pendiente para el {{date}}",
+    "downgrade_plan_success": "Haz cambiado exitosamente el plan de tu suscripción. Tu nuevo plan comenzará después de que finalice el periodo actual el {{date}}.",
     "expiry_date": "Fecha de vencimiento",
     "granted_subscription": "Suscripción otorgada",
     "hidden_transactions_one": "Una transacción más",
@@ -91,7 +91,7 @@
     "no_transactions": "No hay transacciones",
     "other": "otro",
     "payment_method": "Método de pago",
-    "pending_downgrade": "",
+    "pending_downgrade": "Degradación de plan pendiente",
     "pending_offer_switch": "Se actualizará a \"{{title}}\" después de la próxima fecha de facturación",
     "price_paid_with": "{{price}} pagado con {{method}}",
     "price_paid_with_card": "Precio pagado con tarjeta",
@@ -102,7 +102,7 @@
     "subscription_details": "Detalles de la suscripción",
     "subscription_expires_on": "Este plan expirará el {{date}}",
     "update_payment_details": "Actualizar detalles de pago",
-    "upgrade_plan_success": "",
+    "upgrade_plan_success": "Haz cambiado exitosamente el plan de tu suscripción. Puedes comenzar a disfrutar de los beneficios adicionales de inmediato.",
     "weekly_subscription": "Suscripción semanal"
   }
 }

scripts/i18next/diff-translations.ts

@@ -0,0 +1,112 @@
+import { execSync } from 'child_process';
+import * as fs from 'fs';
+
+const changes: {
+  [file: string]: {
+    [key: string]: {
+      [language: string]: {
+        oldValue?: string;
+        newValue?: string;
+      };
+    };
+  };
+} = {};
+
+function run() {
+  const fileChanges = execSync('git diff -U200000 --no-prefix release..release-candidate public/locales')
+    .toString()
+    .split('\n')
+    .filter((s) => !!s)
+    .map((s) => s.trim());
+
+  let filename = '';
+  let language = '';
+  let path: string[] = [];
+
+  for (const line of fileChanges) {
+    if (line.startsWith('diff --git')) {
+      [filename, language] = line.split('\n')[0].split('/').reverse() || [];
+      path = [];
+    } else if (line.startsWith('"') && line.endsWith('{')) {
+      // This is the start of a new subgroup, parse the name and add it to the path
+      path.push(line.split(':')[0].replace(/"/g, ''));
+    } else if (line.startsWith('}')) {
+      // This is the end of a subgroup, so take last path segment away
+      path.pop();
+    } else if (line.startsWith('---') || line.startsWith('+++')) {
+      // Skip these lines
+    } else if (line.startsWith('+') || line.startsWith('-')) {
+      // This is a changed line, first parse the value
+      // using regex to strip the leading +/-, whitespace, and quotes OR trailing quote and comma
+      // Then split on the colon and middle quotes
+      const [name, value] = line.replace(/(^[+-]\s*")|(",$)/g, '').split('": "');
+
+      // Reconstruct the full path from any parent paths
+      const key = [...path, name].join('.');
+
+      // Make sure that the nested items have values
+      changes[filename] ||= {};
+      changes[filename][key] ||= {};
+      changes[filename][key][language] ||= {};
+
+      // Set the old or new value props based on the git symbol
+      if (line.startsWith('+')) {
+        changes[filename][key][language].newValue = value;
+      } else {
+        changes[filename][key][language].oldValue = value;
+      }
+    }
+  }
+
+  const languageGroups: {
+    [language: string]: string[];
+  } = {};
+
+  Object.entries(changes).forEach(([filename, fileChanges]) => {
+    Object.entries(fileChanges).forEach(([key, languages]) => {
+      Object.entries(languages).forEach(([language, props]) => {
+        // Only include keys with updated new values or where the English has updated new values
+        if (languages['en'].newValue !== undefined || props.newValue !== undefined) {
+          // Add the headers
+          languageGroups[language] ||= [
+            [
+              'File',
+              'Translation Key',
+              // Show Old/New English fields for other languages to help translators
+              ...(language === 'en' ? [] : ['Original Value (en)', 'New Value (en)']),
+              `Original Value (${language})`,
+              `Updated Value (${language})`,
+            ].join(','),
+          ];
+
+          languageGroups[language].push(
+            [
+              filename,
+              key,
+              // Show Old/New English values for other languages to help translators
+              ...(language === 'en' ? [] : [languages['en']?.oldValue || '', languages['en']?.newValue || '']),
+              props.oldValue || '',
+              props.newValue || '',
+            ]
+              // Wrap with quotes to escape any internal commas
+              .map((v) => `"${v}"`)
+              .join(','),
+          );
+        }
+      });
+    });
+  });
+
+  if (!fs.existsSync('.temp-translations')) {
+    fs.mkdirSync('.temp-translations');
+  }
+
+  Object.entries(languageGroups).forEach(([language, values]) => {
+    const file = `.temp-translations/translations.${language}.csv`;
+
+    fs.writeFileSync(file, values.join('\n'), 'utf8');
+    console.info(`Wrote ${values.length - 1} keys to ${file}`);
+  });
+}
+
+run();

scripts/i18next/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "include": ["./**/*"],
+  "compilerOptions": {
+    "module": "NodeNext",
+    "types": [
+      "node"
+    ]
+  },
+}

scripts/i18next/update-translations.ts

@@ -0,0 +1,60 @@
+import * as fs from 'fs';
+
+// @ts-ignore
+import { ColumnOption, parse } from 'csv-parse/sync';
+
+interface Line {
+  filename: string;
+  key: string;
+  value: string;
+}
+
+interface JsonObject {
+  [key: string]: string | JsonObject;
+}
+
+function updateObject(obj: JsonObject, paths: string[], newValue: string) {
+  const key = paths.shift() || '';
+
+  if (paths.length <= 0) {
+    obj[key] = newValue;
+  } else {
+    obj[key] = updateObject(obj[key] as JsonObject, paths, newValue);
+  }
+
+  return obj;
+}
+
+function run() {
+  const allFiles = fs.readdirSync('.temp-translations');
+
+  for (const file of allFiles) {
+    const language = file.split('.')[1];
+
+    const lines = parse(fs.readFileSync(`.temp-translations/${file}`), {
+      fromLine: 2,
+      columns: ['filename', 'key', ...(language === 'en' ? [] : [false as ColumnOption, false as ColumnOption]), false, 'value'],
+      relax_column_count: true,
+    }) as Line[];
+    const groups = lines.reduce((allGroups, line) => {
+      allGroups[line.filename] ||= [];
+      allGroups[line.filename].push(line);
+
+      return allGroups;
+    }, {} as { [filename: string]: Line[] });
+
+    Object.entries(groups).forEach(([jsonFile, lines]) => {
+      const filename = `public/locales/${language}/${jsonFile}`;
+
+      const json = JSON.parse(fs.readFileSync(filename).toString());
+
+      for (const line of lines) {
+        updateObject(json, line.key.split('.'), line.value);
+      }
+
+      fs.writeFileSync(filename, JSON.stringify(json));
+    });
+  }
+}
+
+run();

yarn.lock

@@ -3869,6 +3869,11 @@ csstype@^3.0.2:
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.11.tgz#d66700c5eacfac1940deb4e3ee5642792d85cd33"
   integrity sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==
 
+csv-parse@^5.4.0:
+  version "5.4.0"
+  resolved "https://registry.yarnpkg.com/csv-parse/-/csv-parse-5.4.0.tgz#6793210a4a49a9a74b3fde3f9d00f3f52044fd89"
+  integrity sha512-JiQosUWiOFgp4hQn0an+SBoV9IKdqzhROM0iiN4LB7UpfJBlsSJlWl9nq4zGgxgMAzHJ6V4t29VAVD+3+2NJAg==
+
 dargs@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/dargs/-/dargs-7.0.0.tgz#04015c41de0bcb69ec84050f3d9be0caf8d6d5cc"
@@ -7991,7 +7996,7 @@ read@^2.1.0:
   dependencies:
     mute-stream "~1.0.0"
 
-readable-stream@3, readable-stream@^3.0.0, readable-stream@^3.0.2, readable-stream@^3.1.1, readable-stream@^3.4.0:
+readable-stream@3:
   version "3.6.0"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.0.tgz#337bbda3adc0706bd3e024426a286d4b4b2c9198"
   integrity sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==