[MM-56845] Convert ./components/suggestion/suggestion_date.tsx from Class Component to Function Component (#26236)

Co-authored-by: Mattermost Build <build@mattermost.com>

webapp/channels/src/components/suggestion/suggestion_date.tsx

@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import React from 'react';
+import React, {memo} from 'react';
 
 import Popover from 'components/widgets/popover';
 
@@ -27,31 +27,24 @@ type Props = {
     components: Array<React.ComponentType<SuggestionItem>>;
 }
 
-export default class SuggestionDate extends React.PureComponent<Props> {
-    render() {
-        if (this.props.items.length === 0) {
+const SuggestionDate = ({
+    items,
+    terms,
+    components,
+    matchedPretext,
+    onCompleteWord,
+    preventClose,
+    handleEscape,
+}: Props) => {
+    if (items.length === 0) {
         return null;
     }
 
-        const item = this.props.items[0];
-        const term = this.props.terms[0];
+    const item = items[0];
+    const term = terms[0];
 
     // ReactComponent names need to be upper case when used in JSX
-        const Component = this.props.components[0];
-
-        const itemComponent = (
-            <Component
-                key={term}
-                ref={term}
-                item={item}
-                term={term}
-                matchedPretext={this.props.matchedPretext[0]}
-                isSelection={false}
-                onClick={this.props.onCompleteWord}
-                preventClose={this.props.preventClose}
-                handleEscape={this.props.handleEscape}
-            />
-        );
+    const Component = components[0];
 
     return (
         <Popover
@@ -59,8 +52,19 @@ export default class SuggestionDate extends React.PureComponent<Props> {
             className='search-help-popover autocomplete visible'
             placement='bottom'
         >
-                {itemComponent}
+            <Component
+                key={term}
+                ref={term}
+                item={item}
+                term={term}
+                matchedPretext={matchedPretext[0]}
+                isSelection={false}
+                onClick={onCompleteWord}
+                preventClose={preventClose}
+                handleEscape={handleEscape}
+            />
         </Popover>
     );
-    }
-}
+};
+
+export default memo(SuggestionDate);