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

add download button to market movers

Browse Source
This commit is contained in:
MuslemRahimi 2024-11-07 00:05:20 +01:00
parent 4c45c00a0f
commit 3ec0259125
4 changed files with 152 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/lib/utils.ts
View File

@ -1307,17 +1307,6 @@ export const getLastTradingDay = () => {
const nyDate = new Date(
date.toLocaleString("en-US", { timeZone: etTimeZone }),
);
const currentHour = nyDate.getHours();
const currentMinutes = nyDate.getMinutes();
const isMarketClosed =
currentHour < 9 ||
(currentHour === 9 && currentMinutes < 30) ||
currentHour >= 16;
// If market is closed, move to the previous day
if (isMarketClosed) {
nyDate.setDate(nyDate.getDate() - 1);
}
// Loop backwards to find the most recent trading day
while (true) {

52
src/routes/market-mover/[slug]/+page.svelte
View File

@ -2,6 +2,8 @@
import { screenWidth, numberOfUnreadNotification } from "$lib/store";
import { abbreviateNumber, getLastTradingDay } from "$lib/utils";
import TableHeader from "$lib/components/Table/TableHeader.svelte";
import { goto } from "$app/navigation";
import { afterUpdate } from "svelte";
export let data;
let timePeriod = "1D";
@ -119,6 +121,34 @@
});
$: charNumber = $screenWidth < 640 ? 20 : 30;
const exportData = (format = "csv") => {
if (data?.user?.tier === "Pro") {
// Add headers row
const csvRows = [];
csvRows.push("Rank,Symbol,Name,Change, Price, Market Cap, Volume");
// Add data rows
stockList?.forEach((item) => {
const csvRow = `${item?.rank},${item?.symbol},${item?.name},${item?.changesPercentage},${item?.price},${item?.marketCap},${item?.volume}`;
csvRows.push(csvRow);
});
// Create CSV blob and trigger download
const csv = csvRows.join("\n");
const blob = new Blob([csv], { type: "text/csv" });
const url = window.URL.createObjectURL(blob);
const a = document.createElement("a");
a.setAttribute("hidden", "");
a.setAttribute("href", url);
a.setAttribute("download", `${data?.getParams}_${timePeriod}.csv`);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
} else {
goto("/pricing");
}
};
</script>
<svelte:head>
@ -238,6 +268,28 @@
<span class="hidden lg:inline">Updated</span>
{lastTradingDay}
</div>
<div
class="flex flex-row items-center justify-end w-fit sm:w-[50%] md:w-auto ml-auto"
>
<label
on:click={() => exportData("csv")}
class="cursor-pointer w-fit border-gray-600 border bg-[#09090B] text-sm px-3 sm:px-4 py-1.5 sm:py-2 sm:hover:bg-[#27272A] ease-out flex flex-row justify-between items-center text-white rounded-md"
>
<span class="truncate">Download</span>
<svg
class="{data?.user?.tier === 'Pro'
? 'hidden'
: ''} ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z"
/></svg
>
</label>
</div>
</div>
</div>

50
src/routes/market-mover/afterhours/+page.svelte
View File

@ -2,6 +2,7 @@
import { screenWidth, numberOfUnreadNotification } from "$lib/store";
import { abbreviateNumber, getLastTradingDay } from "$lib/utils";
import TableHeader from "$lib/components/Table/TableHeader.svelte";
import { goto } from "$app/navigation";
export let data;
let categoryType = "gainers";
@ -103,6 +104,34 @@
stockList = [...originalData].sort(compareValues);
};
$: charNumber = $screenWidth < 640 ? 20 : 30;
const exportData = (format = "csv") => {
if (data?.user?.tier === "Pro") {
// Add headers row
const csvRows = [];
csvRows.push("Rank,Symbol,Name,Change, Price, Market Cap, Volume");
// Add data rows
stockList?.forEach((item) => {
const csvRow = `${item?.rank},${item?.symbol},${item?.name},${item?.changesPercentage},${item?.price},${item?.marketCap},${item?.volume}`;
csvRows.push(csvRow);
});
// Create CSV blob and trigger download
const csv = csvRows.join("\n");
const blob = new Blob([csv], { type: "text/csv" });
const url = window.URL.createObjectURL(blob);
const a = document.createElement("a");
a.setAttribute("hidden", "");
a.setAttribute("href", url);
a.setAttribute("download", `afterhours_${categoryType}.csv`);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
} else {
goto("/pricing");
}
};
</script>
<svelte:head>
@ -190,6 +219,27 @@
<span class="hidden lg:inline">Updated</span>
{lastTradingDay}
</div>
<div
class="flex flex-row items-center justify-end w-fit sm:w-[50%] md:w-auto ml-auto"
>
<label
on:click={() => exportData("csv")}
class="cursor-pointer w-fit border-gray-600 border bg-[#09090B] text-sm px-3 sm:px-4 py-1.5 sm:py-2 sm:hover:bg-[#27272A] ease-out flex flex-row justify-between items-center text-white rounded-md"
>
<span class="truncate">Download</span>
<svg
class="{data?.user?.tier === 'Pro'
? 'hidden'
: ''} ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z"
/></svg
>
</label>
</div>
</div>
</div>

50
src/routes/market-mover/premarket/+page.svelte
View File

@ -2,6 +2,7 @@
import { screenWidth, numberOfUnreadNotification } from "$lib/store";
import { abbreviateNumber, getLastTradingDay } from "$lib/utils";
import TableHeader from "$lib/components/Table/TableHeader.svelte";
import { goto } from "$app/navigation";
export let data;
let categoryType = "gainers";
@ -112,6 +113,34 @@
stockList = [...originalData].sort(compareValues);
};
$: charNumber = $screenWidth < 640 ? 20 : 30;
const exportData = (format = "csv") => {
if (data?.user?.tier === "Pro") {
// Add headers row
const csvRows = [];
csvRows.push("Rank,Symbol,Name,Change, Price, Market Cap, Volume");
// Add data rows
stockList?.forEach((item) => {
const csvRow = `${item?.rank},${item?.symbol},${item?.name},${item?.changesPercentage},${item?.price},${item?.marketCap},${item?.volume}`;
csvRows.push(csvRow);
});
// Create CSV blob and trigger download
const csv = csvRows.join("\n");
const blob = new Blob([csv], { type: "text/csv" });
const url = window.URL.createObjectURL(blob);
const a = document.createElement("a");
a.setAttribute("hidden", "");
a.setAttribute("href", url);
a.setAttribute("download", `premarket_${categoryType}.csv`);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
} else {
goto("/pricing");
}
};
</script>
<svelte:head>
@ -199,6 +228,27 @@
<span class="hidden lg:inline">Updated</span>
{lastTradingDay}
</div>
<div
class="flex flex-row items-center justify-end w-fit sm:w-[50%] md:w-auto ml-auto"
>
<label
on:click={() => exportData("csv")}
class="cursor-pointer w-fit border-gray-600 border bg-[#09090B] text-sm px-3 sm:px-4 py-1.5 sm:py-2 sm:hover:bg-[#27272A] ease-out flex flex-row justify-between items-center text-white rounded-md"
>
<span class="truncate">Download</span>
<svg
class="{data?.user?.tier === 'Pro'
? 'hidden'
: ''} ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z"
/></svg
>
</label>
</div>
</div>
</div>