implements collaborators but needs authentication

Author: bdbch

docs/components/Collaborators.jsx

@@ -0,0 +1,26 @@
+import React from "react";
+import { useCollaborators } from "../../src";
+
+const Forks = () => {
+  const { collaborators, loading, error } = useCollaborators(
+    "facebook",
+    "react"
+  );
+
+  return (
+    <div>
+      <h1>Collaborators by repo</h1>
+      {loading && <div>Loading collaborators from Github</div>}
+      {error && <div>{error}</div>}
+      {collaborators &&
+        collaborators.length > 0 &&
+        collaborators.map(collaborator => (
+          <div key={collaborator.id}>
+            <h4>{collaborator.login}</h4>
+          </div>
+        ))}
+    </div>
+  );
+};
+
+export default Forks;

docs/example.js

@@ -7,6 +7,7 @@ import Branch from "./components/Branch";
 import LatestRelease from "./components/LatestRelease";
 import TaggedRelease from "./components/TaggedRelease";
 import Forks from "./components/Forks";
+import Collaborators from "./components/Collaborators";
 
 function App() {
   return (
@@ -25,6 +26,8 @@ function App() {
       <hr />
       <Forks />
       <hr />
+      <Collaborators />
+      <hr />
     </div>
   );
 }

src/index.js

@@ -5,6 +5,7 @@ import useBranch from './lib/branch/useBranch'
 import useLatestRelease from './lib/release/useLatestRelease'
 import useTaggedRelease from './lib/release/useTaggedRelease'
 import useForks from './lib/repository/useForks'
+import useCollaborators from './lib/repository/useCollaborators'
 
 export {
   useRepos,
@@ -14,6 +15,7 @@ export {
   useLatestRelease,
   useTaggedRelease,
   useForks,
+  useCollaborators,
 }
 
 export default {
@@ -24,4 +26,5 @@ export default {
   useLatestRelease,
   useTaggedRelease,
   useForks,
+  useCollaborators,
 }

src/lib/repository/useCollaborators.js

@@ -0,0 +1,35 @@
+import {
+  useState,
+  useEffect
+} from 'react'
+
+export default function useCollaborators(owner, repo) {
+  const [collaborators, setCollaborators] = useState([])
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState(null)
+
+  useEffect(() => {
+    if (repo && repo.length > 0 && owner && owner.length) {
+      setLoading(true)
+      setError(null)
+      fetch(`https://api.github.com/repos/${owner}/${repo}/collaborators`)
+        .then(res => res.json())
+        .then(data => {
+          setLoading(false)
+          setCollaborators(data)
+          setError(null)
+        })
+        .catch(e => {
+          setLoading(false)
+          setCollaborators([])
+          setError(e)
+        })
+    }
+  }, [owner, repo])
+
+  return {
+    collaborators,
+    loading,
+    error
+  }
+}