From d480d14100dc7900605186c4f012eb2728d5be20 Mon Sep 17 00:00:00 2001
From: Yasuaki Uechi <y@uechi.io>
Date: Wed, 7 Aug 2019 14:08:45 +0900
Subject: [PATCH] fix: limit 10 items

---
 api/services/appstore.js                     |  6 ++---
 web/src/components/cards/AppStoreCard.js     | 24 +++++++++--------
 web/src/components/cards/GithubSearchCard.js | 27 ++++++++++++--------
 3 files changed, 33 insertions(+), 24 deletions(-)

diff --git a/api/services/appstore.js b/api/services/appstore.js
index 44e1743..036663b 100644
--- a/api/services/appstore.js
+++ b/api/services/appstore.js
@@ -8,12 +8,12 @@ module.exports = async (req, res) => {
   }
 
   const term = encodeURIComponent(query)
-  // const country = 'us'
-  const limit = 3
+  const countryCode = country || 'us'
+  const limit = 10
 
   try {
     const response = await fetch(
-      `https://itunes.apple.com/search?media=software&entity=software,iPadSoftware,macSoftware&country=${country}&limit=${limit}&term=${term}`,
+      `https://itunes.apple.com/search?media=software&entity=software,iPadSoftware,macSoftware&country=${countryCode}&limit=${limit}&term=${term}`,
       'GET'
     )
     const body = await response.json()
diff --git a/web/src/components/cards/AppStoreCard.js b/web/src/components/cards/AppStoreCard.js
index 86d4efd..5346964 100644
--- a/web/src/components/cards/AppStoreCard.js
+++ b/web/src/components/cards/AppStoreCard.js
@@ -1,7 +1,7 @@
 import React from 'react'
 import useFetch from 'fetch-suspense'
 import { useTranslation } from 'react-i18next'
-import { FaAppStore } from 'react-icons/fa'
+import { FaAppStore, FaInfoCircle } from 'react-icons/fa'
 
 import { Card, Result } from '../Cards'
 
@@ -15,15 +15,19 @@ function Search({ query }) {
 
   return (
     <>
-      {apps.map((app) => (
-        <Result
-          title={app.name}
-          message={`Price: ${app.price}`}
-          link={app.viewURL}
-          icon={<FaAppStore />}
-          key={app.id}
-        />
-      ))}
+      {apps.length > 0 ? (
+        apps.map((app) => (
+          <Result
+            title={app.name}
+            message={`Price: ${app.price}`}
+            link={app.viewURL}
+            icon={<FaAppStore />}
+            key={app.id}
+          />
+        ))
+      ) : (
+        <Result title="No Result" icon={<FaInfoCircle />} />
+      )}
     </>
   )
 }
diff --git a/web/src/components/cards/GithubSearchCard.js b/web/src/components/cards/GithubSearchCard.js
index f606bd7..9d13fad 100644
--- a/web/src/components/cards/GithubSearchCard.js
+++ b/web/src/components/cards/GithubSearchCard.js
@@ -1,28 +1,33 @@
 import React from 'react'
 import useFetch from 'fetch-suspense'
 import { useTranslation } from 'react-i18next'
-import { FaGithub } from 'react-icons/fa'
+import { FaGithub, FaInfoCircle } from 'react-icons/fa'
 
 import { Card, Result } from '../Cards'
 
 function Search({ query }) {
   const searchQuery = encodeURIComponent(`${query} in:name`)
+  const limit = 10
   const response = useFetch(
-    `https://api.github.com/search/repositories?q=${searchQuery}&per_page=3`
+    `https://api.github.com/search/repositories?q=${searchQuery}&per_page=${limit}`
   )
   const repos = response.items
 
   return (
     <>
-      {repos.map((repo) => (
-        <Result
-          title={repo.full_name}
-          message={`Star: ${repo.stargazers_count}`}
-          link={repo.html_url}
-          icon={<FaGithub />}
-          key={repo.id}
-        />
-      ))}
+      {repos.length > 0 ? (
+        repos.map((repo) => (
+          <Result
+            title={repo.full_name}
+            message={`Star: ${repo.stargazers_count}`}
+            link={repo.html_url}
+            icon={<FaGithub />}
+            key={repo.id}
+          />
+        ))
+      ) : (
+        <Result title="No Result" icon={<FaInfoCircle />} />
+      )}
     </>
   )
 }