diff --git a/src/routes/etf/[tickerID]/dividends/+page.svelte b/src/routes/etf/[tickerID]/dividends/+page.svelte index ffa38c6a..41050440 100644 --- a/src/routes/etf/[tickerID]/dividends/+page.svelte +++ b/src/routes/etf/[tickerID]/dividends/+page.svelte @@ -33,11 +33,11 @@ // Combine the data into an array of objects to keep them linked const combinedData = rawData?.history?.map(item => ({ date: item?.paymentDate, - dividend: item?.adjDividend + dividend: item?.adjDividend?.toFixed(2) })); // Sort the combined data array based on the date - combinedData.sort((a, b) => new Date(a.date) - new Date(b.date)); + combinedData.sort((a, b) => new Date(a?.date) - new Date(b?.date)); // Separate the sorted data back into individual arrays const dates = combinedData.map(item => item.date); @@ -51,7 +51,7 @@ }, animation: false, grid: { - left: '2%', + left: '3%', right: '3%', bottom: '10%', top: '10%', @@ -69,24 +69,15 @@ }, yAxis: [ { - type: 'value', + type: 'value', + splitLine: { + show: false, // Disable x-axis grid lines + }, + axisLabel: { - color: '#fff', - }, - splitLine: { - show: false, // Disable x-axis grid lines - }, - }, - { - type: 'value', - axisLabel: { - show: false, - formatter: '{value} %', - }, - splitLine: { - show: false, - }, - }, + show: false // Hide y-axis labels + } + }, ], series: [ { @@ -182,64 +173,68 @@ {#if rawData?.history?.length !== 0} -
-
-
- Dividend Yield -
-
- {dividendYield !== '0.00' ? dividendYield : '0'}% -
-
-
-
- Annual Dividend -
-
- ${annualDividend !== '0.00' ? annualDividend : '0'} -
-
-
-
- Ex-Dividend Date -
-
- {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} -
-
- -
-
- Payout Frequency -
-
- {payoutFrequency === 4 ? 'Quartely' : payoutFrequency === 2 ? 'Half-Yearly' : payoutFrequency === 1 ? 'Annually' : 'n/a'} -
-
- -
-
- Payout Ratio -
+ +
+
+
- {payoutRatio !== '0.00' ? payoutRatio : '0'}% + {dividendYield !== '0.00' ? dividendYield : '0'}%
- -
-
+
+ + +
+ ${annualDividend !== '0.00' ? annualDividend : '0'} +
+
+
+ + +
+ {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} +
+
+ +
+ + +
+ {payoutFrequency === 4 ? 'Quartely' : payoutFrequency === 2 ? 'Half-Yearly' : payoutFrequency === 1 ? 'Annually' : 'n/a'} +
+
+
+ + +
+ {payoutRatio !== '0.00' ? payoutRatio : '0'}% +
+
+
+
-
- {dividendGrowth !== 'NaN' ? dividendGrowth+'%' : '-'} -
-
- - + + +
+ {dividendGrowth !== 'NaN' ? dividendGrowth+'%' : '-'} +
- +
+ + +

diff --git a/src/routes/politicians/[slug]/+page.svelte b/src/routes/politicians/[slug]/+page.svelte index f233a2c1..45a66725 100644 --- a/src/routes/politicians/[slug]/+page.svelte +++ b/src/routes/politicians/[slug]/+page.svelte @@ -81,7 +81,7 @@ use([BarChart, GridComponent, TooltipComponent, CanvasRenderer]) // Handle default case if needed break; } - goto("/list/" + path); + return path; } @@ -419,10 +419,12 @@ use([BarChart, GridComponent, TooltipComponent, CanvasRenderer]) {#each rawData?.topSectors as item} - {#each Object.entries(item) as [name, value]} - sectorSelector(name)} class="text-white cursor-pointer sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] bg-[#141417] border-b border-[#141417]"> - - {name} + {#each Object?.entries(item) as [name, value]} + + + + {name} + {value?.toFixed(2)}% @@ -511,7 +513,7 @@ use([BarChart, GridComponent, TooltipComponent, CanvasRenderer]) {#each displayList as item} - goto(`/${item?.assetType === 'stock' ? 'stocks' : item?.assetType === 'etf' ? 'etf' : 'crypto'}/${item?.ticker}`)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#27272A] cursor-pointer"> +
@@ -519,7 +521,7 @@ use([BarChart, GridComponent, TooltipComponent, CanvasRenderer]) stock logo
- {item?.ticker?.replace('_',' ')} + {item?.ticker?.replace('_',' ')} {item?.name?.length > 20 ? item?.name?.slice(0,20)+'...' : item?.name}

diff --git a/src/routes/stocks/[tickerID]/dividends/+page.svelte b/src/routes/stocks/[tickerID]/dividends/+page.svelte index d3ef1826..370de083 100644 --- a/src/routes/stocks/[tickerID]/dividends/+page.svelte +++ b/src/routes/stocks/[tickerID]/dividends/+page.svelte @@ -1,355 +1,350 @@ - - - - - - - - {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} {$displayCompanyName} ({$stockTicker}) Dividend History, Dates & Yield · stocknear - - - - - - - - - - - - - - - - - - + yAxis: [ + { + type: 'value', + splitLine: { + show: false, // Disable x-axis grid lines + }, -
-
-
-
-
-

- Dividends -

+ axisLabel: { + show: false // Hide y-axis labels + } + }, + ], + series: [ + { + name: 'Dividend per Share', + data: dividendList, + type: 'bar', + smooth: true, + }, + ], + }; + + + return options; + } + + + + + + onMount(async() => { + optionsDividend = await plotDividend() + isLoaded = true; + }) + + + + + + + + + + + {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} {$displayCompanyName} ({$stockTicker}) Dividend History, Dates & Yield · stocknear + + + + + + + + + + + + + + + + - + + +
+
+
+
+
+

+ Dividends +

+ + + - -
- - - - {#if rawData?.history?.length !== 0} - {#if !dateDistance} - {$displayCompanyName} has an annual dividend of - ${annualDividend} - per share, with a forward yield of - {dividendYield}%. - The dividend is paid every - {payoutFrequency === 4 ? '3 months' : payoutFrequency === 2 ? '6 months' : payoutFrequency === 1 ? '12 months' : 'n/a'} - and the last ex-dividend date was - {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} +
+ + + + {#if rawData?.history?.length !== 0} + {#if !dateDistance} + {$displayCompanyName} has an annual dividend of + ${annualDividend} + per share, with a forward yield of + {dividendYield}%. + The dividend is paid every + {payoutFrequency === 4 ? '3 months' : payoutFrequency === 2 ? '6 months' : payoutFrequency === 1 ? '12 months' : 'n/a'} + and the last ex-dividend date was + {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} + {:else} + {$displayCompanyName} issued its most recent dividend on + {new Date(rawData?.history?.at(0)?.date)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}. + Since then, the company has not distributed any further dividends for over 12 months. + {/if} + + {:else} - {$displayCompanyName} issued its most recent dividend on - {new Date(rawData?.history?.at(0)?.date)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}. - Since then, the company has not distributed any further dividends for over 12 months. + No dividend history available for {$displayCompanyName}. {/if} - - - {:else} - No dividend history available for {$displayCompanyName}. - {/if} - -
- -
- - {#if rawData?.history?.length !== 0} -
+ +
+ +
+ + {#if rawData?.history?.length !== 0} + +
-
- Dividend Yield -
+
{dividendYield !== '0.00' ? dividendYield : '0'}%
-
-
- Annual Dividend -
+
+ +
- ${annualDividend !== '0.00' ? annualDividend : '0'} + ${annualDividend !== '0.00' ? annualDividend : '0'}
-
-
- Ex-Dividend Date -
-
- {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} -
-
- -
-
- Payout Frequency -
-
- {payoutFrequency === 4 ? 'Quartely' : payoutFrequency === 2 ? 'Half-Yearly' : payoutFrequency === 1 ? 'Annually' : 'n/a'} -
-
- -
-
- Payout Ratio -
-
- {payoutRatio !== '0.00' ? payoutRatio : '0'}% -
-
- -
-
- Dividend Growth -
-
- {dividendGrowth !== 'NaN' ? dividendGrowth+'%' : '-'} -
-
- - -
- +
+ - -
- -

- Dividends History -

- - - -
- - - {#if isLoaded} - {#if rawData?.history?.length !== 0 && optionsDividend} - -
- +
+ {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} +
- - -
- - - - - - - - - - - {#each rawData?.history as item} - - - - - - - {/each} - -
- Ex-Divid. Date - - Cash Amount - - Record Date - - Pay Date -
- {new Date(item?.date)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} - - ${item?.adjDividend?.toFixed(3)} - - {item?.recordDate?.length !== 0 ? new Date(item?.recordDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' }) : 'n/a'} - - {item?.paymentDate?.length !== 0 ? new Date(item?.paymentDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' }) : 'n/a'} -
-
- - * Dividend amounts are adjusted for stock splits when applicable. - - - {:else} -

- No history found -

- {/if} - - - {:else} -
-
- + +
+ + +
+ {payoutFrequency === 4 ? 'Quartely' : payoutFrequency === 2 ? 'Half-Yearly' : payoutFrequency === 1 ? 'Annually' : 'n/a'} +
+
+
+ + +
+ {payoutRatio !== '0.00' ? payoutRatio : '0'}% +
+
+
+ + +
+ {dividendGrowth !== 'NaN' ? dividendGrowth+'%' : '-'} +
-
- {/if} - - - {/if} - - - - - -
-
-
- - -
- - - - - - \ No newline at end of file + +
+ + + +
+ +

+ Dividends History +

+ + + +
+ + + {#if isLoaded} + {#if rawData?.history?.length !== 0 && optionsDividend} + +
+ +
+ + +
+ + + + + + + + + + + {#each rawData?.history as item} + + + + + + + {/each} + +
+ Ex-Divid. Date + + Cash Amount + + Record Date + + Pay Date +
+ {new Date(item?.date)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} + + ${item?.adjDividend?.toFixed(3)} + + {item?.recordDate?.length !== 0 ? new Date(item?.recordDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' }) : 'n/a'} + + {item?.paymentDate?.length !== 0 ? new Date(item?.paymentDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' }) : 'n/a'} +
+
+ + * Dividend amounts are adjusted for stock splits when applicable. + + + {:else} +

+ No history found +

+ {/if} + + + {:else} +
+
+ +
+
+ {/if} + + + {/if} + + + + + +
+
+
+ + +
+ + + + + + \ No newline at end of file