solution: useApi custom hook

ShMcK · ShMcK · commit 0de5c05a6f79 · 2019-12-24T09:58:38.000-08:00
diff --git a/src/components/Feed/index.js b/src/components/Feed/index.js
@@ -6,31 +6,29 @@ import "./styles.css";
 import fetchData from "../../services/api";
 
 export const useApi = url => {
-  // TODO: loading, error, data loader from API
-  // TODO: pass the url in so that we call fetchData(url)
-  return {
-    loading,
-    error,
-    data
-  };
-};
-
-export const Feed = () => {
   const [loading, setLoading] = React.useState(true);
   const [error, setError] = React.useState(null);
   const [data, setData] = React.useState(null);
 
   React.useEffect(() => {
-    fetchData("messages")
+    fetchData(url)
       .then(result => {
         setData(result);
         setLoading(false);
       })
       .catch(error => {
         setError(error);
       });
-  }, []);
+  }, [url]);
+  return {
+    loading,
+    error,
+    data
+  };
+};
 
+export const Feed = () => {
+  const { loading, error, data } = useApi("messages");
   if (loading) {
     return (
       <div className="Feed">
