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);