bugfixing: community post position
This commit is contained in:
MuslemRahimi
parent
807250d17f
commit
5f49a04506
@ -53,7 +53,7 @@
|
||||
</li>
|
||||
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0" >
|
||||
<a href="/donation" class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400">Sponsor Us ❤</a>
|
||||
<a href="/donation" class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400">Support Us ❤</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -106,6 +106,7 @@ export const corporateLobbyingComponent = writable(<boolean>false);
|
||||
export const fomcImpactComponent = writable(<boolean>false);
|
||||
export const scoreComponent = writable(<boolean>false);
|
||||
|
||||
export const goBackToPostId = writable(<string>"");
|
||||
export const strategyId = writable(<string>"");
|
||||
export const articleId = writable(<string>"");
|
||||
|
||||
|
||||
@ -78,68 +78,7 @@ function convertTimestamp(unixTimestamp) {
|
||||
return formattedDate;
|
||||
}
|
||||
|
||||
//const tickerGraphName = data?.getDashboard?.retailTracker?.map(item => item?.symbol) || [];
|
||||
//const tradedList = data?.getDashboard?.retailTracker?.map(item => item?.traded) || [];
|
||||
|
||||
/*
|
||||
const optionsGraph = {
|
||||
animation: false,
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '3%',
|
||||
bottom: '6%',
|
||||
top: '0%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'value',
|
||||
splitLine: {
|
||||
show: false, // Disable x-axis grid lines
|
||||
},
|
||||
axisLabel: {
|
||||
show: false // Hide x-axis labels
|
||||
},
|
||||
axisTick: {
|
||||
show: false // Hide x-axis ticks
|
||||
},
|
||||
axisLine: {
|
||||
show: false // Hide x-axis line
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
data: tickerGraphName,
|
||||
inverse: true,
|
||||
axisTick: {
|
||||
show: false // Hide x-axis ticks
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff' // Set the y-axis label color to white
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: tradedList,
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: function(params) {
|
||||
return abbreviateNumber(params?.value,true);
|
||||
},
|
||||
fontWeight: 600,
|
||||
},
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.2)'
|
||||
},
|
||||
itemStyle: {
|
||||
color: 'white' // Bar color is white
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
*/
|
||||
|
||||
function latestInfoDate(inputDate) {
|
||||
// Convert the input date string to milliseconds since epoch
|
||||
@ -205,10 +144,10 @@ onMount( async() => {
|
||||
<svelte:options immutable={true}/>
|
||||
|
||||
|
||||
<div class="w-full xl:max-w-screen-2xl overflow-hidden m-auto min-h-screen bg-[#09090B]">
|
||||
<div class="w-full xl:max-w-screen-2xl overflow-hidden m-auto min-h-screen bg-[#09090B] mb-40">
|
||||
|
||||
{#if data?.user?.tier !== 'Pro' || data?.user?.freeTrial === true}
|
||||
<div class="mb-5 relative isolate text-center flex justify-center items-center gap-x-6 overflow-hidden bg-purple-600 px-6 py-3.5 sm:py-2.5 sm:px-3.5 sm:before:flex-1">
|
||||
<div class="mb-5 relative isolate sm:rounded text-center flex justify-center items-center gap-x-6 overflow-hidden bg-purple-600 px-6 py-3.5 sm:py-2.5 sm:px-3.5 sm:before:flex-1">
|
||||
<div class="absolute left-[max(-7rem,calc(50%-52rem))] top-1/2 -z-10 -translate-y-1/2 transform-gpu blur-2xl" aria-hidden="true">
|
||||
<div class="aspect-[577/310] w-[36.0625rem] bg-gradient-to-r from-[#ff80b5] to-[#9089fc] opacity-30" style="clip-path: polygon(74.8% 41.9%, 97.2% 73.2%, 100% 34.9%, 92.5% 0.4%, 87.5% 0%, 75% 28.6%, 58.5% 54.6%, 50.1% 56.8%, 46.9% 44%, 48.3% 17.4%, 24.7% 53.9%, 0% 27.9%, 11.9% 74.2%, 24.9% 54.1%, 68.6% 100%, 74.8% 41.9%)"></div>
|
||||
</div>
|
||||
@ -453,7 +392,7 @@ onMount( async() => {
|
||||
</Card.Content>
|
||||
</Card.Root>
|
||||
|
||||
<Card.Root class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[400px]">
|
||||
<Card.Root class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[550px]">
|
||||
<Card.Header class="flex flex-row items-center">
|
||||
<div class="flex flex-col items-start w-full">
|
||||
<div class="flex flex-row w-full items-center">
|
||||
@ -493,7 +432,7 @@ onMount( async() => {
|
||||
</Card.Content>
|
||||
</Card.Root>
|
||||
|
||||
<Card.Root class="order-2 sm:order-3 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[400px]">
|
||||
<Card.Root class="order-2 sm:order-3 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[550px]">
|
||||
<Card.Header class="flex flex-row items-center">
|
||||
<div class="flex flex-col items-start w-full">
|
||||
<div class="flex flex-row w-full items-center">
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<script lang='ts'>
|
||||
|
||||
import { onMount,onDestroy } from 'svelte';
|
||||
import { postVote, discordMembers, setCache, getCache, cachedPosts, currentPagePosition, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
|
||||
import { postVote, discordMembers, cachedPosts, goBackToPostId, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
|
||||
|
||||
import { afterNavigate } from '$app/navigation';
|
||||
import { base } from '$app/paths'
|
||||
@ -19,7 +19,7 @@
|
||||
let discordURL = import.meta.env.VITE_DISCORD_URL;
|
||||
|
||||
|
||||
let loading = true;
|
||||
let isLoaded = false;
|
||||
|
||||
|
||||
let moderators = data?.getModerators;
|
||||
@ -115,14 +115,11 @@ onMount(async () => {
|
||||
getPost(),
|
||||
//getTickerMentioning(),
|
||||
]);
|
||||
|
||||
window.scrollTo(0, 0);
|
||||
}
|
||||
|
||||
else {
|
||||
// Use cached data if available
|
||||
posts = $cachedPosts?.posts;
|
||||
//tickerMentioning = getCache('','getTickerMentioning');
|
||||
}
|
||||
|
||||
if(!data?.user)
|
||||
@ -132,7 +129,7 @@ onMount(async () => {
|
||||
|
||||
BottomNavigation = (await import('$lib/components/BottomNavigation.svelte')).default;
|
||||
|
||||
loading = false;
|
||||
isLoaded = true;
|
||||
|
||||
});
|
||||
|
||||
@ -140,6 +137,7 @@ onMount(async () => {
|
||||
onDestroy(async () => {
|
||||
$postIdDeleted ='';
|
||||
$postVote = {};
|
||||
$goBackToPostId = '';
|
||||
});
|
||||
|
||||
|
||||
@ -148,7 +146,7 @@ onDestroy(async () => {
|
||||
let sortingPosts = $cachedPosts?.sortingPosts?.length > 0 ? $cachedPosts?.sortingPosts : 'hot';
|
||||
|
||||
async function handleCategoryOfPosts(state) {
|
||||
loading = true;
|
||||
isLoaded = false;
|
||||
posts = [];
|
||||
currentPage = 1;
|
||||
postLoading = false;
|
||||
@ -158,12 +156,11 @@ async function handleCategoryOfPosts(state) {
|
||||
sortingPosts = state;
|
||||
$cachedPosts = {};
|
||||
posts = await getPost();
|
||||
loading = false;
|
||||
isLoaded = true;
|
||||
}
|
||||
|
||||
|
||||
|
||||
let yPosition;
|
||||
let goBackToPosition = false;
|
||||
|
||||
|
||||
@ -230,6 +227,7 @@ $: {
|
||||
}
|
||||
|
||||
|
||||
|
||||
$: {
|
||||
if($postVote && Object?.keys($postVote).length !== 0 && data?.user?.id)
|
||||
{
|
||||
@ -251,23 +249,28 @@ $: {
|
||||
}
|
||||
}
|
||||
|
||||
$: {
|
||||
if(yPosition)
|
||||
{
|
||||
$currentPagePosition = Math.floor(yPosition);
|
||||
|
||||
// Reactive statement to check and scroll to the target post
|
||||
$: if ($goBackToPostId?.length !== 0 && $cachedPosts?.posts?.length !== 0&& typeof window !== 'undefined') {
|
||||
const postExists = $cachedPosts?.posts?.find(post => post?.id === $goBackToPostId);
|
||||
isLoaded = false;
|
||||
if (postExists) {
|
||||
scrollToPost($goBackToPostId);
|
||||
$goBackToPostId = '';
|
||||
}
|
||||
isLoaded = true;
|
||||
}
|
||||
|
||||
function scrollToPost(postId) {
|
||||
// Add a small delay to ensure DOM is updated
|
||||
setTimeout(() => {
|
||||
const targetDiv = document.getElementById(`post-${postId}`);
|
||||
if (targetDiv) {
|
||||
targetDiv.scrollIntoView(true);
|
||||
}
|
||||
}, 0);
|
||||
}
|
||||
|
||||
$: {
|
||||
if(goBackToPosition && typeof window !== 'undefined')
|
||||
{
|
||||
goBackToPosition = false;
|
||||
window?.scrollTo({top: $currentPagePosition});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
@ -294,14 +297,6 @@ $: {
|
||||
</svelte:head>
|
||||
|
||||
|
||||
|
||||
|
||||
<svelte:window bind:scrollY={yPosition} />
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<body class="bg-[#09090B] sm:mt-5 max-w-3xl sm:max-w-screen-2xl">
|
||||
|
||||
|
||||
@ -329,7 +324,7 @@ $: {
|
||||
<div class="sm:pt-6 pb-12 w-full">
|
||||
<div class="lg:pr-5">
|
||||
<!--<CreateNewPost />-->
|
||||
<div class="{!loading? 'hidden' : ''}">
|
||||
<div class="{isLoaded ? 'hidden' : ''}">
|
||||
{#each Array(5) as _}
|
||||
<SkeletonLoading />
|
||||
{/each}
|
||||
@ -364,12 +359,12 @@ $: {
|
||||
</div>
|
||||
<!--End choose Hot or New Posts-->
|
||||
|
||||
{#if !loading}
|
||||
{#if isLoaded}
|
||||
|
||||
{#each posts as post}
|
||||
|
||||
<div class="flex items-start w-full">
|
||||
<div class="w-full m-auto">
|
||||
<div id="post-{post.id}" class="w-full m-auto">
|
||||
<PostSection
|
||||
data={data}
|
||||
posts= {post}
|
||||
@ -414,7 +409,7 @@ $: {
|
||||
<!-- Sidebar -->
|
||||
<aside class="hidden lg:inline-block h-sh lg:w-1/2 pt-[1.5rem] pr-0 lg:pr-2 xl:pr-0">
|
||||
|
||||
{#if !loading}
|
||||
{#if isLoaded}
|
||||
|
||||
<!-- Sidebar content -->
|
||||
<div class="lg:pl-2 z-20 h-full">
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
|
||||
|
||||
import { onMount, onDestroy } from 'svelte';
|
||||
import {cachedPosts, postVote, screenWidth, scrollToComment, postIdDeleted, setCache, getCache, tagList, numberOfUnreadNotification, commentAdded, commentUpdated, commentIdDeleted } from '$lib/store';
|
||||
import {cachedPosts, postVote, screenWidth, scrollToComment, postIdDeleted, goBackToPostId, tagList, numberOfUnreadNotification, commentAdded, commentUpdated, commentIdDeleted } from '$lib/store';
|
||||
import { goto, afterNavigate } from '$app/navigation';
|
||||
import { base } from '$app/paths'
|
||||
|
||||
@ -33,7 +33,6 @@
|
||||
let userAlreadyVoted;
|
||||
|
||||
|
||||
|
||||
const handleUpvote = async (event) => {
|
||||
|
||||
event.preventDefault(); // prevent the default form submission behavior
|
||||
@ -293,6 +292,7 @@
|
||||
$commentIdDeleted = '';
|
||||
$scrollToComment = '';
|
||||
$postVote = {};
|
||||
$goBackToPostId = data?.getPostId
|
||||
})
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user