[SIP-36] Migrate Header.jsx to Header.tsx

[amym-li]

SUMMARY

To migrate the Header component, the following steps were performed:

1. Renamed the index file from index.js => index.ts
2. Renamed the component file from Header.jsx => Header.tsx
3. Made the following type changes in Header.tsx:
   • Replaced the propTypes const with an interface HeaderProps definition
   • Created interface ComponentMeta for header configuration options
   • Created interface ComponentShape for the header instance
   • Created interface HeaderState for the local state
   • Created type HeaderStyleValue for the headerSize field values
   • Created type BackgroundStyleValue for the background field values
4. Renamed the test file from Header.test.jsx => Header.test.tsx
5. Made the following type changes in Header.test.tsx
   • Created interface HeaderTestProps to mirror interface HeaderProps in Header.tsx
6. Addressed all eslint warnings and errors

TESTING INSTRUCTIONS

CI and unit tests, confirm that the Header component on the Dashboard page renders as expected.

ADDITIONAL INFORMATION

• Has associated issue: [SIP-36] Proposal for standardizing use of TypeScript #9101
• Required feature flags:
• Changes UI
• Includes DB Migration (follow approval process in SIP-59)
  • Migration is atomic, supports rollback & is backwards-compatible
  • Confirm DB migration upgrade and downgrade tested
  • Runtime estimates and downtime expectations provided
• Introduces new feature or API
• Removes existing feature or API

REVIEWERS

to: