scripts/generate_metric_compare_strings.js

// Copyright 2024 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

const ratings = {
  good: 'is good',
  'needs-improvement': 'needs improvement',
  poor: 'is poor',
};

const compares = {
  better: 'significantly better than',
  worse: 'significantly worse than',
  similar: 'similar to',
};

function camelize(string) {
  return string.replace(/-./g, x => x[1].toUpperCase());
}

function capitalizeFirstLetter(string) {
  return string.charAt(0).toUpperCase() + string.slice(1);
}

console.log(`// Copyright 2024 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

import * as i18n from '../../../core/i18n/i18n.js';

// This file is auto-generated by scripts/generate_metric_compare_strings.js.
//
// If you need to update one or more of these strings, it is preferable to modify the script
// and write stdout to this file (Minor formatting differences may apply).

const UIStrings = {`);
for (const [rating, ratingText] of Object.entries(ratings)) {
  for (const [compare, compareText] of Object.entries(compares)) {
    const tag = camelize(rating) + capitalizeFirstLetter(compare) + 'Compare';
    console.log(`  /**
   * @description Text block that compares a local metric value to real user experiences.
   * @example {LCP} PH1
   * @example {500 ms} PH2
   */
  ${tag}: 'Your local {PH1} {PH2} ${ratingText}, and is ${compareText} your users’ experience.',`);
  }
  const tag = camelize(rating) + 'Summarized';
  console.log(`  /**
   * @description Text block that summarize a local metric value.
   * @example {LCP} PH1
   * @example {500 ms} PH2
   */
  ${tag}: 'Your local {PH1} {PH2} ${ratingText}.',`);
}
for (const [localRating, localRatingText] of Object.entries(ratings)) {
  for (const [fieldRating, fieldRatingText] of Object.entries(ratings)) {
    const tag = camelize(localRating) + capitalizeFirstLetter(camelize(fieldRating)) + 'DetailedCompare';
    const transition = localRating === fieldRating ? 'Additionally' : 'However';
    console.log(`  /**
   * @description Text block that compares a local metric value to real user experiences.
   * @example {LCP} PH1
   * @example {500 ms} PH2
   * @example {400 ms} PH3
   * @example {40%} PH4
   */
  ${tag}: 'Your local {PH1} {PH2} ${localRatingText} and is rated the same as {PH4} of real-user {PH1} experiences. ${
        transition}, the field data 75th percentile {PH1} {PH3} ${fieldRatingText}.',`);
  }
}
console.log(`};

const str_ = i18n.i18n.registerUIStrings('panels/timeline/components/MetricCompareStrings.ts', UIStrings);`);

console.log(`
export function renderCompareText(rating: ${Object.keys(ratings).map(c => `'${c}'`).join('|')}, compare?: ${
    Object.keys(compares).map(c => `'${c}'`).join('|')}, values?: Record<string, Object>): Element {
  if (!values) {
    values = {};
  }
`);

for (const rating of Object.keys(ratings)) {
  for (const compare of Object.keys(compares)) {
    const tag = camelize(rating) + capitalizeFirstLetter(compare) + 'Compare';
    console.log(`  if (rating === '${rating}' && compare === '${compare}') {
    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.${tag}, values);
  }`);
  }
  const tag = camelize(rating) + 'Summarized';
  console.log(`  if (rating === '${rating}' && !compare) {
    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.${tag}, values);
  }`);
}
console.log(`
  throw new Error('Compare string not found');
}`);

console.log(`
export function renderDetailedCompareText(localRating: ${
    Object.keys(ratings).map(c => `'${c}'`).join('|')}, fieldRating?: ${
    Object.keys(ratings).map(c => `'${c}'`).join('|')}, values?: Record<string, Object>): Element {
  if (!values) {
    values = {};
  }
`);

for (const localRating of Object.keys(ratings)) {
  for (const fieldRating of Object.keys(ratings)) {
    const tag = camelize(localRating) + capitalizeFirstLetter(camelize(fieldRating)) + 'DetailedCompare';
    console.log(`  if (localRating === '${localRating}' && fieldRating === '${fieldRating}') {
    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.${tag}, values);
  }`);
  }
  const tag = camelize(localRating) + 'Summarized';
  console.log(`  if (localRating === '${localRating}' && !fieldRating) {
    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.${tag}, values);
  }`);
}
console.log(`
  throw new Error('Detailed compare string not found');
}`);