update hedge fund page similar like congress page
This commit is contained in:
MuslemRahimi
parent
6667487339
commit
5673898933
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
BIN
src/lib/images/bg-hedge-funds.png
Normal file
BIN
src/lib/images/bg-hedge-funds.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
BIN
src/lib/images/hedge_funds/default-avatar.png
Normal file
BIN
src/lib/images/hedge_funds/default-avatar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
@ -767,7 +767,7 @@ class="fixed 2xl:block top-0 left-0 xl:left-auto w-56 sm:{collapse ? 'w-20' : 'w
|
||||
</li>
|
||||
|
||||
<li on:click={() => showSidebar = !showSidebar} class="px-1 rounded-sm mb-2 last:mb-0">
|
||||
<a href={"/hedge-funds/category/best"} for="sidebar" class="block text-slate-200 hover:text-white truncate transition duration-150 {['/hedge-funds/category/best','/hedge-funds/category/worst','/hedge-funds/category/all']?.includes($page.url.pathname) ? 'text-white bg-[#272727] xl:bg-[#0F0F0F] rounded-md ' : ''}">
|
||||
<a href={"/hedge-funds"} for="sidebar" class="block text-slate-200 hover:text-white truncate transition duration-150 {$page?.url?.pathname?.startsWith('/hedge-funds') ? 'text-white bg-[#272727] xl:bg-[#0F0F0F] rounded-md ' : ''}">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center">
|
||||
<svg class="w-7 h-7" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="white">
|
||||
|
||||
289
src/routes/hedge-funds/+page.svelte
Normal file
289
src/routes/hedge-funds/+page.svelte
Normal file
@ -0,0 +1,289 @@
|
||||
<script lang='ts'>
|
||||
import cardBackground from "$lib/images/bg-hedge-funds.png";
|
||||
import defaultAvatar from "$lib/images/hedge_funds/default-avatar.png";
|
||||
|
||||
import { screenWidth, numberOfUnreadNotification } from '$lib/store';
|
||||
import { abbreviateNumber } from '$lib/utils';
|
||||
import { onMount } from 'svelte';
|
||||
import { compareTwoStrings } from 'string-similarity';
|
||||
// import * as XLSX from 'xlsx';
|
||||
|
||||
export let data;
|
||||
|
||||
let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
|
||||
|
||||
|
||||
let rawData = data?.getHedgeFunds;
|
||||
let slicedRawData = [];
|
||||
let displayList = [];
|
||||
let images = {};
|
||||
let filterQuery = '';
|
||||
|
||||
let isLoaded = false;
|
||||
|
||||
|
||||
|
||||
async function handleScroll() {
|
||||
const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height
|
||||
const isBottom = window.innerHeight + window.scrollY >= scrollThreshold;
|
||||
if (isBottom && displayList?.length !== rawData?.length) {
|
||||
const nextIndex = displayList?.length;
|
||||
const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 20);
|
||||
displayList = [...displayList, ...filteredNewResults];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
onMount(async () => {
|
||||
displayList = rawData?.slice(0,20) ?? [];
|
||||
isLoaded = true;
|
||||
|
||||
window.addEventListener('scroll', handleScroll);
|
||||
//window.addEventListener('keydown', handleKeyDown);
|
||||
|
||||
return () => {
|
||||
// Cleanup the event listeners when the component is unmounted
|
||||
window.removeEventListener('scroll', handleScroll);
|
||||
//window.removeEventListener('keydown', handleKeyDown);
|
||||
};
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
let syncWorker: Worker | undefined = undefined;
|
||||
|
||||
// Handling messages from the worker
|
||||
const handleMessage = async (event) => {
|
||||
const filterData = event.data?.output
|
||||
console.log(filterData)
|
||||
if (filterData?.length !== 0) {
|
||||
rawData = filterData;
|
||||
displayList = [...filterData]?.slice(0,20);
|
||||
} else {
|
||||
// Reset to original data if no matches found
|
||||
rawData = data?.getHedgeFunds;
|
||||
displayList = rawData?.slice(0, 20);
|
||||
}
|
||||
};
|
||||
|
||||
const loadWorker = async () => {
|
||||
const SyncWorker = await import('./workers/filterQuery?worker');
|
||||
syncWorker = new SyncWorker.default();
|
||||
syncWorker.postMessage({ rawData: data?.getHedgeFunds, filterQuery: filterQuery});
|
||||
syncWorker.onmessage = handleMessage;
|
||||
|
||||
};
|
||||
|
||||
async function handleInput(event) {
|
||||
filterQuery = event.target.value?.toLowerCase();
|
||||
let newData = [];
|
||||
|
||||
setTimeout(async () => {
|
||||
if (filterQuery?.length !== 0) {
|
||||
await loadWorker();
|
||||
} else {
|
||||
// Reset to original data if filter is empty
|
||||
rawData = data?.getHedgeFunds;
|
||||
displayList = rawData?.slice(0, 20);
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
|
||||
|
||||
|
||||
let charNumber = 40;
|
||||
$: {
|
||||
if ($screenWidth < 640)
|
||||
{
|
||||
charNumber = 20;
|
||||
}
|
||||
else {
|
||||
charNumber = 40;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<!-- HEADER FOR BETTER SEO -->
|
||||
<svelte:head>
|
||||
<title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} All listed Hedge Funds · stocknear</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0">
|
||||
|
||||
<meta name="description" content="Find all listed Hedge Funds based on the US Market.">
|
||||
<!-- Other meta tags -->
|
||||
<meta property="og:title" content="All listed Hedge Funds · stocknear"/>
|
||||
<meta property="og:description" content="Find all listed Hedge Funds based on the US Market.">
|
||||
<meta property="og:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
<!-- Add more Open Graph meta tags as needed -->
|
||||
|
||||
<!-- Twitter specific meta tags -->
|
||||
<meta name="twitter:card" content="summary_large_image"/>
|
||||
<meta name="twitter:title" content="All listed Hedge Funds · stocknear"/>
|
||||
<meta name="twitter:description" content="Find all listed Hedge Funds based on the US Market.">
|
||||
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
</svelte:head>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section class="w-full max-w-6xl overflow-hidden m-auto min-h-screen pt-5 pb-60">
|
||||
|
||||
|
||||
<body class="w-full max-w-6xl overflow-hidden m-auto">
|
||||
|
||||
<div class="text-sm breadcrumbs ml-4">
|
||||
<ul>
|
||||
<li><a href="/" class="text-gray-300">Home</a></li>
|
||||
<li class="text-gray-300">Hedge Funds</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
{#if isLoaded}
|
||||
|
||||
|
||||
<section class="w-full max-w-6xl overflow-hidden m-auto sm:mt-10 px-0 sm:px-3 mt-10">
|
||||
|
||||
<div class="p-3 sm:p-0 flex justify-center w-full m-auto overflow-hidden">
|
||||
<div class="relative flex justify-center items-center overflow-hidden w-full">
|
||||
<main class="w-full">
|
||||
|
||||
|
||||
<div class="w-full pb-3">
|
||||
<div class="relative right-0 bg-[#0F0F0F]">
|
||||
<ul class="relative grid grid-cols-1 sm:grid-cols-4 gap-y-3 gap-x-3 flex flex-wrap p-1 list-none rounded-[3px]">
|
||||
<li class="pl-3 py-1.5 flex-auto text-center bg-[#2E3238] rounded-[3px]">
|
||||
<label class="flex flex-row items-center">
|
||||
<input
|
||||
id="modal-search"
|
||||
type="search"
|
||||
class="ml-2 text-[1rem] placeholder-gray-400 border-transparent focus:border-transparent focus:ring-0 flex items-center justify-center w-full px-0 py-1 bg-inherit"
|
||||
placeholder="Find by name"
|
||||
bind:value={filterQuery}
|
||||
on:input={handleInput}
|
||||
autocomplete="off"
|
||||
/>
|
||||
<svg class="ml-auto mr-5 h-8 w-8 inline-block mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="m19.485 20.154l-6.262-6.262q-.75.639-1.725.989t-1.96.35q-2.402 0-4.066-1.663T3.808 9.503T5.47 5.436t4.064-1.667t4.068 1.664T15.268 9.5q0 1.042-.369 2.017t-.97 1.668l6.262 6.261zM9.539 14.23q1.99 0 3.36-1.37t1.37-3.361t-1.37-3.36t-3.36-1.37t-3.361 1.37t-1.37 3.36t1.37 3.36t3.36 1.37"/></svg>
|
||||
</label>
|
||||
</li>
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="w-full m-auto mt-4">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 sm:gap-5">
|
||||
{#each displayList as item}
|
||||
<a href={`/hedge-funds/${item?.cik}`} class="w-full cursor-pointer bg-[#202020] sm:hover:bg-[#000] transition-colors ease-in-out border sm:hover:border-[#000] sm:hover:shadow-[#8C5F1B] border-slate-800 shadow-md rounded-lg h-auto pb-4 pt-4 mb-7">
|
||||
<div class="flex flex-col relative">
|
||||
<img class="absolute -mt-4 w-full m-auto rounded-lg" src={cardBackground} />
|
||||
<div class="flex flex-col justify-center items-center rounded-2xl ">
|
||||
|
||||
<div class="-mt-3 shadow-lg rounded-full border border-slate-600 w-20 h-20 relative hedge-fund-striped bg-[#20202E] flex items-center justify-center">
|
||||
<img style="clip-path: circle(50%);" class="rounded-full w-20" src={defaultAvatar} loading="lazy"/>
|
||||
</div>
|
||||
<span class="text-white text-md font-semibold mt-2 mb-2 w-64 text-center">
|
||||
{item?.name}
|
||||
</span>
|
||||
<span class="text-white text-md mb-8">
|
||||
AUM: {abbreviateNumber(item?.marketValue,true)}
|
||||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="relative bottom-0 w-full px-8">
|
||||
<div class="flex flex-row justify-between items-center w-full mb-6">
|
||||
<label class="cursor-pointer flex flex-col items-start">
|
||||
<span class="text-white text-[1rem] font-semibold">{abbreviateNumber(item?.numberOfStocks)}</span>
|
||||
<span class="text-slate-300 font-medium text-sm"># of Holdings</span>
|
||||
</label>
|
||||
|
||||
<div class="flex flex-col items-end ">
|
||||
<span class="text-white text-[1rem] font-semibold">
|
||||
{item?.turnover?.toFixed(2)}
|
||||
</span>
|
||||
<span class="text-slate-300 font-medium text-sm">Turnover</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row justify-between items-center w-full">
|
||||
<label class="cursor-pointer flex flex-col items-start">
|
||||
<div class="flex flex-row mt-1 text-[1rem] font-semibold">
|
||||
{#if item?.performancePercentage3year >=0}
|
||||
<span class="text-[#10DB06]">+{abbreviateNumber(item?.performancePercentage3year?.toFixed(2))}%</span>
|
||||
{:else}
|
||||
<span class="text-[#FF2F1F]">{abbreviateNumber(item?.performancePercentage3year?.toFixed(2))}% </span>
|
||||
{/if}
|
||||
</div>
|
||||
<span class="text-slate-300 font-medium text-sm">3-Year Performance</span>
|
||||
</label>
|
||||
|
||||
<div class="flex flex-col items-end ">
|
||||
<div class="flex flex-row mt-1 text-[1rem] font-semibold">
|
||||
{#if item?.winRate >=0}
|
||||
<span class="text-[#10DB06]">+{abbreviateNumber(item?.winRate?.toFixed(2))}%</span>
|
||||
{:else}
|
||||
<span class="text-[#FF2F1F]">{abbreviateNumber(item?.winRate?.toFixed(2))}% </span>
|
||||
{/if}
|
||||
</div>
|
||||
<span class="text-slate-300 font-medium text-sm">Win Rate</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</a>
|
||||
{/each}
|
||||
|
||||
<!--<InfiniteLoading on:infinite={infiniteHandler} />-->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{:else}
|
||||
<div class="flex justify-center items-center m-auto relative w-[100px]">
|
||||
<div class="loader">Loading...</div>
|
||||
</div>
|
||||
|
||||
{/if}
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
.hedge-fund-striped {
|
||||
background-image: repeating-linear-gradient(
|
||||
-45deg,
|
||||
#A77120,
|
||||
#A77120 10px,
|
||||
#90621C 10px,
|
||||
#90621C 20px
|
||||
);
|
||||
}
|
||||
</style>
|
||||
@ -2,19 +2,19 @@ import { getCache, setCache } from '$lib/store';
|
||||
|
||||
|
||||
export const load = async ({ params }) => {
|
||||
const getAllHedgeFunds = async () => {
|
||||
const getHedgeFunds = async () => {
|
||||
let output;
|
||||
|
||||
// Get cached data for the specific tickerID
|
||||
const cachedData = getCache('getAllHedgeFunds', 'getAllHedgeFunds');
|
||||
const cachedData = getCache('getHedgeFunds', 'getHedgeFunds');
|
||||
if (cachedData) {
|
||||
output = cachedData;
|
||||
} else {
|
||||
|
||||
output = await import('$lib/hedge-funds/all-hedge-funds.json')
|
||||
|
||||
// Cache the data for this specific tickerID with a specific name 'getAllHedgeFunds'
|
||||
setCache('getAllHedgeFunds', output, 'getAllHedgeFunds');
|
||||
// Cache the data for this specific tickerID with a specific name 'getHedgeFunds'
|
||||
setCache('getHedgeFunds', output, 'getHedgeFunds');
|
||||
}
|
||||
|
||||
|
||||
@ -23,7 +23,7 @@ export const load = async ({ params }) => {
|
||||
|
||||
// Make sure to return a promise
|
||||
return {
|
||||
getAllHedgeFunds: await getAllHedgeFunds()
|
||||
getHedgeFunds: await getHedgeFunds()
|
||||
};
|
||||
};
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
let winRate = hedgeFundsData[0]?.winRate ?? 'n/a';
|
||||
let turnover = hedgeFundsData[0]?.turnover?.toFixed(2) ?? 'n/a';
|
||||
let averageHoldingPeriod = hedgeFundsData[0]?.averageHoldingPeriod ?? 'n/a';
|
||||
let avgPerformancePercentage = hedgeFundsData[0]?.avgPerformancePercentage?.toFixed(2) ?? 'n/a';
|
||||
let performancePercentage3year = hedgeFundsData[0]?.performancePercentage3year?.toFixed(2) ?? 'n/a';
|
||||
|
||||
|
||||
let industry = [];
|
||||
@ -298,7 +298,7 @@ $: {
|
||||
<div class="text-sm breadcrumbs ml-4 mb-5 no-scrollbar mr-5">
|
||||
<ul>
|
||||
<li><a href="/" class="text-gray-300">Home</a></li>
|
||||
<li><a href="/hedge-funds/category/best" class="text-gray-300">Hedge Funds</a></li>
|
||||
<li><a href="/hedge-funds" class="text-gray-300">Hedge Funds</a></li>
|
||||
{#if $page.url.pathname.startsWith('/hedge-funds/')}
|
||||
<li class="text-gray-300">
|
||||
{formatString($displayCompanyName)}
|
||||
@ -310,7 +310,7 @@ $: {
|
||||
|
||||
<div class="w-full max-w-4xl sm:flex sm:flex-row sm:items-center m-auto text-gray-100 bg-[#202020] sm:rounded-lg h-auto p-5 mb-4">
|
||||
<svg class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path fill="#60a5fa" d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"/></svg>
|
||||
Core Profile of the Hedge Fund {formatString($displayCompanyName)} for the quarter Q4 2023.
|
||||
Core Profile of the Hedge Fund {formatString($displayCompanyName)} for the quarter Q1 2024.
|
||||
</div>
|
||||
|
||||
|
||||
@ -324,7 +324,7 @@ $: {
|
||||
Stocks
|
||||
<svg class="ml-2 w-5 h-5 sm:w-6 sm:h-6 inline-block" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="#fff"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title></title> <g id="Complete"> <g id="info-circle"> <g> <circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></circle> <line fill="none" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="12" y2="16"></line> <line fill="none" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="8"></line> </g> </g> </g> </g></svg>
|
||||
</label>
|
||||
<div class="stat-value mt-1 text-lg sm:text-xl text-gray-200">
|
||||
<div class="stat-value mt-1 text-lg sm:text-xl text-gray-200 font-semibold">
|
||||
{rawData?.length}
|
||||
</div>
|
||||
</div>
|
||||
@ -347,7 +347,7 @@ $: {
|
||||
<svg class="ml-2 w-5 h-5 sm:w-6 sm:h-6 inline-block" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="#565656"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title></title> <g id="Complete"> <g id="info-circle"> <g> <circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></circle> <line fill="none" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="12" y2="16"></line> <line fill="none" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="8"></line> </g> </g> </g> </g></svg>
|
||||
</label>
|
||||
<div class="stat-value text-lg font-semibold text-gray-200">
|
||||
<div class="flex flex-row items-center font-medium">
|
||||
<div class="flex flex-row items-center">
|
||||
<div class="flex flex-col items-center">
|
||||
<div class="flex flex-row mt-1 items-center">
|
||||
{#if winRate >=0}
|
||||
@ -386,19 +386,19 @@ $: {
|
||||
|
||||
<div class="stat">
|
||||
<label for="performanceInfo" class="cursor-pointer flex flex-row items-center stat-title -my-2 mb-1 text-lg sm:text-xl font-semibold text-gray-300">
|
||||
Avg Performance
|
||||
3-Year Performance
|
||||
<svg class="ml-2 w-5 h-5 sm:w-6 sm:h-6 inline-block" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="#565656"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title></title> <g id="Complete"> <g id="info-circle"> <g> <circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></circle> <line fill="none" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="12" y2="16"></line> <line fill="none" stroke="#565656" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="8"></line> </g> </g> </g> </g></svg>
|
||||
</label>
|
||||
<div class="stat-value text-lg font-semibold text-gray-200">
|
||||
<div class="flex flex-row items-center font-medium">
|
||||
<div class="flex flex-col items-center">
|
||||
<div class="flex flex-row mt-1 items-center">
|
||||
{#if avgPerformancePercentage >=0}
|
||||
{#if performancePercentage3year >=0}
|
||||
<svg class="inline-block w-6 h-6 mt-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#10db06" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#10DB06] text-[0.95rem] sm:text-lg">+{abbreviateNumber(avgPerformancePercentage)} %</span>
|
||||
<span class="text-[#10DB06] text-[0.95rem] sm:text-lg">+{abbreviateNumber(performancePercentage3year)} %</span>
|
||||
{:else}
|
||||
<svg class="inline-block w-6 h-6 mt-0.5 rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#FF2F1F" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#FF2F1F] text-[0.95rem] sm:text-lg">{abbreviateNumber(avgPerformancePercentage)} % </span>
|
||||
<span class="text-[#FF2F1F] text-[0.95rem] sm:text-lg">{abbreviateNumber(performancePercentage3year)} % </span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,107 +0,0 @@
|
||||
<script>
|
||||
|
||||
//Nested layout
|
||||
import { page } from '$app/stores'
|
||||
let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
|
||||
|
||||
|
||||
const navigation = [
|
||||
{
|
||||
title: 'Best',
|
||||
link: '/hedge-funds/category/best'
|
||||
},
|
||||
{
|
||||
title: 'Worst',
|
||||
link: '/hedge-funds/category/worst'
|
||||
},
|
||||
{
|
||||
title: 'All',
|
||||
link: '/hedge-funds/category/all'
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
<section class="w-full max-w-4xl overflow-hidden m-auto min-h-screen pt-5 pb-60">
|
||||
|
||||
<div class="text-sm breadcrumbs ml-4">
|
||||
<ul>
|
||||
<li><a href="/" class="text-gray-300">Home</a></li>
|
||||
<li class="text-gray-300">Hedge Funds</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="w-full max-w-4xl m-auto sm:bg-[#202020] sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-10">
|
||||
|
||||
<!-- Start Column -->
|
||||
<div>
|
||||
<div class="flex flex-row justify-center items-center">
|
||||
<h1 class="text-3xl sm:text-4xl text-white text-center font-bold mb-5">
|
||||
Hedge Funds
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<span class="hidden sm:block text-white text-md font-medium text-center flex justify-center items-center ">
|
||||
Monitor expert portfolios to maximize your profit potential
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<!-- End Column -->
|
||||
|
||||
<!-- Start Column -->
|
||||
<div class="hidden sm:block relative m-auto mb-5 mt-5 sm:mb-0 sm:mt-0">
|
||||
<svg class="w-40 -my-5" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<defs>
|
||||
<filter id="glow">
|
||||
<feGaussianBlur stdDeviation="5" result="glow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="glow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<path fill="#1E40AF" d="M57.6,-58.7C72.7,-42.6,81.5,-21.3,82,0.5C82.5,22.3,74.7,44.6,59.7,60.1C44.6,75.6,22.3,84.3,0,84.3C-22.3,84.2,-44.6,75.5,-61.1,60.1C-77.6,44.6,-88.3,22.3,-87.6,0.7C-86.9,-20.8,-74.7,-41.6,-58.2,-57.7C-41.6,-73.8,-20.8,-85.2,0.2,-85.4C21.3,-85.6,42.6,-74.7,57.6,-58.7Z" transform="translate(100 100)" filter="url(#glow)" />
|
||||
</svg>
|
||||
|
||||
|
||||
<div class="z-1 absolute -top-0">
|
||||
<img class="w-20 ml-8" src={cloudFrontUrl+"/assets/hedge_funds_logo.png"} alt="logo" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Column -->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="w-full m-auto mb-10 bg-[#0F0F0F] pl-3 pr-3">
|
||||
<div class="tabs flex flex-row justify-start items-center w-full pl-3 pr-3 sm:pl-0 sm:pr-0">
|
||||
{#each navigation as item}
|
||||
|
||||
<a href={item?.link} class="w-fit text-center text-xl m-auto sm:m-0 sm:mr-10 rounded-md transition font-semibold hover:text-white {(item?.link === $page.url.pathname || item?.link +'/' === $page.url.pathname) ? ' text-white' : 'text-[#9A9996]'}">
|
||||
{item?.title}
|
||||
<div class="{(item?.link === $page.url.pathname || item?.link +'/' === $page.url.pathname) ? 'bg-[#75D377]' : 'bg-[#0F0F0F]'} mt-1 h-[3px] rounded-full w-[3.5rem] rounded-full" />
|
||||
</a>
|
||||
|
||||
{/each}
|
||||
|
||||
</div>
|
||||
<div class="border-b mt-5 border-blue-400" />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="w-full">
|
||||
<slot/>
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
@ -1,514 +0,0 @@
|
||||
<script lang='ts'>
|
||||
import { goto } from '$app/navigation';
|
||||
import {formatString} from '$lib/utils';
|
||||
import { abbreviateNumber } from '$lib/utils';
|
||||
import { screenWidth, numberOfUnreadNotification } from '$lib/store';
|
||||
import InfiniteLoading from '$lib/components/InfiniteLoading.svelte';
|
||||
|
||||
export let data;
|
||||
|
||||
|
||||
|
||||
let hedgeFundList = [];
|
||||
let rawData = data?.getAllHedgeFunds ?? [];
|
||||
let modifiedData = []
|
||||
let sortBy = 'Value';
|
||||
let order = 'highToLow';
|
||||
let filterQuery = '';
|
||||
|
||||
|
||||
const sortByName = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return a?.name.localeCompare(b?.name);
|
||||
}
|
||||
else {
|
||||
return b?.name.localeCompare(a?.name);
|
||||
}
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
const sortByMarketValue = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.marketValue - a?.marketValue;
|
||||
}
|
||||
else {
|
||||
return a?.marketValue - b?.marketValue;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByNumberOfStocks = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.numberOfStocks - a?.numberOfStocks;
|
||||
}
|
||||
else {
|
||||
return a?.numberOfStocks - b?.numberOfStocks;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByTurnover = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.turnover - a?.turnover;
|
||||
}
|
||||
else {
|
||||
return a?.turnover - b?.turnover;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByWinRate = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.winRate - a?.winRate;
|
||||
}
|
||||
else {
|
||||
return a?.winRate - b?.winRate;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function selectSortingMethod(state:string) {
|
||||
|
||||
order = 'highToLow';
|
||||
|
||||
if(state === 'Value')
|
||||
{
|
||||
sortBy = state;
|
||||
rawData = sortByMarketValue(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
|
||||
else if (state === 'Stocks')
|
||||
{
|
||||
sortBy = state;
|
||||
rawData = sortByNumberOfStocks(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
|
||||
}
|
||||
|
||||
else if (state === 'Turnover')
|
||||
{
|
||||
sortBy = state;
|
||||
rawData = sortByTurnover(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
|
||||
else if (state === 'Win Rate')
|
||||
{
|
||||
sortBy = state;
|
||||
rawData = sortByWinRate(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
|
||||
else if (state === 'Name: A-Z')
|
||||
{
|
||||
sortBy = state;
|
||||
rawData = sortByName(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
function changeOrder(state:string) {
|
||||
if (state === 'highToLow')
|
||||
{
|
||||
order = 'lowToHigh';
|
||||
}
|
||||
else {
|
||||
order = 'highToLow';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
async function infiniteHandler({ detail: { loaded, complete } })
|
||||
{
|
||||
|
||||
if (hedgeFundList?.length === rawData?.length) {
|
||||
complete();
|
||||
} else {
|
||||
const nextIndex = hedgeFundList?.length;
|
||||
const newHoldings = rawData?.slice(nextIndex, nextIndex + 5);
|
||||
hedgeFundList = [...hedgeFundList, ...newHoldings];
|
||||
loaded();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
$: {
|
||||
if(order)
|
||||
{
|
||||
if(sortBy === 'Value')
|
||||
{
|
||||
rawData = sortByMarketValue(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Stocks')
|
||||
{
|
||||
rawData = sortByNumberOfStocks(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Turnover')
|
||||
{
|
||||
rawData = sortByTurnover(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Win Rate')
|
||||
{
|
||||
rawData = sortByWinRate(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
else if (sortBy === 'Name: A-Z')
|
||||
{
|
||||
rawData = sortByName(rawData);
|
||||
hedgeFundList = rawData?.slice(0,25);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
let syncWorker: Worker | undefined = undefined;
|
||||
|
||||
// Handling messages from the worker
|
||||
const handleMessage = async (event) => {
|
||||
const finalData = event.data?.finalData
|
||||
rawData = finalData?.output ?? [];
|
||||
hedgeFundList = rawData?.slice(0,20);
|
||||
|
||||
};
|
||||
|
||||
const loadWorker = async () => {
|
||||
const SyncWorker = await import('./workers/filterWorker?worker');
|
||||
syncWorker = new SyncWorker.default();
|
||||
syncWorker.postMessage({ rawData: rawData, filterQuery: filterQuery});
|
||||
syncWorker.onmessage = handleMessage;
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
||||
async function handleInput(event) {
|
||||
const filterQuery = event.target.value.toLowerCase();
|
||||
|
||||
if (filterQuery?.length !== 0) {
|
||||
await loadWorker()
|
||||
}
|
||||
else {
|
||||
rawData = data?.getAllHedgeFunds ?? [];
|
||||
selectSortingMethod(sortBy);
|
||||
}
|
||||
}
|
||||
|
||||
let charNumber = 40;
|
||||
$: {
|
||||
if ($screenWidth < 640)
|
||||
{
|
||||
charNumber = 20
|
||||
}
|
||||
else {
|
||||
charNumber = 40;
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<!-- HEADER FOR BETTER SEO -->
|
||||
<svelte:head>
|
||||
<title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} All listed Hedge Funds · stocknear</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0">
|
||||
|
||||
<meta name="description" content="Find all listed Hedge Funds based on the US Market.">
|
||||
<!-- Other meta tags -->
|
||||
<meta property="og:title" content="All listed Hedge Funds · stocknear"/>
|
||||
<meta property="og:description" content="Find all listed Hedge Funds based on the US Market.">
|
||||
<meta property="og:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
<!-- Add more Open Graph meta tags as needed -->
|
||||
|
||||
<!-- Twitter specific meta tags -->
|
||||
<meta name="twitter:card" content="summary_large_image"/>
|
||||
<meta name="twitter:title" content="All listed Hedge Funds · stocknear"/>
|
||||
<meta name="twitter:description" content="Find all listed Hedge Funds based on the US Market.">
|
||||
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
</svelte:head>
|
||||
|
||||
|
||||
<section class="w-full max-w-4xl overflow-hidden m-auto">
|
||||
|
||||
|
||||
|
||||
<div class="flex justify-start items-center mb-5 ml-3 sm:ml-1">
|
||||
<label for="sortByModal" class="cursor-pointer bg-[#0F0F0F] flex flex-row items-center">
|
||||
<span class="text-white text-sm sm:text-md mr-2">
|
||||
Sort By:
|
||||
</span>
|
||||
<div class="flex flex-row items-center">
|
||||
<span class="text-sm sm:text-md m-auto font-medium text-white">
|
||||
{sortBy}
|
||||
</span>
|
||||
<svg class="inline-block w-4 h-4 ml-1 mt-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
||||
<g transform="rotate(180 512 512)">
|
||||
<path fill="#fff" d="m488.832 344.32l-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872l319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0z"/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label on:click={() => changeOrder(order)} class="ml-auto flex flex-row items-center mr-3 sm:mr-0 cursor-pointer">
|
||||
<svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><path fill="{order === 'highToLow' ? 'white' : 'gray'}" d="m7.5 1.5l.354-.354L7.5.793l-.354.353l.354.354Zm-.354.354l4 4l.708-.708l-4-4l-.708.708Zm0-.708l-4 4l.708.708l4-4l-.708-.708ZM7 1.5V14h1V1.5H7Z"/></svg>
|
||||
<svg class="w-5 h-5 -ml-1.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><g transform="rotate(180 7.5 7.5)"><path fill="{order === 'lowToHigh' ? 'white' : 'gray'}" d="m7.5 1.5l.354-.354L7.5.793l-.354.353l.354.354Zm-.354.354l4 4l.708-.708l-4-4l-.708.708Zm0-.708l-4 4l.708.708l4-4l-.708-.708ZM7 1.5V14h1V1.5H7Z"/></g></svg>
|
||||
</label>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<!--Start Filter-->
|
||||
<div class="flex justify-start items-center mb-8 ml-3 sm:ml-1">
|
||||
<label for="modal-search" class="sr-only">Filter</label>
|
||||
<label class="flex justify-end items-center">
|
||||
<div class="flex flex-col items-center">
|
||||
<input
|
||||
id="modal-search"
|
||||
type="search"
|
||||
class="input input-bordered bg-[#0F0F0F] focus:ring-transparent w-24 sm:w-32 h-9 text-sm"
|
||||
placeholder="Filter..."
|
||||
bind:value={filterQuery}
|
||||
on:input={handleInput}
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
<!--End Filter-->
|
||||
|
||||
|
||||
<!---Start Top Winners/Losers-->
|
||||
<div class="flex flex-col justify-center items-center overflow-x-auto">
|
||||
|
||||
<table class="table table-sm sm:table-md table-compact rounded-none sm:rounded-md w-full bg-[#0F0F0F] border-bg-[#0F0F0F] m-auto">
|
||||
<thead>
|
||||
<tr class="border border-slate-800">
|
||||
<th class="text-white font-medium sm:font-bold text-sm">Company</th>
|
||||
<th class="text-white font-medium text-end sm:text-center sm:font-bold text-sm ">Value</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Stocks' ? 'hidden' : ''}">Stocks</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Turnover' ? 'hidden' : ''}">Turnover</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Value' && sortBy !== 'Win Rate' && sortBy !== 'Name: A-Z' ? 'hidden' : ''}">Win Rate</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each hedgeFundList as item, index}
|
||||
<tr on:click={() => goto("/hedge-funds/"+item?.cik)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] {index % 2 === 0 ? 'bg-opacity-[0.25] bg-[#323239]' : 'bg-[#0F0F0F]'} border-b-[#0F0F0F] cursor-pointer">
|
||||
|
||||
<td class="text-gray-200 border-b-[#0F0F0F]">
|
||||
<div class="flex flex-row items-center ">
|
||||
<div class="">
|
||||
<span class="text-blue-400">
|
||||
{item?.name?.length > charNumber ? formatString(item?.name?.slice(0,charNumber)) + "..." : formatString(item?.name)}
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] text-end sm:text-center text-sm">
|
||||
{item?.marketValue !== null ? '$' + abbreviateNumber(item?.marketValue) : '-'}
|
||||
</td>
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] text-sm {$screenWidth < 640 && sortBy !== 'Stocks' ? 'hidden' : 'text-end'}">
|
||||
{item?.numberOfStocks !== null ? item?.numberOfStocks : '-'}
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
|
||||
<td class="text-white sm:font-medium text-end border-b-[#0F0F0F] {$screenWidth < 640 && sortBy !== 'Turnover' ? 'hidden' : ''}">
|
||||
{item?.turnover !== null ? item?.turnover?.toFixed(2) : '-'}
|
||||
</td>
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] {$screenWidth < 640 && sortBy !== 'Value' && sortBy !== 'Win Rate' && sortBy !== 'Name: A-Z' ? 'hidden' : ''}">
|
||||
<div class="flex flex-row justify-end items-center">
|
||||
<div class="flex flex-col items-center">
|
||||
<div class="flex flex-row mt-1">
|
||||
{#if item?.winRate >=0}
|
||||
<svg class="w-5 h-5 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#10db06" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#10DB06] text-xs sm:text-sm">+{item?.winRate?.toFixed(2)} %</span>
|
||||
{:else}
|
||||
<svg class="w-5 h-5 rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#FF2F1F" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#FF2F1F] text-xs sm:text-sm">{item?.winRate?.toFixed(2)} % </span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
</tr>
|
||||
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<InfiniteLoading on:infinite={infiniteHandler} />
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Start Sort By Modal-->
|
||||
<input type="checkbox" id="sortByModal" class="modal-toggle" />
|
||||
|
||||
<dialog id="sortByModal" class="modal modal-bottom sm:modal-middle ">
|
||||
|
||||
|
||||
<label id="sortByModal" for="sortByModal" class="cursor-pointer modal-backdrop bg-[#0F0F0F] bg-opacity-[0.5]"></label>
|
||||
|
||||
|
||||
<div class="modal-box w-full bg-[#202020] sm:border sm:border-slate-800">
|
||||
|
||||
|
||||
|
||||
<label for="sortByModal" class="cursor-pointer absolute right-5 top-2 bg-[#202020] text-[1.8rem] text-white">
|
||||
✕
|
||||
</label>
|
||||
|
||||
<div class="text-white">
|
||||
<h3 class="font-medium text-lg sm:text-2xl mb-10">
|
||||
Sort By
|
||||
</h3>
|
||||
|
||||
|
||||
<div class="flex flex-col items-center w-full max-w-3xl bg-[#202020]">
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Value')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Value' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Value
|
||||
</span>
|
||||
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Value'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Stocks')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Stocks' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Number of Stocks
|
||||
</span>
|
||||
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Stocks'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Turnover')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Turnover' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Turnover
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Turnover'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Win Rate')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Win Rate' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Win Rate
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Win Rate'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Name: A-Z')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Name: A-Z' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Name: A-Z
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Name: A-Z'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</dialog>
|
||||
<!--End Sort By Modal-->
|
||||
|
||||
|
||||
|
||||
@ -1,16 +0,0 @@
|
||||
|
||||
onmessage = async (event: MessageEvent) => {
|
||||
const rawData = event.data?.rawData;
|
||||
const filterQuery = event.data?.filterQuery;
|
||||
|
||||
const output = rawData?.filter(item => item?.name?.toLowerCase()?.includes(filterQuery?.toLowerCase()));
|
||||
|
||||
let finalData = { output};
|
||||
postMessage({ message: 'success', finalData});
|
||||
|
||||
// Sending data back to the main thread
|
||||
//postMessage({ message: 'Data received in the worker', ticker, apiURL });
|
||||
};
|
||||
|
||||
export {};
|
||||
|
||||
@ -1,24 +0,0 @@
|
||||
const usRegion = ['cle1','iad1','pdx1','sfo1'];
|
||||
|
||||
|
||||
export const load = async ({locals}) => {
|
||||
const userRegion = locals.region?.split("::")[0];
|
||||
let apiURL;
|
||||
|
||||
if (usRegion?.includes(userRegion)) {
|
||||
apiURL = import.meta.env.VITE_USEAST_API_URL;
|
||||
} else {
|
||||
apiURL = import.meta.env.VITE_EU_API_URL;
|
||||
};
|
||||
|
||||
|
||||
const getBestHedgeFunds = async () => {
|
||||
let output = (await import('$lib/hedge-funds/best-hedge-funds.json'))?.default
|
||||
output = locals?.user?.tier !== 'Pro' ? output?.slice(0,6) : output;
|
||||
|
||||
return output;
|
||||
};
|
||||
return {
|
||||
getBestHedgeFunds: await getBestHedgeFunds()
|
||||
};
|
||||
};
|
||||
@ -1,437 +0,0 @@
|
||||
<script lang='ts'>
|
||||
import { goto } from '$app/navigation';
|
||||
import {formatString} from '$lib/utils';
|
||||
import { abbreviateNumber } from '$lib/utils';
|
||||
import { screenWidth, numberOfUnreadNotification } from '$lib/store';
|
||||
import UpgradeToPro from '$lib/components/UpgradeToPro.svelte';
|
||||
|
||||
|
||||
export let data;
|
||||
|
||||
let hedgeFundList = [];
|
||||
let rawData = data?.getBestHedgeFunds;
|
||||
let sortBy = 'Win Rate';
|
||||
let order = 'highToLow';
|
||||
|
||||
|
||||
const sortByName = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return a?.name.localeCompare(b?.name);
|
||||
}
|
||||
else {
|
||||
return b?.name.localeCompare(a?.name);
|
||||
}
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
const sortByMarketValue = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.marketValue - a?.marketValue;
|
||||
}
|
||||
else {
|
||||
return a?.marketValue - b?.marketValue;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByNumberOfStocks = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.numberOfStocks - a?.numberOfStocks;
|
||||
}
|
||||
else {
|
||||
return a?.numberOfStocks - b?.numberOfStocks;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByTurnover = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.turnover - a?.turnover;
|
||||
}
|
||||
else {
|
||||
return a?.turnover - b?.turnover;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByWinRate = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.winRate - a?.winRate;
|
||||
}
|
||||
else {
|
||||
return a?.winRate - b?.winRate;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function selectSortingMethod(state:string) {
|
||||
|
||||
order = 'highToLow';
|
||||
|
||||
if(state === 'Value')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByMarketValue(rawData);
|
||||
}
|
||||
|
||||
else if (state === 'Stocks')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByNumberOfStocks(rawData);
|
||||
|
||||
}
|
||||
|
||||
else if (state === 'Turnover')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByTurnover(rawData);
|
||||
}
|
||||
|
||||
else if (state === 'Win Rate')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByWinRate(rawData);
|
||||
}
|
||||
|
||||
else if (state === 'Name: A-Z')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByName(rawData);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function changeOrder(state:string) {
|
||||
if (state === 'highToLow')
|
||||
{
|
||||
order = 'lowToHigh';
|
||||
}
|
||||
else {
|
||||
order = 'highToLow';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
let charNumber = 40;
|
||||
$: {
|
||||
if ($screenWidth < 640)
|
||||
{
|
||||
charNumber = 20
|
||||
}
|
||||
else {
|
||||
charNumber = 40;
|
||||
}
|
||||
}
|
||||
|
||||
$: {
|
||||
if(order)
|
||||
{
|
||||
if(sortBy === 'Value')
|
||||
{
|
||||
hedgeFundList = sortByMarketValue(rawData);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Stocks')
|
||||
{
|
||||
hedgeFundList = sortByNumberOfStocks(rawData);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Turnover')
|
||||
{
|
||||
hedgeFundList = sortByTurnover(rawData);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Win Rate')
|
||||
{
|
||||
hedgeFundList = sortByWinRate(rawData);
|
||||
}
|
||||
else if (sortBy === 'Name: A-Z')
|
||||
{
|
||||
hedgeFundList = sortByName(rawData);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<!-- HEADER FOR BETTER SEO -->
|
||||
<svelte:head>
|
||||
<title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} Best Hedge Funds · stocknear</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<meta name="description" content="Find the best performing Hedge Funds to copy their strategy to maximize your proftit.">
|
||||
<!-- Other meta tags -->
|
||||
<meta property="og:title" content="Best Hedge Funds · stocknear"/>
|
||||
<meta property="og:description" content="Find the best performing Hedge Funds to copy their strategy to maximize your proftit.">
|
||||
<meta property="og:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
<!-- Add more Open Graph meta tags as needed -->
|
||||
|
||||
<!-- Twitter specific meta tags -->
|
||||
<meta name="twitter:card" content="summary_large_image"/>
|
||||
<meta name="twitter:title" content="Best Hedge Funds · stocknear"/>
|
||||
<meta name="twitter:description" content="Find the best performing Hedge Funds to copy their strategy to maximize your proftit.">
|
||||
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
</svelte:head>
|
||||
|
||||
<section class="w-full max-w-4xl overflow-hidden m-auto">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="flex justify-start items-center ml-3 mb-10">
|
||||
<label for="sortByModal" class="cursor-pointer bg-[#0F0F0F] flex flex-row items-center">
|
||||
<span class="text-white text-sm sm:text-md mr-2">
|
||||
Sort By:
|
||||
</span>
|
||||
<div class="flex flex-row items-center">
|
||||
<span class="text-sm sm:text-md m-auto font-medium text-white">
|
||||
{sortBy}
|
||||
</span>
|
||||
<svg class="inline-block w-4 h-4 ml-1 mt-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
||||
<g transform="rotate(180 512 512)">
|
||||
<path fill="#fff" d="m488.832 344.32l-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872l319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0z"/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label on:click={() => changeOrder(order)} class="ml-auto flex flex-row items-center mr-3 cursor-pointer">
|
||||
<svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><path fill="{order === 'highToLow' ? 'white' : 'gray'}" d="m7.5 1.5l.354-.354L7.5.793l-.354.353l.354.354Zm-.354.354l4 4l.708-.708l-4-4l-.708.708Zm0-.708l-4 4l.708.708l4-4l-.708-.708ZM7 1.5V14h1V1.5H7Z"/></svg>
|
||||
<svg class="w-5 h-5 -ml-1.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><g transform="rotate(180 7.5 7.5)"><path fill="{order === 'lowToHigh' ? 'white' : 'gray'}" d="m7.5 1.5l.354-.354L7.5.793l-.354.353l.354.354Zm-.354.354l4 4l.708-.708l-4-4l-.708.708Zm0-.708l-4 4l.708.708l4-4l-.708-.708ZM7 1.5V14h1V1.5H7Z"/></g></svg>
|
||||
</label>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!---Start Top Winners/Losers-->
|
||||
<div class="flex flex-col justify-center items-center overflow-x-auto">
|
||||
|
||||
<table
|
||||
class="table table-sm sm:table-md table-compact rounded-none sm:rounded-md w-full bg-[#0F0F0F] border-bg-[#0F0F0F] m-auto">
|
||||
<thead>
|
||||
<tr class="border border-slate-800">
|
||||
<th class="text-white font-medium sm:font-bold text-sm">Company</th>
|
||||
<th class="text-white font-medium text-end sm:text-center sm:font-bold text-sm ">Value</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Stocks' ? 'hidden' : ''}">Stocks</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Turnover' ? 'hidden' : ''}">Turnover</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Value' && sortBy !== 'Win Rate' && sortBy !== 'Name: A-Z' ? 'hidden' : ''}">Win Rate</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each hedgeFundList as item, index}
|
||||
<tr on:click={() => goto("/hedge-funds/"+item?.cik)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] {index % 2 === 0 ? 'bg-opacity-[0.25] bg-[#323239]' : 'bg-[#0F0F0F]'} {index+1 === rawData?.length && data?.user?.tier !== 'Pro' ? 'opacity-[0.1]' : ''} border-b-[#0F0F0F] cursor-pointer">
|
||||
|
||||
<td class="text-gray-200 border-b-[#0F0F0F]">
|
||||
<div class="flex flex-row items-center ">
|
||||
<div class="">
|
||||
<span class="text-blue-400">
|
||||
{item?.name?.length > charNumber ? formatString(item?.name?.slice(0,charNumber)) + "..." : formatString(item?.name)}
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] text-end sm:text-center text-sm">
|
||||
{item?.marketValue !== null ? '$' + abbreviateNumber(item?.marketValue) : '-'}
|
||||
</td>
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] text-sm {$screenWidth < 640 && sortBy !== 'Stocks' ? 'hidden' : 'text-end'}">
|
||||
{item?.numberOfStocks !== null ? item?.numberOfStocks : '-'}
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
|
||||
<td class="text-white sm:font-medium text-end border-b-[#0F0F0F] {$screenWidth < 640 && sortBy !== 'Turnover' ? 'hidden' : ''}">
|
||||
{item?.turnover !== null ? item?.turnover?.toFixed(2) : '-'}
|
||||
</td>
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] {$screenWidth < 640 && sortBy !== 'Value' && sortBy !== 'Win Rate' && sortBy !== 'Name: A-Z' ? 'hidden' : ''}">
|
||||
<div class="flex flex-row justify-end items-center">
|
||||
<div class="flex flex-col items-center">
|
||||
<div class="flex flex-row mt-1">
|
||||
{#if item?.winRate >=0}
|
||||
<svg class="w-5 h-5 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#10db06" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#10DB06] text-xs sm:text-sm">+{item?.winRate?.toFixed(2)} %</span>
|
||||
{:else}
|
||||
<svg class="w-5 h-5 rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#FF2F1F" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#FF2F1F] text-xs sm:text-sm">{item?.winRate?.toFixed(2)} % </span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
</tr>
|
||||
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<UpgradeToPro data={data} title="Get the best Hedge Funds ranked by their Win Rate"/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Start Sort By Modal-->
|
||||
<input type="checkbox" id="sortByModal" class="modal-toggle" />
|
||||
|
||||
<dialog id="sortByModal" class="modal modal-bottom sm:modal-middle ">
|
||||
|
||||
|
||||
<label id="sortByModal" for="sortByModal" class="cursor-pointer modal-backdrop bg-[#0F0F0F] bg-opacity-[0.5]"></label>
|
||||
|
||||
|
||||
<div class="modal-box w-full bg-[#202020] sm:border sm:border-slate-800">
|
||||
|
||||
|
||||
|
||||
<label for="sortByModal" class="cursor-pointer absolute right-5 top-2 bg-[#202020] text-[1.8rem] text-white">
|
||||
✕
|
||||
</label>
|
||||
|
||||
<div class="text-white">
|
||||
<h3 class="font-medium text-lg sm:text-2xl mb-10">
|
||||
Sort By
|
||||
</h3>
|
||||
|
||||
|
||||
<div class="flex flex-col items-center w-full max-w-3xl bg-[#202020]">
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Value')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Value' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Value
|
||||
</span>
|
||||
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Value'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Stocks')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Stocks' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Number of Stocks
|
||||
</span>
|
||||
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Stocks'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Turnover')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Turnover' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Turnover
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Turnover'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Win Rate')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Win Rate' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Win Rate
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Win Rate'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Name: A-Z')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Name: A-Z' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Name: A-Z
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Name: A-Z'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</dialog>
|
||||
<!--End Sort By Modal-->
|
||||
|
||||
|
||||
@ -1,442 +0,0 @@
|
||||
<script lang='ts'>
|
||||
import { goto } from '$app/navigation';
|
||||
import {formatString} from '$lib/utils';
|
||||
import { abbreviateNumber } from '$lib/utils';
|
||||
import { screenWidth, numberOfUnreadNotification } from '$lib/store';
|
||||
|
||||
|
||||
export let data;
|
||||
|
||||
let hedgeFundList = [];
|
||||
let rawData = data?.getWorstHedgeFunds;
|
||||
let sortBy = 'Win Rate';
|
||||
let order = 'lowToHigh';
|
||||
|
||||
|
||||
const sortByName = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return a?.name.localeCompare(b?.name);
|
||||
}
|
||||
else {
|
||||
return b?.name.localeCompare(a?.name);
|
||||
}
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
const sortByMarketValue = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.marketValue - a?.marketValue;
|
||||
}
|
||||
else {
|
||||
return a?.marketValue - b?.marketValue;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByNumberOfStocks = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.numberOfStocks - a?.numberOfStocks;
|
||||
}
|
||||
else {
|
||||
return a?.numberOfStocks - b?.numberOfStocks;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByTurnover = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.turnover - a?.turnover;
|
||||
}
|
||||
else {
|
||||
return a?.turnover - b?.turnover;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const sortByWinRate = (liste) => {
|
||||
return liste?.sort(function(a, b) {
|
||||
if(order === 'highToLow')
|
||||
{
|
||||
return b?.winRate - a?.winRate;
|
||||
}
|
||||
else {
|
||||
return a?.winRate - b?.winRate;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function selectSortingMethod(state:string) {
|
||||
|
||||
order = 'highToLow';
|
||||
|
||||
if(state === 'Value')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByMarketValue(rawData);
|
||||
}
|
||||
|
||||
else if (state === 'Stocks')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByNumberOfStocks(rawData);
|
||||
|
||||
}
|
||||
|
||||
else if (state === 'Turnover')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByTurnover(rawData);
|
||||
}
|
||||
|
||||
else if (state === 'Win Rate')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByWinRate(rawData);
|
||||
}
|
||||
|
||||
else if (state === 'Name: A-Z')
|
||||
{
|
||||
sortBy = state;
|
||||
hedgeFundList = sortByName(rawData);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function changeOrder(state:string) {
|
||||
if (state === 'highToLow')
|
||||
{
|
||||
order = 'lowToHigh';
|
||||
}
|
||||
else {
|
||||
order = 'highToLow';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
let charNumber = 40;
|
||||
$: {
|
||||
if ($screenWidth < 640)
|
||||
{
|
||||
charNumber = 20
|
||||
}
|
||||
else {
|
||||
charNumber = 40;
|
||||
}
|
||||
}
|
||||
$: {
|
||||
if(order)
|
||||
{
|
||||
if(sortBy === 'Value')
|
||||
{
|
||||
hedgeFundList = sortByMarketValue(rawData);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Stocks')
|
||||
{
|
||||
hedgeFundList = sortByNumberOfStocks(rawData);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Turnover')
|
||||
{
|
||||
hedgeFundList = sortByTurnover(rawData);
|
||||
}
|
||||
|
||||
else if (sortBy === 'Win Rate')
|
||||
{
|
||||
hedgeFundList = sortByWinRate(rawData);
|
||||
}
|
||||
else if (sortBy === 'Name: A-Z')
|
||||
{
|
||||
hedgeFundList = sortByName(rawData);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<!-- HEADER FOR BETTER SEO -->
|
||||
<svelte:head>
|
||||
<title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} Worst Hedge Funds · stocknear</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<meta name="description" content="Find the worst performing Hedge Funds to learn from their expensive mistakes.">
|
||||
<!-- Other meta tags -->
|
||||
<meta property="og:title" content="Worst Hedge Funds · stocknear"/>
|
||||
<meta property="og:description" content="Find the worst performing Hedge Funds to learn from their expensive mistakes.">
|
||||
<meta property="og:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
<!-- Add more Open Graph meta tags as needed -->
|
||||
|
||||
<!-- Twitter specific meta tags -->
|
||||
<meta name="twitter:card" content="summary_large_image"/>
|
||||
<meta name="twitter:title" content="Worst Hedge Funds · stocknear"/>
|
||||
<meta name="twitter:description" content="Find the worst performing Hedge Funds to learn from their expensive mistakes.">
|
||||
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
</svelte:head>
|
||||
<section class="w-full max-w-4xl overflow-hidden m-auto">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="flex justify-start items-center ml-3 mb-10">
|
||||
<label for="sortByModal" class="cursor-pointer bg-[#0F0F0F] flex flex-row items-center">
|
||||
<span class="text-white text-sm sm:text-md mr-2">
|
||||
Sort By:
|
||||
</span>
|
||||
<div class="flex flex-row items-center">
|
||||
<span class="text-sm sm:text-md m-auto font-medium text-white">
|
||||
{sortBy}
|
||||
</span>
|
||||
<svg class="inline-block w-4 h-4 ml-1 mt-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
||||
<g transform="rotate(180 512 512)">
|
||||
<path fill="#fff" d="m488.832 344.32l-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872l319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0z"/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label on:click={() => changeOrder(order)} class="ml-auto flex flex-row items-center mr-3 cursor-pointer">
|
||||
<svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><path fill="{order === 'highToLow' ? 'white' : 'gray'}" d="m7.5 1.5l.354-.354L7.5.793l-.354.353l.354.354Zm-.354.354l4 4l.708-.708l-4-4l-.708.708Zm0-.708l-4 4l.708.708l4-4l-.708-.708ZM7 1.5V14h1V1.5H7Z"/></svg>
|
||||
<svg class="w-5 h-5 -ml-1.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><g transform="rotate(180 7.5 7.5)"><path fill="{order === 'lowToHigh' ? 'white' : 'gray'}" d="m7.5 1.5l.354-.354L7.5.793l-.354.353l.354.354Zm-.354.354l4 4l.708-.708l-4-4l-.708.708Zm0-.708l-4 4l.708.708l4-4l-.708-.708ZM7 1.5V14h1V1.5H7Z"/></g></svg>
|
||||
</label>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!---Start Top Winners/Losers-->
|
||||
<div class="flex flex-col justify-center items-center overflow-x-auto">
|
||||
|
||||
<table
|
||||
class="table table-sm sm:table-md table-compact rounded-none sm:rounded-md w-full bg-[#0F0F0F] border-bg-[#0F0F0F] m-auto">
|
||||
<thead>
|
||||
<tr class="border border-slate-800">
|
||||
<th class="text-white font-medium sm:font-bold text-sm">Company</th>
|
||||
<th class="text-white font-medium text-end sm:text-center sm:font-bold text-sm ">Value</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Stocks' ? 'hidden' : ''}">Stocks</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Turnover' ? 'hidden' : ''}">Turnover</th>
|
||||
<th class="text-white font-medium sm:font-bold text-end text-sm {$screenWidth < 640 && sortBy !== 'Value' && sortBy !== 'Win Rate' && sortBy !== 'Name: A-Z' ? 'hidden' : ''}">Win Rate</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each hedgeFundList as item, index}
|
||||
<tr on:click={() => goto("/hedge-funds/"+item?.cik)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] {index % 2 === 0 ? 'bg-opacity-[0.25] bg-[#323239]' : 'bg-[#0F0F0F]'} border-b-[#0F0F0F] cursor-pointer">
|
||||
|
||||
<td class="text-gray-200 border-b-[#0F0F0F]">
|
||||
<div class="flex flex-row items-center ">
|
||||
<div class="">
|
||||
<span class="text-blue-400">
|
||||
{item?.name?.length > charNumber ? formatString(item?.name?.slice(0,charNumber)) + "..." : formatString(item?.name)}
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] text-end sm:text-center text-sm">
|
||||
{item?.marketValue !== null ? '$' + abbreviateNumber(item?.marketValue) : '-'}
|
||||
</td>
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] text-sm {$screenWidth < 640 && sortBy !== 'Stocks' ? 'hidden' : 'text-end'}">
|
||||
{item?.numberOfStocks !== null ? item?.numberOfStocks : '-'}
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
|
||||
<td class="text-white sm:font-medium text-end border-b-[#0F0F0F] {$screenWidth < 640 && sortBy !== 'Turnover' ? 'hidden' : ''}">
|
||||
{item?.turnover !== null ? item?.turnover?.toFixed(2) : '-'}
|
||||
</td>
|
||||
|
||||
<td class="text-white sm:font-medium border-b-[#0F0F0F] {$screenWidth < 640 && sortBy !== 'Value' && sortBy !== 'Win Rate' && sortBy !== 'Name: A-Z' ? 'hidden' : ''}">
|
||||
<div class="flex flex-row justify-end items-center">
|
||||
<div class="flex flex-col items-center">
|
||||
<div class="flex flex-row mt-1">
|
||||
{#if item?.winRate >=0}
|
||||
<svg class="w-5 h-5 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#10db06" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#10DB06] text-xs sm:text-sm">+{item?.winRate?.toFixed(2)} %</span>
|
||||
{:else}
|
||||
<svg class="w-5 h-5 rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="evaArrowUpFill0"><g id="evaArrowUpFill1"><path id="evaArrowUpFill2" fill="#FF2F1F" d="M16.21 16H7.79a1.76 1.76 0 0 1-1.59-1a2.1 2.1 0 0 1 .26-2.21l4.21-5.1a1.76 1.76 0 0 1 2.66 0l4.21 5.1A2.1 2.1 0 0 1 17.8 15a1.76 1.76 0 0 1-1.59 1Z"/></g></g></svg>
|
||||
<span class="text-[#FF2F1F] text-xs sm:text-sm">{item?.winRate?.toFixed(2)} % </span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
|
||||
</tr>
|
||||
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
<!--
|
||||
{#if !fullList}
|
||||
<label on:click={showFullList} class="mt-10 btn btn-sm btn-outline btn-ghost text-white text-xs m-auto normal-case ">
|
||||
Show more
|
||||
</label>
|
||||
{/if}
|
||||
-->
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Start Sort By Modal-->
|
||||
<input type="checkbox" id="sortByModal" class="modal-toggle" />
|
||||
|
||||
<dialog id="sortByModal" class="modal modal-bottom sm:modal-middle ">
|
||||
|
||||
|
||||
<label id="sortByModal" for="sortByModal" class="cursor-pointer modal-backdrop bg-[#0F0F0F] bg-opacity-[0.5]"></label>
|
||||
|
||||
|
||||
<div class="modal-box w-full bg-[#202020] sm:border sm:border-slate-800">
|
||||
|
||||
|
||||
|
||||
<label for="sortByModal" class="cursor-pointer absolute right-5 top-2 bg-[#202020] text-[1.8rem] text-white">
|
||||
✕
|
||||
</label>
|
||||
|
||||
<div class="text-white">
|
||||
<h3 class="font-medium text-lg sm:text-2xl mb-10">
|
||||
Sort By
|
||||
</h3>
|
||||
|
||||
|
||||
<div class="flex flex-col items-center w-full max-w-3xl bg-[#202020]">
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Value')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Value' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Value
|
||||
</span>
|
||||
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Value'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Stocks')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Stocks' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Number of Stocks
|
||||
</span>
|
||||
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Stocks'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Turnover')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Turnover' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Turnover
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Turnover'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Win Rate')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Win Rate' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Win Rate
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Win Rate'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label for="sortByModal" on:click={() => selectSortingMethod('Name: A-Z')} class="cursor-pointer w-full flex flex-row justify-start items-center mb-5">
|
||||
<div class="flex flex-row items-center w-full bg-[#303030] p-3 rounded-lg {sortBy === 'Name: A-Z' ? 'ring-2 ring-[#04E000]' : ''}">
|
||||
<span class="ml-1 text-white font-medium mr-auto">
|
||||
Name: A-Z
|
||||
</span>
|
||||
<div class="rounded-full w-8 h-8 relative border border-[#737373]">
|
||||
{#if sortBy === 'Name: A-Z'}
|
||||
<svg class="w-full h-full rounded-full" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#0F0F0F000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --> <title>ic_fluent_checkmark_circle_48_filled</title> <desc>Created with Sketch.</desc> <g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="ic_fluent_checkmark_circle_48_filled" fill="#04E000" fill-rule="nonzero"> <path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" id="🎨-Color"> </path> </g> </g> </g></svg>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</dialog>
|
||||
<!--End Sort By Modal-->
|
||||
|
||||
|
||||
@ -1,29 +0,0 @@
|
||||
import { getCache, setCache } from '$lib/store';
|
||||
|
||||
|
||||
export const load = async ({ params }) => {
|
||||
const getWorstHedgeFunds = async () => {
|
||||
let output;
|
||||
|
||||
// Get cached data for the specific tickerID
|
||||
const cachedData = getCache('getWorstHedgeFunds', 'getWorstHedgeFunds');
|
||||
if (cachedData) {
|
||||
output = cachedData;
|
||||
} else {
|
||||
|
||||
output = await import('$lib/hedge-funds/worst-hedge-funds.json')
|
||||
|
||||
// Cache the data for this specific tickerID with a specific name 'getWorstHedgeFunds'
|
||||
setCache('getWorstHedgeFunds', output, 'getWorstHedgeFunds');
|
||||
}
|
||||
|
||||
|
||||
return output.default;
|
||||
};
|
||||
|
||||
// Make sure to return a promise
|
||||
return {
|
||||
getWorstHedgeFunds: await getWorstHedgeFunds()
|
||||
};
|
||||
};
|
||||
|
||||
28
src/routes/hedge-funds/workers/filterQuery.ts
Normal file
28
src/routes/hedge-funds/workers/filterQuery.ts
Normal file
@ -0,0 +1,28 @@
|
||||
import { compareTwoStrings } from 'string-similarity';
|
||||
|
||||
|
||||
|
||||
onmessage = async (event: MessageEvent) => {
|
||||
const rawData = event.data?.rawData;
|
||||
const filterQuery = event.data?.filterQuery;
|
||||
|
||||
const output = rawData?.filter(item => {
|
||||
const name = item?.name?.toLowerCase();
|
||||
// Check if name includes filterQuery
|
||||
if (name?.includes(filterQuery)) return true;
|
||||
|
||||
// Implement fuzzy search by checking similarity
|
||||
// You can adjust the threshold as needed
|
||||
const similarityThreshold = 0.5;
|
||||
const similarity = compareTwoStrings(name, filterQuery);
|
||||
return similarity > similarityThreshold;
|
||||
});
|
||||
|
||||
postMessage({ message: 'success', output});
|
||||
|
||||
// Sending data back to the main thread
|
||||
//postMessage({ message: 'Data received in the worker', ticker, apiURL });
|
||||
};
|
||||
|
||||
export {};
|
||||
|
||||
@ -119,7 +119,7 @@ onMount(async () => {
|
||||
newData = rawData?.filter(item => {
|
||||
const representative = item?.representative?.toLowerCase();
|
||||
// Check if representative includes filterQuery
|
||||
if (representative.includes(filterQuery)) return true;
|
||||
if (representative?.includes(filterQuery)) return true;
|
||||
|
||||
// Implement fuzzy search by checking similarity
|
||||
// You can adjust the threshold as needed
|
||||
@ -164,7 +164,6 @@ onMount(async () => {
|
||||
{
|
||||
displayList = filterList?.length !== 0 ? filterData(rawData) : rawData;
|
||||
displayList = [...displayList];
|
||||
console.log(filterList)
|
||||
changeRuleFilter = false;
|
||||
//console.log(slicedRawData?.length)
|
||||
}
|
||||
|
||||
@ -75,9 +75,7 @@ const pages = [
|
||||
{title: "/market-mover"},
|
||||
{title: "/community"},
|
||||
{title: "/community/create-post"},
|
||||
{title: "/hedge-funds/category/best"},
|
||||
{title: "/hedge-funds/category/worst"},
|
||||
{title: "/hedge-funds/category/all"},
|
||||
{title: "/hedge-funds"},
|
||||
{title: "/login"},
|
||||
{title: "/register"},
|
||||
{title: "/watchlist"},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user