feat: Add type stubs for frontend-platform/i18n (#1251)

Author: bradenmacdonald

src/frontend-platform.d.ts

@@ -0,0 +1,41 @@
+// frontend-platform currently doesn't provide types... do it ourselves for i18n module at least.
+// We can remove this in the future when we migrate to frontend-shell, or when frontend-platform gets types
+// (whichever comes first).
+
+declare module '@edx/frontend-platform/i18n' {
+  // eslint-disable-next-line import/no-extraneous-dependencies
+  import { injectIntl as _injectIntl } from 'react-intl';
+  /** @deprecated Use useIntl() hook instead. */
+  export const injectIntl: typeof _injectIntl;
+  /** @deprecated Use useIntl() hook instead. */
+  export const intlShape: any;
+
+  // eslint-disable-next-line import/no-extraneous-dependencies
+  export {
+    createIntl,
+    FormattedDate,
+    FormattedTime,
+    FormattedRelativeTime,
+    FormattedNumber,
+    FormattedPlural,
+    FormattedMessage,
+    defineMessages,
+    IntlProvider,
+    useIntl,
+  } from 'react-intl';
+
+  // Other exports from the i18n module:
+  export const configure: any;
+  export const getPrimaryLanguageSubtag: (code: string) => string;
+  export const getLocale: (locale?: string) => string;
+  export const getMessages: any;
+  export const isRtl: (locale?: string) => boolean;
+  export const handleRtl: any;
+  export const mergeMessages: any;
+  export const LOCALE_CHANGED: any;
+  export const LOCALE_TOPIC: any;
+  export const getCountryList: any;
+  export const getCountryMessages: any;
+  export const getLanguageList: any;
+  export const getLanguageMessages: any;
+}

src/library-authoring/add-content/messages.ts

@@ -1,8 +1,4 @@
-import { defineMessages as _defineMessages } from '@edx/frontend-platform/i18n';
-import type { defineMessages as defineMessagesType } from 'react-intl';
-
-// frontend-platform currently doesn't provide types... do it ourselves.
-const defineMessages = _defineMessages as typeof defineMessagesType;
+import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
   collectionButton: {

src/library-authoring/component-info/messages.ts

@@ -1,8 +1,4 @@
-import { defineMessages as _defineMessages } from '@edx/frontend-platform/i18n';
-import type { defineMessages as defineMessagesType } from 'react-intl';
-
-// frontend-platform currently doesn't provide types... do it ourselves.
-const defineMessages = _defineMessages as typeof defineMessagesType;
+import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
   editNameButtonAlt: {

src/library-authoring/components/messages.ts

@@ -1,9 +1,4 @@
-import { defineMessages as _defineMessages } from '@edx/frontend-platform/i18n';
-
-import type { defineMessages as defineMessagesType } from 'react-intl';
-
-// frontend-platform currently doesn't provide types... do it ourselves.
-const defineMessages = _defineMessages as typeof defineMessagesType;
+import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
   componentCardMenuAlt: {

src/library-authoring/library-info/LibraryInfo.tsx

@@ -33,7 +33,7 @@ const LibraryInfo = ({ library } : LibraryInfoProps) => {
           </span>
           <span className="small">
             <FormattedDate
-              value={library.updated}
+              value={library.updated ?? undefined}
               year="numeric"
               month="long"
               day="2-digit"
@@ -46,7 +46,7 @@ const LibraryInfo = ({ library } : LibraryInfoProps) => {
           </span>
           <span className="small">
             <FormattedDate
-              value={library.created}
+              value={library.created ?? undefined}
               year="numeric"
               month="long"
               day="2-digit"

src/library-authoring/library-info/LibraryPublishStatus.tsx

@@ -46,7 +46,7 @@ const LibraryPublishStatus = ({ library } : LibraryPublishStatusProps) => {
     let isNewResult = false;
     let statusMessageResult : string;
     let extraStatusMessageResult : string | undefined;
-    let bodyMessageResult : string | undefined;
+    let bodyMessageResult : React.ReactNode | undefined;
 
     const buildDate = ((date : string) => (
       <b>

src/library-authoring/messages.ts

@@ -1,8 +1,4 @@
-import { defineMessages as _defineMessages } from '@edx/frontend-platform/i18n';
-import type { defineMessages as defineMessagesType } from 'react-intl';
-
-// frontend-platform currently doesn't provide types... do it ourselves.
-const defineMessages = _defineMessages as typeof defineMessagesType;
+import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
   headingSubtitle: {

src/search-manager/messages.ts

@@ -1,8 +1,4 @@
-import { defineMessages as _defineMessages } from '@edx/frontend-platform/i18n';
-import type { defineMessages as defineMessagesType } from 'react-intl';
-
-// frontend-platform currently doesn't provide types... do it ourselves.
-const defineMessages = _defineMessages as typeof defineMessagesType;
+import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
   clearFilters: {

src/search-modal/messages.ts

@@ -1,8 +1,4 @@
-import { defineMessages as _defineMessages } from '@edx/frontend-platform/i18n';
-import type { defineMessages as defineMessagesType } from 'react-intl';
-
-// frontend-platform currently doesn't provide types... do it ourselves.
-const defineMessages = _defineMessages as typeof defineMessagesType;
+import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
   searchAllCourses: {

src/studio-home/card-item/index.jsx

@@ -1,3 +1,4 @@
+/* eslint-disable react/require-default-props */
 import React from 'react';
 import { useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
@@ -20,14 +21,14 @@ import { trimSlashes } from './utils';
 const CardItem = ({
   intl,
   displayName,
-  lmsLink,
-  rerunLink,
+  lmsLink = '',
+  rerunLink = '',
   org,
   number,
-  run,
-  isLibraries,
-  courseKey,
-  isPaginated,
+  run = '',
+  isLibraries = false,
+  courseKey = '',
+  isPaginated = false,
   url,
 }) => {
   const {
@@ -105,15 +106,6 @@ const CardItem = ({
   );
 };
 
-CardItem.defaultProps = {
-  isLibraries: false,
-  isPaginated: false,
-  courseKey: '',
-  rerunLink: '',
-  lmsLink: '',
-  run: '',
-};
-
 CardItem.propTypes = {
   intl: intlShape.isRequired,
   displayName: PropTypes.string.isRequired,