Test : Change dropdown to popover

src/client/js/components/User/SeenUserList.jsx

@@ -15,11 +15,12 @@ class SeenUserList extends React.Component {
     const { pageContainer } = this.props;
     return (
       <div className="dropdown text-right ">
-        <button className="btn btn-seen-user-list border-0 px-1 py-0 dropdown-toggle " type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        {/* <button className="btn btn-seen-user-list border-0 px-1 py-0 dropdown-toggle " type="button"> */}
+        <button type="button" className="btn btn-seen-user-list border-0 px-1 py-0" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
           <span className="mr-2 svg footstamp-icon"><FootstampIcon /></span>
           <span className="seen-user-count">{pageContainer.state.countOfSeenUsers}</span>
         </button>
-        <span className="dropdown-menu dropdown-menu-right px-2 col user-list-content text-truncate text-muted">
+        <span className="dropdown-menu dropdown-menu-right px-2 text-right user-list-content text-truncate text-muted">
           <UserPictureList users={pageContainer.state.seenUsers} />
         </span>
       </div>
@@ -28,44 +29,6 @@ class SeenUserList extends React.Component {
 
 }
 
-
-// class SeenUserList extends React.Component {
-
-//   render() {
-//     const { pageContainer } = this.props;
-//     return (
-//       <div className="user-list-content text-truncate text-muted text-right">
-//         <button type="button" className="btn link" data-toggle="tooltip" data-placement="bottom" title="a">
-//           <span className="text-danger">
-//             <span className="seen-user-count">{pageContainer.state.sumOfSeenUsers}</span>
-//             <i className="fa fa-fw fa-paw"></i>
-//           </span>
-//         </button>
-//       </div>
-//     );
-//   }
-
-// }
-
-// class SeenUserList extends React.Component {
-
-//   render() {
-//     const { pageContainer } = this.props;
-//     return (
-//       <div className="user-list-content text-truncate text-muted text-right">
-//         <span className="text-danger">
-//           <span className="seen-user-count">{pageContainer.state.sumOfSeenUsers}</span>
-//           <i className="fa fa-fw fa-paw"></i>
-//         </span>
-//         <span className="mr-1">
-//           <UserPictureList users={pageContainer.state.seenUsers} />
-//         </span>
-//       </div>
-//     );
-//   }
-
-// }
-
 SeenUserList.propTypes = {
   pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
 };