Merge pull request #417 from opencollective/org-search

- feat(graphql/queries): add totalAmountSent, backer memberOf count to search query - feat(CollectiveCard): display ORGANIZATION stats - fix(pages/search): hide pagination if only one page of results
opencollective · May 18, 2018 · 187e138 · 187e138
2 parents 7efd87a + 5abcbc9
commit 187e138
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 2 deletions.
diff --git a/src/components/CollectiveCard.js b/src/components/CollectiveCard.js
@@ -216,7 +216,7 @@ class CollectiveCard extends React.Component {
             <div className="description">{description}</div>
           </div>
           <div className="footer">
-            { collective.stats &&
+            { collective.stats && collective.type === 'COLLECTIVE' &&
               <div className="stats">
                 <div className="backers">
                   <div className="value">{collective.stats.backers.all}</div>
@@ -238,6 +238,28 @@ class CollectiveCard extends React.Component {
                 </div>
               </div>
             }
+            { collective.stats && collective.memberOf && collective.type === 'ORGANIZATION' && (
+              <div className="stats">
+                <div className="backers">
+                  <div className="value">{collective.memberOf.length}</div>
+                  <div className="label">
+                    <FormattedMessage
+                      id="collective.card.memberOf.count"
+                      defaultMessage="{n, plural, one {collective} other {collectives}} backed"
+                      values={{ n: collective.memberOf.length }}
+                      />
+                  </div>
+                </div>
+                <div className="yearlyBudget">
+                  <div className="value">
+                    <Currency value={collective.stats.totalAmountSent} currency={collective.currency} />
+                  </div>
+                  <div className="label">
+                    <FormattedMessage id="collective.card.stats.totalAmountSent" defaultMessage="contributed" />
+                  </div>
+                </div>
+              </div>
+            ) }
             { membership &&
               <div className="membership">
                 <div className="role">{tierName}</div>

diff --git a/src/graphql/queries.js b/src/graphql/queries.js
@@ -679,11 +679,15 @@ export const searchCollectivesQuery = gql`
         stats {
           id
           balance
+          totalAmountSent
           yearlyBudget
           backers {
             all
           }
         }
+        memberOf(role: "BACKER") {
+          id
+        }
       }
       limit
       offset

diff --git a/src/pages/search.js b/src/pages/search.js
@@ -168,7 +168,7 @@ class SearchPage extends React.Component {
                 <p className="center"><em>No collectives found matching your query: &quot;{term}&quot;</em></p>
               )}
             </Row>
-            {showCollectives && collectives.length !== 0 && <Row>
+            {showCollectives && collectives.length !== 0 && total > limit && <Row>
               <ul className="pagination">
                 { Array(Math.ceil(total / limit)).fill(1).map((n, i) => (
                   <li key={i * limit} className={classNames({ active: (i * limit) === offset })}>