diff --git a/components/announcement_bar/version_bar/__snapshots__/version_bar.test.jsx.snap b/components/announcement_bar/version_bar/__snapshots__/version_bar.test.tsx.snap
similarity index 100%
rename from components/announcement_bar/version_bar/__snapshots__/version_bar.test.jsx.snap
rename to components/announcement_bar/version_bar/__snapshots__/version_bar.test.tsx.snap
diff --git a/components/announcement_bar/version_bar/index.js b/components/announcement_bar/version_bar/index.ts
similarity index 66%
rename from components/announcement_bar/version_bar/index.js
rename to components/announcement_bar/version_bar/index.ts
index cec2391b8acc..47a8a4b034ac 100644
--- a/components/announcement_bar/version_bar/index.js
+++ b/components/announcement_bar/version_bar/index.ts
@@ -3,9 +3,11 @@
 
 import {connect} from 'react-redux';
 
-import VersionBar from './version_bar.jsx';
+import {GlobalState} from 'mattermost-redux/types/store';
 
-function mapStateToProps(state) {
+import VersionBar from './version_bar';
+
+function mapStateToProps(state:GlobalState) {
     return {
         serverVersion: state.entities.general.serverVersion,
     };
diff --git a/components/announcement_bar/version_bar/version_bar.test.jsx b/components/announcement_bar/version_bar/version_bar.test.tsx
similarity index 98%
rename from components/announcement_bar/version_bar/version_bar.test.jsx
rename to components/announcement_bar/version_bar/version_bar.test.tsx
index 62fb7215d781..68fdb7bf2a8f 100644
--- a/components/announcement_bar/version_bar/version_bar.test.jsx
+++ b/components/announcement_bar/version_bar/version_bar.test.tsx
@@ -4,7 +4,7 @@
 import React from 'react';
 import {shallow} from 'enzyme';
 
-import VersionBar from 'components/announcement_bar/version_bar/version_bar.jsx';
+import VersionBar from 'components/announcement_bar/version_bar/version_bar';
 import AnnouncementBar from 'components/announcement_bar/default_announcement_bar';
 
 describe('components/VersionBar', () => {
diff --git a/components/announcement_bar/version_bar/version_bar.jsx b/components/announcement_bar/version_bar/version_bar.tsx
similarity index 87%
rename from components/announcement_bar/version_bar/version_bar.jsx
rename to components/announcement_bar/version_bar/version_bar.tsx
index b736f596eb66..88b79b79483d 100644
--- a/components/announcement_bar/version_bar/version_bar.jsx
+++ b/components/announcement_bar/version_bar/version_bar.tsx
@@ -2,7 +2,6 @@
 // See LICENSE.txt for license information.
 
 import React from 'react';
-import PropTypes from 'prop-types';
 
 import {FormattedMessage} from 'react-intl';
 
@@ -11,12 +10,16 @@ import {AnnouncementBarTypes} from 'utils/constants';
 
 import AnnouncementBar from '../default_announcement_bar';
 
-export default class VersionBar extends React.PureComponent {
-    static propTypes = {
-        serverVersion: PropTypes.string,
-    };
+interface Props {
+    serverVersion: string,
+}
+
+interface State {
+    serverVersionOnAppLoad: string,
+}
 
-    constructor(props) {
+export default class VersionBar extends React.PureComponent <Props, State> {
+    constructor(props:Props) {
         super(props);
 
         this.state = {
@@ -24,7 +27,7 @@ export default class VersionBar extends React.PureComponent {
         };
     }
 
-    static getDerivedStateFromProps(props, state) {
+    static getDerivedStateFromProps(props:Props, state:State) {
         if (!state.serverVersionOnAppLoad && props.serverVersion) {
             return {
                 serverVersionOnAppLoad: props.serverVersion,