fix: limit 10 items

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 />} />
+      )}
     </>
   )
 }

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 />} />
+      )}
     </>
   )
 }