diff --git a/src/components/ArchivedReportFooter.js b/src/components/ArchivedReportFooter.js index 71d331b68db0..df49afbc3f0b 100644 --- a/src/components/ArchivedReportFooter.js +++ b/src/components/ArchivedReportFooter.js @@ -14,6 +14,7 @@ import reportPropTypes from '../pages/reportPropTypes'; import * as ReportActionsUtils from '../libs/ReportActionsUtils'; import styles from '../styles/styles'; import * as PersonalDetailsUtils from '../libs/PersonalDetailsUtils'; +import ArchivedReportFooterSkeletonView from './ArchivedReportFooterSkeletonView'; const propTypes = { /** The reason this report was archived */ @@ -50,6 +51,9 @@ const defaultProps = { }; function ArchivedReportFooter(props) { + if (!props.reportClosedAction.reportActionID) { + return ; + } const archiveReason = lodashGet(props.reportClosedAction, 'originalMessage.reason', CONST.REPORT.ARCHIVE_REASON.DEFAULT); let displayName = PersonalDetailsUtils.getDisplayNameOrDefault(props.personalDetails, [props.report.ownerAccountID, 'displayName']); diff --git a/src/components/ArchivedReportFooterSkeletonView.js b/src/components/ArchivedReportFooterSkeletonView.js new file mode 100644 index 000000000000..5fbc3c9d9e2c --- /dev/null +++ b/src/components/ArchivedReportFooterSkeletonView.js @@ -0,0 +1,48 @@ +import PropTypes from 'prop-types'; +import React from 'react'; +import SkeletonViewContentLoader from 'react-content-loader/native'; +import {View} from 'react-native'; +import {Rect} from 'react-native-svg'; +import compose from '../libs/compose'; +import styles from '../styles/styles'; +import themeColors from '../styles/themes/default'; +import withLocalize from './withLocalize'; +import withWindowDimensions from './withWindowDimensions'; + +const propTypes = { + /** Whether to animate the skeleton view */ + shouldAnimate: PropTypes.bool, +}; + +const defaultTypes = { + shouldAnimate: true, +}; + +function ArchivedReportFooterSkeletonView(props) { + return ( + + + + + + ); +} + +ArchivedReportFooterSkeletonView.propTypes = propTypes; +ArchivedReportFooterSkeletonView.defaultProps = defaultTypes; + +ArchivedReportFooterSkeletonView.displayName = 'ArchivedReportFooterSkeletonView'; +export default compose(withWindowDimensions, withLocalize)(ArchivedReportFooterSkeletonView);