clean up

connorskorburg · Jun 30, 2022 · 87be933 · 87be933
1 parent 9cdc6ef
commit 87be933
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 15 deletions.
diff --git a/src/components/News/index.tsx b/src/components/News/index.tsx
@@ -31,27 +31,26 @@ const News = (): JSX.Element => {
             </a>
           ))
         : articles?.map(
-            ({
-              headline,
-              source,
-              url,
-              summary,
-            }: DashboardTypes.ArticleItem) => (
+            (
+              {
+                headline,
+                source,
+                url,
+                summary,
+                image,
+              }: DashboardTypes.ArticleItem,
+              idx
+            ) => (
               <a
-                key={headline}
+                key={idx}
                 href={url}
                 className="hover-bg-light bb-1 flex-between py-2"
               >
                 <div className="body-text">
                   <h4 className="font-bold">{source}</h4>
                   <p className="py-2">{summary}</p>
                 </div>
-                <img
-                  width="130px"
-                  height="74px"
-                  src="https://via.placeholder.com/150/92c952"
-                  alt={headline}
-                />
+                <img width="130px" height="74px" src={image} alt={headline} />
               </a>
             )
           )}

diff --git a/src/components/PopularStocks/index.tsx b/src/components/PopularStocks/index.tsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import { useStockContext } from "../../context";
 
 const PopularStocks = (): JSX.Element => {
-  const { fetchPopularStocks, popularStocks } = useStockContext();
+  const { fetchPopularStocks, popularStocks, updateTicker } = useStockContext();
   const [loading, setLoading] = useState<boolean>(false);
 
   useEffect(() => {
@@ -36,13 +36,18 @@ const PopularStocks = (): JSX.Element => {
                 companyName,
                 open,
                 close,
+                symbol,
               }: DashboardTypes.Stock,
               idx
             ) => {
               const isStockGreen = close > open;
               return (
                 idx < 4 && (
-                  <div key={idx} className="card">
+                  <div
+                    key={idx}
+                    className="card"
+                    onClick={() => updateTicker(symbol, companyName)}
+                  >
                     <h4 className="font-bold h-60">{companyName}</h4>
                     <h2 className={`text-${isStockGreen ? "green" : "red"}`}>
                       ${latestPrice.toFixed(2)}