Make valid-i18n-keys rule strict and fix most exceptions

ts/components/WhatsNewModal.tsx

@@ -6,7 +6,6 @@ import React from 'react';
 import moment from 'moment';
 
 import { Modal } from './Modal';
-import type { IntlComponentsType } from './Intl';
 import { Intl } from './Intl';
 import { Emojify } from './conversation/Emojify';
 import type { LocalizerType, RenderTextCallbackType } from '../types/Util';
@@ -19,61 +18,46 @@ export type PropsType = {
 type ReleaseNotesType = {
   date: Date;
   version: string;
-  features: Array<{ key: string; components: IntlComponentsType }>;
+  features: Array<JSX.Element>;
 };
 
 const renderText: RenderTextCallbackType = ({ key, text }) => (
   <Emojify key={key} text={text} />
 );
 
-const releaseNotes: ReleaseNotesType = {
-  date: new Date(window.getBuildCreation?.() || Date.now()),
-  version: window.getVersion?.(),
-  features: [
-    {
-      key: 'icu:WhatsNew__v6.12--0',
-      components: {},
-    },
-    {
-      key: 'icu:WhatsNew__v6.12--1',
-      components: {},
-    },
-  ],
-};
-
 export function WhatsNewModal({
   i18n,
   hideWhatsNewModal,
 }: PropsType): JSX.Element {
   let contentNode: ReactChild;
 
+  const releaseNotes: ReleaseNotesType = {
+    date: new Date(window.getBuildCreation?.() || Date.now()),
+    version: window.getVersion?.(),
+    features: [
+      <Intl
+        i18n={i18n}
+        id="icu:WhatsNew__v6.12--0"
+        renderText={renderText}
+        components={{}}
+      />,
+      <Intl
+        i18n={i18n}
+        id="icu:WhatsNew__v6.12--1"
+        renderText={renderText}
+        components={{}}
+      />,
+    ],
+  };
+
   if (releaseNotes.features.length === 1) {
-    const { key, components } = releaseNotes.features[0];
-    contentNode = (
-      <p>
-        {/* eslint-disable-next-line local-rules/valid-i18n-keys */}
-        <Intl
-          i18n={i18n}
-          id={key}
-          renderText={renderText}
-          components={components}
-        />
-      </p>
-    );
+    contentNode = <p>{releaseNotes.features[0]}</p>;
   } else {
     contentNode = (
       <ul>
-        {releaseNotes.features.map(({ key, components }) => (
-          <li key={key}>
-            {/* eslint-disable-next-line local-rules/valid-i18n-keys */}
-            <Intl
-              i18n={i18n}
-              id={key}
-              renderText={renderText}
-              components={components}
-            />
-          </li>
-        ))}
+        {releaseNotes.features.map(element => {
+          return <li key={element.props.id}>{element}</li>;
+        })}
       </ul>
     );
   }