From 02247354a336b3ac960ffc397b231537ce3aebab Mon Sep 17 00:00:00 2001
From: mgabdev <>
Date: Tue, 14 Jan 2020 18:14:08 -0500
Subject: [PATCH] Added GroupListItem component

---
 .../gabsocial/components/group_list_item.js   | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 app/javascript/gabsocial/components/group_list_item.js

diff --git a/app/javascript/gabsocial/components/group_list_item.js b/app/javascript/gabsocial/components/group_list_item.js
new file mode 100644
index 00000000..59cee23b
--- /dev/null
+++ b/app/javascript/gabsocial/components/group_list_item.js
@@ -0,0 +1,40 @@
+import React from 'react';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { defineMessages, injectIntl } from 'react-intl';
+import { Link } from 'react-router-dom';
+import { shortNumberFormat } from '../utils/numbers';
+
+const messages = defineMessages({
+  members: { id: 'groups.card.members', defaultMessage: 'Members' },
+});
+
+export default
+@injectIntl
+class GroupListItem extends ImmutablePureComponent {
+  static propTypes = {
+    group: ImmutablePropTypes.map.isRequired,
+  }
+
+  render() {
+    const { intl, group } = this.props;
+
+    if (!group) return null;
+
+    return (
+      <div className='trends__item'>
+        <div className='trends__item__name'>
+          <Link to={`/groups/${group.get('id')}`}>
+            <strong>{group.get('title')}</strong>
+            <br />
+            <span>
+              {shortNumberFormat(group.get('member_count'))}
+              &nbsp;
+              {intl.formatMessage(messages.members)}
+            </span>
+          </Link>
+        </div>
+      </div>
+    );
+  }
+}
\ No newline at end of file