gab-social/app/javascript/gabsocial/components/popover/search_popover.js

import React from 'react'
import PropTypes from 'prop-types'

export default class SearchPopover extends React.PureComponent {
  render() {
    // : todo :
    // <div className='search-popout-container' style={{ ...style, position: 'absolute', zIndex: 1000 }}>
    //   <Motion defaultStyle={{ opacity: 0, scaleX: 1, scaleY: 1 }} style={{ opacity: spring(1, { damping: 35, stiffness: 400 }), scaleX: spring(1, { damping: 35, stiffness: 400 }), scaleY: spring(1, { damping: 35, stiffness: 400 }) }}>
    //     {({ opacity, scaleX, scaleY }) => (
    //       <div className='search-popout' style={{ opacity: opacity, transform: `scale(${scaleX}, ${scaleY})` }}>
    //         <h4>
    //           <FormattedMessage id='search_popout.search_format' defaultMessage='Advanced search format' />
    //         </h4>
    //         <ul>
    //           <li>
    //             <em>#example</em>
    //             <FormattedMessage id='search_popout.tips.hashtag' defaultMessage='hashtag' />
    //           </li>
    //           <li>
    //             <em>@username</em>
    //             <FormattedMessage id='search_popout.tips.user' defaultMessage='user' />
    //           </li>
    //           <li>
    //             <em>URL</em>
    //             <FormattedMessage id='search_popout.tips.user' defaultMessage='user' />
    //           </li>
    //           <li>
    //             <em>URL</em>
    //             <FormattedMessage id='search_popout.tips.status' defaultMessage='status' />
    //           </li>
    //         </ul>
    //         {
    //           searchEnabled
    //             ? <FormattedMessage id='search_popout.tips.full_text' defaultMessage='Simple text returns statuses you have written, favorited, reposted, or have been mentioned in, as well as matching usernames, display names, and hashtags.' />
    //             : <FormattedMessage id='search_popout.tips.text' defaultMessage='Simple text returns matching display names, usernames and hashtags' />
    //         }
    //       </div>
    //     )}
    //   </Motion>
    // </div>

    return (
      <div>
        { /* */}
      </div>
    )
  }
}