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

bugfixing

Browse Source
This commit is contained in:
MuslemRahimi 2024-11-29 10:04:09 +01:00
parent aec5baf076
commit 6d10acdd26
2 changed files with 66 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/lib/utils.ts
View File

@ -18,6 +18,47 @@ type FlyAndScaleParams = {
duration?: number; duration?: number;
}; };
export const groupNews = (news, watchList) => {
return Object.entries(
news
?.map(item => {
// Add 'type' based on watchList
const match = watchList?.find(w => w?.symbol === item?.symbol);
return match ? { ...item, type: match.type } : { ...item };
})
?.reduce((acc, item) => {
const dateKey = new Intl.DateTimeFormat('en-US', {
day: '2-digit',
month: 'short',
year: 'numeric',
}).format(new Date(item?.publishedDate));
const titleKey = item.title;
if (!acc[dateKey]) acc[dateKey] = {};
if (!acc[dateKey][titleKey]) acc[dateKey][titleKey] = [];
acc[dateKey][titleKey]?.push(item);
return acc;
}, {})
)?.map(([date, titleGroup]) => [
date,
Object?.entries(titleGroup)?.map(([title, items]) => {
// Sort by time for each group
items?.sort((a, b) => new Date(b?.publishedDate) - new Date(a?.publishedDate));
// Get the unique symbols
const symbols = [...new Set(items?.map(item => item.symbol))];
// Return the group with symbols and items
return { title, items, symbols };
}),
]);
}
export const calculateChange = (oldList?: any[], newList?: any[]) => { export const calculateChange = (oldList?: any[], newList?: any[]) => {
if (!oldList?.length || !newList?.length) return [...(oldList || [])]; if (!oldList?.length || !newList?.length) return [...(oldList || [])];

86
src/routes/watchlist/stocks/+page.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import { screenWidth, numberOfUnreadNotification, isOpen } from "$lib/store"; import { screenWidth, numberOfUnreadNotification, isOpen } from "$lib/store";
import { formatDate, abbreviateNumber, calculateChange } from "$lib/utils"; import { groupNews, abbreviateNumber, calculateChange } from "$lib/utils";
import toast from "svelte-french-toast"; import toast from "svelte-french-toast";
import { onMount, onDestroy, afterUpdate } from "svelte"; import { onMount, onDestroy, afterUpdate } from "svelte";
import Input from "$lib/components/Input.svelte"; import Input from "$lib/components/Input.svelte";
@ -218,25 +218,7 @@
const match = watchList?.find((w) => w?.symbol === item?.symbol); const match = watchList?.find((w) => w?.symbol === item?.symbol);
return match ? { ...item, type: match?.type } : { ...item }; return match ? { ...item, type: match?.type } : { ...item };
}); });
groupedNews = Object?.entries( groupedNews = groupNews(news, watchList);
news?.reduce((acc, item) => {
const dateKey = new Intl.DateTimeFormat("en-US", {
day: "2-digit",
month: "short",
year: "numeric",
}).format(new Date(item.publishedDate));
if (!acc[dateKey]) acc[dateKey] = [];
acc[dateKey].push(item);
return acc;
}, {}),
)?.map(([date, items]) => [
date,
items.sort(
(a, b) =>
new Date(b?.publishedDate)?.getTime() -
new Date(a?.publishedDate)?.getTime(),
),
]);
} }
async function createWatchList(event) { async function createWatchList(event) {
@ -410,25 +392,7 @@
allList = [...allList]; allList = [...allList];
groupedNews = Object?.entries( groupedNews = groupNews(news, watchList);
news?.reduce((acc, item) => {
const dateKey = new Intl.DateTimeFormat("en-US", {
day: "2-digit",
month: "short",
year: "numeric",
}).format(new Date(item.publishedDate));
if (!acc[dateKey]) acc[dateKey] = [];
acc[dateKey].push(item);
return acc;
}, {}),
)?.map(([date, items]) => [
date,
items.sort(
(a, b) =>
new Date(b?.publishedDate)?.getTime() -
new Date(a?.publishedDate)?.getTime(),
),
]);
} }
} }
@ -1394,30 +1358,27 @@
--> -->
</div> </div>
{#each groupedNews as [date, items]} {#each groupedNews as [date, titleGroups]}
<h3 class="mb-1.5 mt-3 font-semibold text-faded"> <h3 class="mb-1.5 mt-3 font-semibold text-faded">
{date} {date}
</h3> </h3>
<div class="border border-gray-700"> <div class="border border-gray-700">
{#each items as item} {#each titleGroups as { title, items, symbols }}
<div class="flex border-gray-600 text-small"> <div class="flex border-gray-600 text-small">
<div <div
class="hidden min-w-[100px] items-center justify-center bg-[#27272A] p-1 lg:flex" class="hidden min-w-[100px] items-center justify-center bg-[#27272A] p-1 lg:flex"
> >
{new Date(item.publishedDate).toLocaleTimeString( {new Date(
"en-US", items[0].publishedDate,
{ ).toLocaleTimeString("en-US", {
hour: "2-digit", hour: "2-digit",
minute: "2-digit", minute: "2-digit",
hour12: true, hour12: true,
}, })}
)}
</div> </div>
<div <div class="flex-grow px-3 py-2 lg:py-1">
class="flex-grow px-3 py-2 lg:py-1 border-gray-700 border-t"
>
<a <a
href={item?.url} href={items[0].url}
target="_blank" target="_blank"
rel="nofollow noopener noreferrer" rel="nofollow noopener noreferrer"
class="text-white sm:hover:text-blue-400" class="text-white sm:hover:text-blue-400"
@ -1425,7 +1386,7 @@
<h4 <h4
class="text-sm font-semibold lg:text-[1rem]" class="text-sm font-semibold lg:text-[1rem]"
> >
{item?.title} {title}
</h4> </h4>
</a> </a>
<div <div
@ -1433,21 +1394,24 @@
> >
<div class="text-white lg:hidden"> <div class="text-white lg:hidden">
{new Date( {new Date(
item.publishedDate, items[0].publishedDate,
).toLocaleTimeString("en-US", { ).toLocaleTimeString("en-US", {
hour: "2-digit", hour: "2-digit",
minute: "2-digit", minute: "2-digit",
hour12: true, hour12: true,
})} })}
</div> </div>
<div class="text-white">{item?.site}</div> <div class="text-white">{items[0].site}</div>
&#183; &#183;
<div class="flex flex-wrap gap-x-2"> <div class="flex flex-wrap gap-x-2">
<a {#each symbols as symbol}
href={`/${item?.type}/${item?.symbol}`} <a
class="sm:hover:text-white text-blue-400" href={`/${items[0].type}/${symbol}`}
>{item?.symbol}</a class="sm:hover:text-white text-blue-400"
> >
{symbol}
</a>
{/each}
</div> </div>
</div> </div>
</div> </div>