From 13447b697c9f64ca9e5056f1a95c0307aa545dab Mon Sep 17 00:00:00 2001 From: MuslemRahimi Date: Sat, 9 Nov 2024 22:14:38 +0100 Subject: [PATCH] add related stocks to sidebar --- src/lib/utils.ts | 38 ++++---- .../[tickerID]/dividends/+layout.server.ts | 28 ++++++ .../[tickerID]/dividends/+layout.svelte | 84 ++++++++---------- .../statistics/employees/+layout.server.ts | 28 ++++++ .../statistics/employees/+layout.svelte | 81 +++++++++-------- .../statistics/market-cap/+layout.server.ts | 28 ++++++ .../statistics/market-cap/+layout.svelte | 76 ++++++++-------- .../statistics/market-cap/+page.server.ts | 2 + .../statistics/market-cap/+page.svelte | 87 +++++++++++-------- 9 files changed, 272 insertions(+), 180 deletions(-) create mode 100644 src/routes/stocks/[tickerID]/dividends/+layout.server.ts create mode 100644 src/routes/stocks/[tickerID]/statistics/employees/+layout.server.ts create mode 100644 src/routes/stocks/[tickerID]/statistics/market-cap/+layout.server.ts diff --git a/src/lib/utils.ts b/src/lib/utils.ts index b1387e5b..526e9b6c 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -367,11 +367,18 @@ export function abbreviateNumber(number, addDollarSign = false) { } if (Math.abs(number) !== 0 && Math.abs(number) > 1000) { - const suffixes = ["", "K", "M", "B", "T", "Q", "Qu", "S", "O", "N", "D"]; + const suffixes = ["", "K", "M", "B", "B", "T", "Q", "Qu", "S", "O", "N", "D"]; const magnitude = Math.floor(Math.log10(Math.abs(number))); let index = Math.min(Math.floor(magnitude / 3), suffixes.length - 1); + + // Special case to keep numbers in trillions formatted as billions + if (index >= 4) { + index = 3; // Keep the suffix at "B" + } + let abbreviation = Math.abs(number) / Math.pow(10, index * 3); + // Set the desired number of decimals if (abbreviation >= 1000) { abbreviation = abbreviation.toFixed(1); index++; @@ -379,37 +386,28 @@ export function abbreviateNumber(number, addDollarSign = false) { abbreviation = abbreviation.toFixed(2); } - abbreviation = abbreviation.toLocaleString("en-US", { + abbreviation = parseFloat(abbreviation).toLocaleString("en-US", { maximumFractionDigits: 2, minimumFractionDigits: 2, }); - if (Math.abs(number) % 1000 === 0) { - abbreviation = abbreviation.replace("-", ""); - } - - if (abbreviation?.slice(-3) === ".00") { - abbreviation = abbreviation.slice(0, -3); - } - const formattedNumber = abbreviation + suffixes[index]; - if (addDollarSign) { - return (negative ? "-$" : "$") + formattedNumber; - } else { - return negative ? "-" + formattedNumber : formattedNumber; - } + return addDollarSign + ? (negative ? "-$" : "$") + formattedNumber + : negative + ? "-" + formattedNumber + : formattedNumber; } else if (Math.abs(number) >= 0 && Math.abs(number) < 1000) { - if (addDollarSign) { - return (negative ? "-$" : "$") + number; - } else { - return number; - } + return addDollarSign + ? (negative ? "-$" : "$") + number + : number.toString(); } else { return addDollarSign ? "$0" : "0"; } } + export const formatDate = (dateString) => { const date = new Date(dateString); return formatDistanceToNow(date, { diff --git a/src/routes/stocks/[tickerID]/dividends/+layout.server.ts b/src/routes/stocks/[tickerID]/dividends/+layout.server.ts new file mode 100644 index 00000000..49c34a91 --- /dev/null +++ b/src/routes/stocks/[tickerID]/dividends/+layout.server.ts @@ -0,0 +1,28 @@ +export const load = async ({ locals, params }) => { + + const getSimilarStocks = async () => { + const { apiKey, apiURL } = locals; + const postData = { + ticker: params.tickerID, + }; + + // make the POST request to the endpoint + const response = await fetch(apiURL + "/similar-stocks", { + method: "POST", + headers: { + "Content-Type": "application/json", + "X-API-KEY": apiKey, + }, + body: JSON.stringify(postData), + }); + + const output = await response.json(); + + return output; + }; + + // Make sure to return a promise + return { + getSimilarStocks: await getSimilarStocks(), + }; +}; diff --git a/src/routes/stocks/[tickerID]/dividends/+layout.svelte b/src/routes/stocks/[tickerID]/dividends/+layout.svelte index b8e46663..6a5b1726 100644 --- a/src/routes/stocks/[tickerID]/dividends/+layout.svelte +++ b/src/routes/stocks/[tickerID]/dividends/+layout.svelte @@ -1,37 +1,11 @@
@@ -66,29 +40,43 @@ {/if} - {#if newsList?.length !== 0} + {#if similarStocks?.length > 0}
-
-

- {$stockTicker} News -

-
    - {#each newsList?.slice(0, 10) as item} -
  • - {formatDate(item?.publishedDate)} ago - - {item?.title}Related Stocks + + + + + {#each similarStocks?.slice(0, 8) as item} + - - {item?.site} - + + {/each} - - + +
    CompanyEmployees
    {item?.symbol}{item?.dividendYield !== null + ? item?.dividendYield + "%" + : "n/a"}
{/if} diff --git a/src/routes/stocks/[tickerID]/statistics/employees/+layout.server.ts b/src/routes/stocks/[tickerID]/statistics/employees/+layout.server.ts new file mode 100644 index 00000000..49c34a91 --- /dev/null +++ b/src/routes/stocks/[tickerID]/statistics/employees/+layout.server.ts @@ -0,0 +1,28 @@ +export const load = async ({ locals, params }) => { + + const getSimilarStocks = async () => { + const { apiKey, apiURL } = locals; + const postData = { + ticker: params.tickerID, + }; + + // make the POST request to the endpoint + const response = await fetch(apiURL + "/similar-stocks", { + method: "POST", + headers: { + "Content-Type": "application/json", + "X-API-KEY": apiKey, + }, + body: JSON.stringify(postData), + }); + + const output = await response.json(); + + return output; + }; + + // Make sure to return a promise + return { + getSimilarStocks: await getSimilarStocks(), + }; +}; diff --git a/src/routes/stocks/[tickerID]/statistics/employees/+layout.svelte b/src/routes/stocks/[tickerID]/statistics/employees/+layout.svelte index e9a26653..b731b721 100644 --- a/src/routes/stocks/[tickerID]/statistics/employees/+layout.svelte +++ b/src/routes/stocks/[tickerID]/statistics/employees/+layout.svelte @@ -1,7 +1,10 @@
@@ -35,44 +38,46 @@
{/if} - -
- 0} +
-
-

- Options Flow -

- -
- - Get realtime options flow and customize your screener - - -
- -
- -
-

- Stock Screener -

- -
- - Build your Stock Screener to find profitable stocks. - - -
+

Related Stocks

+ + + + + {#each similarStocks?.slice(0, 8) as item} + + + + {/each} + +
CompanyEmployees
{item?.symbol}{parseFloat(item?.employees).toLocaleString("en-US", { + maximumFractionDigits: 2, + minimumFractionDigits: 0, + })}
+
+ {/if} diff --git a/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.server.ts b/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.server.ts new file mode 100644 index 00000000..49c34a91 --- /dev/null +++ b/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.server.ts @@ -0,0 +1,28 @@ +export const load = async ({ locals, params }) => { + + const getSimilarStocks = async () => { + const { apiKey, apiURL } = locals; + const postData = { + ticker: params.tickerID, + }; + + // make the POST request to the endpoint + const response = await fetch(apiURL + "/similar-stocks", { + method: "POST", + headers: { + "Content-Type": "application/json", + "X-API-KEY": apiKey, + }, + body: JSON.stringify(postData), + }); + + const output = await response.json(); + + return output; + }; + + // Make sure to return a promise + return { + getSimilarStocks: await getSimilarStocks(), + }; +}; diff --git a/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.svelte b/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.svelte index f345d63b..58e2c756 100644 --- a/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.svelte +++ b/src/routes/stocks/[tickerID]/statistics/market-cap/+layout.svelte @@ -1,7 +1,9 @@
@@ -17,7 +19,7 @@ diff --git a/src/routes/stocks/[tickerID]/statistics/market-cap/+page.server.ts b/src/routes/stocks/[tickerID]/statistics/market-cap/+page.server.ts index 8696411e..af090b24 100644 --- a/src/routes/stocks/[tickerID]/statistics/market-cap/+page.server.ts +++ b/src/routes/stocks/[tickerID]/statistics/market-cap/+page.server.ts @@ -20,6 +20,8 @@ export const load = async ({ locals, params }) => { return output; }; + + // Make sure to return a promise return { getHistoricalMarketCap: await getHistoricalMarketCap(), diff --git a/src/routes/stocks/[tickerID]/statistics/market-cap/+page.svelte b/src/routes/stocks/[tickerID]/statistics/market-cap/+page.svelte index 0ab6c0d5..e3e9c828 100644 --- a/src/routes/stocks/[tickerID]/statistics/market-cap/+page.svelte +++ b/src/routes/stocks/[tickerID]/statistics/market-cap/+page.svelte @@ -407,7 +407,7 @@ {#if rawData?.length !== 0}
-
- Market Cap -
- {abbreviateNumber(data?.getStockQuote?.marketCap)} +
+
+
+ Market Cap +
+
+ {abbreviateNumber(data?.getStockQuote?.marketCap)} +
-
- Category -
- {#if capCategory} - - {capCategory.name} - - {:else} - n/a - {/if} +
+
+
Category
+
+ {#if capCategory} + + {capCategory.name} + + {:else} + n/a + {/if} +
-
- 1-Year Change -
- 198.62% +
+
+
+ 1-Year Change +
+
+ {abbreviateNumber(changePercentageYearAgo?.toFixed(2))}% +
@@ -592,10 +605,10 @@