diff --git a/app/constants/colors.ts b/app/constants/colors.ts
index 53b723cbf..ab358679c 100644
--- a/app/constants/colors.ts
+++ b/app/constants/colors.ts
@@ -1,4 +1,4 @@
-export const STATUS_COLORS = {
+export const STATUS_COLORS: any = {
online: '#2de0a5',
busy: '#f5455c',
away: '#ffd21f',
diff --git a/app/containers/Status/Status.js b/app/containers/Status/Status.tsx
similarity index 68%
rename from app/containers/Status/Status.js
rename to app/containers/Status/Status.tsx
index 991402b35..8aab83600 100644
--- a/app/containers/Status/Status.js
+++ b/app/containers/Status/Status.tsx
@@ -1,11 +1,14 @@
import React from 'react';
-import PropTypes from 'prop-types';
import { CustomIcon } from '../../lib/Icons';
import { STATUS_COLORS } from '../../constants/colors';
-const Status = React.memo(({
- status, size, style, ...props
-}) => {
+interface IStatus {
+ status: string;
+ size: number;
+ style: any;
+}
+
+const Status = React.memo(({ status, size, style, ...props }: IStatus) => {
const name = `status-${ status }`;
const isNameValid = CustomIcon.hasIcon(name);
const iconName = isNameValid ? name : 'status-offline';
@@ -24,14 +27,4 @@ const Status = React.memo(({
);
});
-Status.propTypes = {
- status: PropTypes.string,
- size: PropTypes.number,
- style: PropTypes.any
-};
-Status.defaultProps = {
- status: 'offline',
- size: 32
-};
-
export default Status;
diff --git a/app/containers/Status/index.js b/app/containers/Status/index.js
deleted file mode 100644
index 7b389da2c..000000000
--- a/app/containers/Status/index.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import React, { memo } from 'react';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-
-import Status from './Status';
-
-const StatusContainer = memo(({ style, size = 32, status }) => );
-
-StatusContainer.propTypes = {
- style: PropTypes.any,
- size: PropTypes.number,
- status: PropTypes.string
-};
-
-const mapStateToProps = (state, ownProps) => ({
- status: state.meteor.connected ? (state.activeUsers[ownProps.id] && state.activeUsers[ownProps.id].status) : 'loading'
-});
-
-export default connect(mapStateToProps)(StatusContainer);
diff --git a/app/containers/Status/index.tsx b/app/containers/Status/index.tsx
new file mode 100644
index 000000000..6d49a8520
--- /dev/null
+++ b/app/containers/Status/index.tsx
@@ -0,0 +1,18 @@
+import React, { memo } from 'react';
+import { connect } from 'react-redux';
+
+import Status from './Status';
+
+interface IStatusContainer {
+ style: any;
+ size: number;
+ status: string;
+}
+
+const StatusContainer = memo(({ style, size = 32, status }: IStatusContainer) => );
+
+const mapStateToProps = (state: any, ownProps: any) => ({
+ status: state.meteor.connected ? (state.activeUsers[ownProps.id] && state.activeUsers[ownProps.id].status) : 'loading'
+});
+
+export default connect(mapStateToProps)(StatusContainer);