AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui fixes

Browse Source
This commit is contained in:
MuslemRahimi 2024-12-03 21:12:12 +01:00
parent ad366052c0
commit 86b29b2d6a
2 changed files with 24 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/lib/utils.ts
View File

@ -613,18 +613,24 @@ export const formatDate = (dateString) => {
const date = new Date(dateString); const date = new Date(dateString);
const now = new Date(); const now = new Date();
const diffInDays = Math.floor((now - date) / (1000 * 60 * 60 * 24)); const diffInDays = Math.floor((now - date) / (1000 * 60 * 60 * 24));
if (diffInDays >= 30) {
const months = Math.floor(diffInDays / 30);
return `${months} month${months > 1 ? "s" : ""} ago`;
}
if (diffInDays >= 7) { if (diffInDays >= 7) {
const weeks = Math.floor(diffInDays / 7); const weeks = Math.floor(diffInDays / 7);
return `${weeks} week${weeks > 1 ? "s" : ""} ago`; return `${weeks} week${weeks > 1 ? "s" : ""} ago`;
} }
return formatDistanceToNow(date, { return formatDistanceToNow(date, {
addSuffix: true, addSuffix: true,
includeSeconds: false, includeSeconds: false,
}).replace(/about /i, ""); }).replace(/about /i, "");
}; };
export const formatRuleValue = (rule) => { export const formatRuleValue = (rule) => {
if (["interestIncome", "interestExpenses"].includes(rule.name)) { if (["interestIncome", "interestExpenses"].includes(rule.name)) {
return `$${rule.value === 1000 ? `${rule.value / 1000} Bn` : `${rule.value} Mio`}`; return `$${rule.value === 1000 ? `${rule.value / 1000} Bn` : `${rule.value} Mio`}`;

35
src/routes/notifications/+page.svelte
View File

@ -2,7 +2,7 @@
import { formatDate } from "$lib/utils"; import { formatDate } from "$lib/utils";
import ArrowLogo from "lucide-svelte/icons/move-up-right"; import ArrowLogo from "lucide-svelte/icons/move-up-right";
import avatar from "$lib/images/visual_mod.webp"; import avatar from "$lib/images/visual_mod.webp";
import HoverStockChart from "$lib/components/HoverStockChart.svelte";
import { onMount } from "svelte"; import { onMount } from "svelte";
import { numberOfUnreadNotification } from "$lib/store"; import { numberOfUnreadNotification } from "$lib/store";
@ -125,8 +125,8 @@
<img <img
style="clip-path: circle(50%);" style="clip-path: circle(50%);"
class="flex-shrink-0 w-11 h-11 rounded-full inline-block" class="flex-shrink-0 w-11 h-11 rounded-full inline-block"
src={avatar} src={`https://financialmodelingprep.com/image-stock/${item?.liveResults?.symbol}.png`}
alt="User avatar" alt="Company Logo"
/> />
</a> </a>
@ -135,30 +135,27 @@
<!-- svelte-ignore a11y-label-has-associated-control --> <!-- svelte-ignore a11y-label-has-associated-control -->
<div class="flex flex-col items-start"> <div class="flex flex-col items-start">
<div> <div>
<a <div class="flex flex-col items-start">
href={`/${item?.liveResults?.assetType === "stock" ? "stocks" : "etf"}/${item?.liveResults?.symbol}`}
class="flex flex-col items-start cursor-pointer"
>
<div class="text-md mt-0.5"> <div class="text-md mt-0.5">
Price Alert triggered for <span Price Alert triggered for <HoverStockChart
class="sm:hover:text-white text-blue-400" symbol={item?.liveResults?.symbol}
>${item?.liveResults?.symbol}</span assetType={item?.liveResults?.assetType}
> />
</div> </div>
<div class="text-md mt-0.5"> <div class="text-md mt-0.5">
The price of <span class="font-bold" The price of <span class="font-semibold"
>${item?.liveResults?.currentPrice}</span >{item?.liveResults?.currentPrice}</span
> >
is {item?.liveResults?.condition} your target of is {item?.liveResults?.condition} your target of
<span class="font-bold" <span class="font-semibold"
>${item?.liveResults?.targetPrice}</span >{item?.liveResults?.targetPrice}</span
> >
</div> </div>
</a> </div>
</div> </div>
<span class="text-sm sm:text-[1rem] text-[#A6ADBB0" <span class="text-sm mt-1 text-[#A6ADBB0"
>{formatDate(item?.created)} ago</span >{formatDate(item?.created)}
> </span>
</div> </div>
</div> </div>
</div> </div>