diff --git a/src/pages/home/report/ReportFooter.js b/src/pages/home/report/ReportFooter.js
index f0541be88ea4..92838ecf9451 100644
--- a/src/pages/home/report/ReportFooter.js
+++ b/src/pages/home/report/ReportFooter.js
@@ -57,53 +57,46 @@ const defaultProps = {
     shouldDisableCompose: false,
 };
 
-class ReportFooter extends React.Component {
-    /**
-     * @returns {Object}
-     */
-    getChatFooterStyles() {
-        return {...styles.chatFooter, minHeight: !this.props.isOffline ? CONST.CHAT_FOOTER_MIN_HEIGHT : 0};
-    }
+function ReportFooter(props) {
+    const chatFooterStyles = {...styles.chatFooter, minHeight: !props.isOffline ? CONST.CHAT_FOOTER_MIN_HEIGHT : 0};
+    const isArchivedRoom = ReportUtils.isArchivedRoom(props.report);
+    const isAllowedToComment = ReportUtils.isAllowedToComment(props.report);
+    const hideComposer = isArchivedRoom || !_.isEmpty(props.errors) || !isAllowedToComment;
 
-    render() {
-        const isArchivedRoom = ReportUtils.isArchivedRoom(this.props.report);
-        const isAllowedToComment = ReportUtils.isAllowedToComment(this.props.report);
-        const hideComposer = isArchivedRoom || !_.isEmpty(this.props.errors) || !isAllowedToComment;
-
-        return (
-            <>
-                {(isArchivedRoom || hideComposer) && (
-                    <View style={[styles.chatFooter, this.props.isSmallScreenWidth ? styles.mb5 : null]}>
-                        {isArchivedRoom && <ArchivedReportFooter report={this.props.report} />}
-                        {!this.props.isSmallScreenWidth && (
-                            <View style={styles.offlineIndicatorRow}>{hideComposer && <OfflineIndicator containerStyles={[styles.chatItemComposeSecondaryRow]} />}</View>
+    return (
+        <>
+            {(isArchivedRoom || hideComposer) && (
+                <View style={[styles.chatFooter, props.isSmallScreenWidth ? styles.mb5 : null]}>
+                    {isArchivedRoom && <ArchivedReportFooter report={props.report} />}
+                    {!props.isSmallScreenWidth && (
+                        <View style={styles.offlineIndicatorRow}>{hideComposer && <OfflineIndicator containerStyles={[styles.chatItemComposeSecondaryRow]} />}</View>
+                    )}
+                </View>
+            )}
+            {!hideComposer && (props.shouldShowComposeInput || !props.isSmallScreenWidth) && (
+                <View style={[chatFooterStyles, props.isComposerFullSize && styles.chatFooterFullCompose]}>
+                    <SwipeableView onSwipeDown={Keyboard.dismiss}>
+                        {Session.isAnonymousUser() ? (
+                            <AnonymousReportFooter report={props.report} />
+                        ) : (
+                            <ReportActionCompose
+                                onSubmit={props.onSubmitComment}
+                                reportID={props.report.reportID.toString()}
+                                reportActions={props.reportActions}
+                                report={props.report}
+                                pendingAction={props.pendingAction}
+                                isComposerFullSize={props.isComposerFullSize}
+                                disabled={props.shouldDisableCompose}
+                            />
                         )}
-                    </View>
-                )}
-                {!hideComposer && (this.props.shouldShowComposeInput || !this.props.isSmallScreenWidth) && (
-                    <View style={[this.getChatFooterStyles(), this.props.isComposerFullSize && styles.chatFooterFullCompose]}>
-                        <SwipeableView onSwipeDown={Keyboard.dismiss}>
-                            {Session.isAnonymousUser() ? (
-                                <AnonymousReportFooter report={this.props.report} />
-                            ) : (
-                                <ReportActionCompose
-                                    onSubmit={this.props.onSubmitComment}
-                                    reportID={this.props.report.reportID.toString()}
-                                    reportActions={this.props.reportActions}
-                                    report={this.props.report}
-                                    pendingAction={this.props.pendingAction}
-                                    isComposerFullSize={this.props.isComposerFullSize}
-                                    disabled={this.props.shouldDisableCompose}
-                                />
-                            )}
-                        </SwipeableView>
-                    </View>
-                )}
-            </>
-        );
-    }
+                    </SwipeableView>
+                </View>
+            )}
+        </>
+    );
 }
 
+ReportFooter.displayName = 'ReportFooter';
 ReportFooter.propTypes = propTypes;
 ReportFooter.defaultProps = defaultProps;
 export default compose(