ui fixes
This commit is contained in:
parent
05a14b91be
commit
226d21c6e7
@ -74,7 +74,7 @@ export const oauthProvider = writable(<string> (""));
|
|||||||
|
|
||||||
export const switchWatchList = writable(<boolean>(false));
|
export const switchWatchList = writable(<boolean>(false));
|
||||||
|
|
||||||
export const cachedPosts = writable(<Array<any>> []);
|
export const cachedPosts = writable(<Array<any>> {});
|
||||||
export const currentPagePosition = writable(<Number> (0));
|
export const currentPagePosition = writable(<Number> (0));
|
||||||
|
|
||||||
export const similarTickerClicked = writable(<boolean>(false));
|
export const similarTickerClicked = writable(<boolean>(false));
|
||||||
|
|||||||
@ -163,7 +163,7 @@ async function getPost() {
|
|||||||
|
|
||||||
let postData;
|
let postData;
|
||||||
|
|
||||||
if ($cachedPosts?.length === 0)
|
if (Object?.keys($cachedPosts)?.length === 0)
|
||||||
{
|
{
|
||||||
postData = {
|
postData = {
|
||||||
//userId: data?.user.id,
|
//userId: data?.user.id,
|
||||||
@ -176,8 +176,8 @@ async function getPost() {
|
|||||||
{
|
{
|
||||||
postData = {
|
postData = {
|
||||||
//userId: data?.user.id,
|
//userId: data?.user.id,
|
||||||
startPage: $cachedPosts[0].currentPage,
|
startPage: $cachedPosts?.currentPage,
|
||||||
seenPostId: $cachedPosts[0].seenPostId.length === 0 ? [] : $cachedPosts[0].seenPostId,
|
seenPostId: $cachedPosts?.seenPostId.length === 0 ? [] : $cachedPosts?.seenPostId,
|
||||||
sortingPosts: sortingPosts,
|
sortingPosts: sortingPosts,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@ -227,9 +227,9 @@ let LoginPopup;
|
|||||||
let BottomNavigation;
|
let BottomNavigation;
|
||||||
|
|
||||||
onMount(async () => {
|
onMount(async () => {
|
||||||
if ($cachedPosts?.length === 0) {
|
if (Object?.keys($cachedPosts)?.length === 0) {
|
||||||
// Only make API requests if cached posts are not available
|
// Only make API requests if cached posts are not available
|
||||||
[communityStats, moderators, posts, discordData] = await Promise.all([
|
[communityStats, moderators, posts, discordData] = await Promise?.all([
|
||||||
getCommunityStats(),
|
getCommunityStats(),
|
||||||
getModerators(),
|
getModerators(),
|
||||||
getPost(),
|
getPost(),
|
||||||
@ -244,7 +244,7 @@ onMount(async () => {
|
|||||||
|
|
||||||
else {
|
else {
|
||||||
// Use cached data if available
|
// Use cached data if available
|
||||||
posts = $cachedPosts?.at(0)?.posts;
|
posts = $cachedPosts?.posts;
|
||||||
communityStats = getCache('', 'getCommunityStats');
|
communityStats = getCache('', 'getCommunityStats');
|
||||||
moderators = getCache('', 'getModerators');
|
moderators = getCache('', 'getModerators');
|
||||||
discordData = getCache('','getDiscordWidget');
|
discordData = getCache('','getDiscordWidget');
|
||||||
@ -269,7 +269,7 @@ onDestroy(async () => {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
let sortingPosts = $cachedPosts?.at(0)?.sortingPosts?.length > 0 ? $cachedPosts?.at(0)?.sortingPosts : 'hot';
|
let sortingPosts = $cachedPosts?.sortingPosts?.length > 0 ? $cachedPosts?.sortingPosts : 'hot';
|
||||||
|
|
||||||
async function handleCategoryOfPosts(state) {
|
async function handleCategoryOfPosts(state) {
|
||||||
loading = true;
|
loading = true;
|
||||||
@ -280,7 +280,7 @@ async function handleCategoryOfPosts(state) {
|
|||||||
noPostMore = false;
|
noPostMore = false;
|
||||||
|
|
||||||
sortingPosts = state;
|
sortingPosts = state;
|
||||||
$cachedPosts = [];
|
$cachedPosts = {};
|
||||||
posts = await getPost();
|
posts = await getPost();
|
||||||
loading = false;
|
loading = false;
|
||||||
}
|
}
|
||||||
@ -319,7 +319,7 @@ $: {
|
|||||||
$: {
|
$: {
|
||||||
if(posts)
|
if(posts)
|
||||||
{
|
{
|
||||||
$cachedPosts = [{"sortingPosts": sortingPosts,'currentPage': currentPage, 'seenPostId': seenPostId, 'posts': posts}];
|
$cachedPosts = {"sortingPosts": sortingPosts,'currentPage': currentPage, 'seenPostId': seenPostId, 'posts': posts};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,38 +1,7 @@
|
|||||||
import { error, fail, redirect } from "@sveltejs/kit";
|
import { error, fail, redirect } from "@sveltejs/kit";
|
||||||
import { validateData } from "$lib/utils";
|
import { validateData } from "$lib/utils";
|
||||||
import { loginUserSchema, registerUserSchema } from "$lib/schemas";
|
import { loginUserSchema, registerUserSchema } from "$lib/schemas";
|
||||||
import { userRegion, oauthState, oauthVerifier, oauthProvider } from '$lib/store';
|
import { oauthState, oauthVerifier, oauthProvider } from '$lib/store';
|
||||||
|
|
||||||
|
|
||||||
const usRegion = ['cle1','iad1','pdx1','sfo1'];
|
|
||||||
let fastifyURL = import.meta.env.VITE_EU_FASTIFY_URL;
|
|
||||||
|
|
||||||
userRegion.subscribe(value => {
|
|
||||||
if (usRegion.includes(value)) {
|
|
||||||
fastifyURL = import.meta.env.VITE_USEAST_FASTIFY_URL;
|
|
||||||
} else {
|
|
||||||
fastifyURL = import.meta.env.VITE_EU_FASTIFY_URL;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
export const load = async ({ params }) => {
|
|
||||||
|
|
||||||
|
|
||||||
const getPostId = async () => {
|
|
||||||
|
|
||||||
return params.postId;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
return {
|
|
||||||
getPostId: await getPostId(),
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export const actions = {
|
export const actions = {
|
||||||
|
|||||||
@ -1,26 +1,28 @@
|
|||||||
<script lang='ts'>
|
<script lang='ts'>
|
||||||
import {getImageURL, formatDate} from '$lib/utils';
|
import {getImageURL, formatDate} from '$lib/utils';
|
||||||
import CommentSection from '$lib/components/CommentSection.svelte';
|
import CommentSection from '$lib/components/CommentSection.svelte';
|
||||||
import TextEditor from '$lib/components/TextEditor.svelte';
|
import TextEditor from '$lib/components/TextEditor.svelte';
|
||||||
import Downvote from '$lib/components/Downvote.svelte';
|
import Downvote from '$lib/components/Downvote.svelte';
|
||||||
import Upvote from '$lib/components/Upvote.svelte';
|
import Upvote from '$lib/components/Upvote.svelte';
|
||||||
import VideoPlayer from '$lib/components/VideoPlayer.svelte';
|
import VideoPlayer from '$lib/components/VideoPlayer.svelte';
|
||||||
|
|
||||||
import { onMount, onDestroy } from 'svelte';
|
|
||||||
import {cachedPosts, userRegion, screenWidth, scrollToComment, postIdDeleted, setCache, getCache, tagList, numberOfUnreadNotification, commentAdded, commentUpdated, commentIdDeleted } from '$lib/store';
|
|
||||||
import { goto, afterNavigate } from '$app/navigation';
|
|
||||||
import { base } from '$app/paths'
|
|
||||||
|
|
||||||
import toast from 'svelte-french-toast';
|
|
||||||
|
|
||||||
export let data;
|
import { onMount, onDestroy } from 'svelte';
|
||||||
export let form;
|
import {userRegion, screenWidth, scrollToComment, postIdDeleted, setCache, getCache, tagList, numberOfUnreadNotification, commentAdded, commentUpdated, commentIdDeleted } from '$lib/store';
|
||||||
|
import { goto, afterNavigate } from '$app/navigation';
|
||||||
|
import { base } from '$app/paths'
|
||||||
|
|
||||||
const usRegion = ['cle1','iad1','pdx1','sfo1'];
|
import toast from 'svelte-french-toast';
|
||||||
|
|
||||||
let fastifyURL;
|
export let data;
|
||||||
|
export let form;
|
||||||
|
|
||||||
userRegion.subscribe(value => {
|
const usRegion = ['cle1','iad1','pdx1','sfo1'];
|
||||||
|
|
||||||
|
let fastifyURL;
|
||||||
|
|
||||||
|
userRegion.subscribe(value => {
|
||||||
|
|
||||||
if (usRegion.includes(value)) {
|
if (usRegion.includes(value)) {
|
||||||
fastifyURL = import.meta.env.VITE_USEAST_FASTIFY_URL;
|
fastifyURL = import.meta.env.VITE_USEAST_FASTIFY_URL;
|
||||||
@ -30,35 +32,19 @@ userRegion.subscribe(value => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
let post = {'id': 'test', 'upvote': 0, 'downvote': 0};
|
let post = data?.getOnePost;
|
||||||
let isScrolled = false;
|
let isScrolled = false;
|
||||||
let isLoaded = false;
|
let isLoaded = false;
|
||||||
|
|
||||||
let upvoteButtonClicked = {};
|
let upvoteButtonClicked = {};
|
||||||
let downvoteButtonClicked = {};
|
let downvoteButtonClicked = {};
|
||||||
let upvoteCounter = {};
|
let upvoteCounter = {};
|
||||||
let downvoteCounter = {};
|
let downvoteCounter = {};
|
||||||
let userAlreadyVoted;
|
let userAlreadyVoted;
|
||||||
|
|
||||||
async function getOnePost() {
|
|
||||||
|
|
||||||
const postData = {'postId': data?.getPostId};
|
|
||||||
|
|
||||||
const response = await fetch(fastifyURL+'/get-one-post', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
body: JSON.stringify(postData),
|
|
||||||
});
|
|
||||||
|
|
||||||
const output = await response.json()
|
|
||||||
return output?.items
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
const handleUpvote = async (event) => {
|
|
||||||
|
const handleUpvote = async (event) => {
|
||||||
|
|
||||||
event.preventDefault(); // prevent the default form submission behavior
|
event.preventDefault(); // prevent the default form submission behavior
|
||||||
|
|
||||||
@ -90,9 +76,9 @@ const handleUpvote = async (event) => {
|
|||||||
body: JSON.stringify(postData)
|
body: JSON.stringify(postData)
|
||||||
}); // make a POST request to the server with the FormData object
|
}); // make a POST request to the server with the FormData object
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleDownvote = async (event) => {
|
const handleDownvote = async (event) => {
|
||||||
event.preventDefault(); // prevent the default form submission behavior
|
event.preventDefault(); // prevent the default form submission behavior
|
||||||
|
|
||||||
const postId = event.target.postId.value;
|
const postId = event.target.postId.value;
|
||||||
@ -125,9 +111,9 @@ const handleDownvote = async (event) => {
|
|||||||
body: JSON.stringify(postData)
|
body: JSON.stringify(postData)
|
||||||
}); // make a POST request to the server with the FormData object
|
}); // make a POST request to the server with the FormData object
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
function handleScroll() {
|
function handleScroll() {
|
||||||
// Check the scroll position
|
// Check the scroll position
|
||||||
|
|
||||||
isScrolled = window.scrollY > 0;
|
isScrolled = window.scrollY > 0;
|
||||||
@ -135,7 +121,7 @@ function handleScroll() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const sortCommentsByDate = (comments) => {
|
const sortCommentsByDate = (comments) => {
|
||||||
return comments.sort(function(a, b) {
|
return comments.sort(function(a, b) {
|
||||||
return new Date(b?.created) - new Date(a?.created);
|
return new Date(b?.created) - new Date(a?.created);
|
||||||
});
|
});
|
||||||
@ -144,33 +130,33 @@ const sortCommentsByDate = (comments) => {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
let dropdownOpen = false; // State variable to control dropdown visibility
|
let dropdownOpen = false; // State variable to control dropdown visibility
|
||||||
|
|
||||||
function toggleDropdown() {
|
function toggleDropdown() {
|
||||||
dropdownOpen = !dropdownOpen;
|
dropdownOpen = !dropdownOpen;
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleCopyLink = async () => {
|
const handleCopyLink = async () => {
|
||||||
dropdownOpen = !dropdownOpen;
|
dropdownOpen = !dropdownOpen;
|
||||||
await navigator.clipboard.writeText("https://stocknear.com/community/post/"+post.id);
|
await navigator.clipboard.writeText("https://stocknear.com/community/post/"+post.id);
|
||||||
|
|
||||||
toast.success('Link copied', {
|
toast.success('Link copied', {
|
||||||
style: 'border-radius: 200px; background: #333; color: #fff;'
|
style: 'border-radius: 200px; background: #333; color: #fff;'
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const handleReport = async () => {
|
const handleReport = async () => {
|
||||||
|
|
||||||
dropdownOpen = !dropdownOpen;
|
dropdownOpen = !dropdownOpen;
|
||||||
toast.success('Post has been reported. Thank you!', {
|
toast.success('Post has been reported. Thank you!', {
|
||||||
style: 'border-radius: 200px; background: #333; color: #fff;'
|
style: 'border-radius: 200px; background: #333; color: #fff;'
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const handleDeletePost = async () => {
|
const handleDeletePost = async () => {
|
||||||
|
|
||||||
dropdownOpen = !dropdownOpen;
|
dropdownOpen = !dropdownOpen;
|
||||||
|
|
||||||
@ -206,26 +192,26 @@ const handleDeletePost = async () => {
|
|||||||
style: 'border-radius: 200px; background: #333; color: #fff;'
|
style: 'border-radius: 200px; background: #333; color: #fff;'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let numberOfComments = 0;
|
let numberOfComments = 0;
|
||||||
let comments = [];
|
let comments = [];
|
||||||
//let replyComments = data?.allReplyComments?.items.reverse() || [];
|
//let replyComments = data?.allReplyComments?.items.reverse() || [];
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let moderators;
|
let moderators;
|
||||||
let videoId = null;
|
let videoId = null;
|
||||||
|
|
||||||
let loadTextEditor = false;
|
let loadTextEditor = false;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
async function getAllComments()
|
async function getAllComments()
|
||||||
{
|
{
|
||||||
|
|
||||||
const postData = {'postId': data?.getPostId};
|
const postData = {'postId': data?.getPostId};
|
||||||
|
|
||||||
@ -242,10 +228,10 @@ async function getAllComments()
|
|||||||
|
|
||||||
return output;
|
return output;
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const getModerators = async () => {
|
const getModerators = async () => {
|
||||||
let output;
|
let output;
|
||||||
|
|
||||||
// Get cached data for the specific tickerID
|
// Get cached data for the specific tickerID
|
||||||
@ -272,48 +258,28 @@ const getModerators = async () => {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
function isModerator(userId) {
|
function isModerator(userId) {
|
||||||
return moderators?.some(moderator => userId === moderator?.user);
|
return moderators?.some(moderator => userId === moderator?.user);
|
||||||
}
|
}
|
||||||
|
|
||||||
function countAllComments(comments) {
|
function countAllComments(comments) {
|
||||||
// Helper function to recursively count comments
|
// Helper function to recursively count comments
|
||||||
function countComments(commentsList) {
|
function countComments(commentsList) {
|
||||||
let count = 0;
|
let count = 0;
|
||||||
for (let comment of commentsList) {
|
for (let comment of commentsList) {
|
||||||
count += 1; // Count this comment
|
count += 1; // Count this comment
|
||||||
if (comment.children && comment.children.length > 0) {
|
if (comment.children && comment.children.length > 0) {
|
||||||
count += countComments(comment.children); // Recursively count nested comments
|
count += countComments(comment.children); // Recursively count nested comments
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return count;
|
return count;
|
||||||
}
|
}
|
||||||
return countComments(comments);
|
return countComments(comments);
|
||||||
}
|
|
||||||
|
|
||||||
let LoginPopup;
|
|
||||||
|
|
||||||
onMount(async () => {
|
|
||||||
|
|
||||||
post = $cachedPosts?.at(0)?.posts?.find(item => item?.id === data?.getPostId) ?? {};
|
|
||||||
|
|
||||||
if (Object?.keys(post)?.length !== 0) {
|
|
||||||
[moderators, comments] = await Promise?.all([
|
|
||||||
getModerators(),
|
|
||||||
getAllComments(),
|
|
||||||
]);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
[post, moderators, comments] = await Promise?.all([
|
|
||||||
getOnePost(),
|
|
||||||
getModerators(),
|
|
||||||
getAllComments(),
|
|
||||||
]);
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
numberOfComments = countAllComments(comments) || 0;
|
let LoginPopup;
|
||||||
|
|
||||||
|
onMount(async () => {
|
||||||
|
|
||||||
upvoteCounter[post.id] = post?.upvote;
|
upvoteCounter[post.id] = post?.upvote;
|
||||||
downvoteCounter[post.id] = post?.downvote;
|
downvoteCounter[post.id] = post?.downvote;
|
||||||
@ -334,10 +300,14 @@ onMount(async () => {
|
|||||||
LoginPopup = (await import('$lib/components/LoginPopup.svelte')).default;
|
LoginPopup = (await import('$lib/components/LoginPopup.svelte')).default;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
[moderators, comments] = await Promise.all([
|
||||||
|
getModerators(),
|
||||||
|
getAllComments(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
numberOfComments = countAllComments(comments) || 0;
|
||||||
|
|
||||||
|
if (post?.postType === 'link') {
|
||||||
if (post?.postType === 'link') {
|
|
||||||
const url = new URL(post.link);
|
const url = new URL(post.link);
|
||||||
if (url.hostname === "www.youtube.com") {
|
if (url.hostname === "www.youtube.com") {
|
||||||
const videoIdMatch = url.search.match(/v=([^&]+)/);
|
const videoIdMatch = url.search.match(/v=([^&]+)/);
|
||||||
@ -346,7 +316,7 @@ if (post?.postType === 'link') {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
loadTextEditor = true;
|
loadTextEditor = true;
|
||||||
isLoaded = true;
|
isLoaded = true;
|
||||||
@ -361,16 +331,16 @@ if (post?.postType === 'link') {
|
|||||||
window.removeEventListener('scroll', handleScroll);
|
window.removeEventListener('scroll', handleScroll);
|
||||||
};
|
};
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
let previousPage : string = base || '/community/';
|
let previousPage : string = base || '/community/';
|
||||||
afterNavigate(({from}) => {
|
afterNavigate(({from}) => {
|
||||||
previousPage = from?.url.pathname || '/community/'
|
previousPage = from?.url.pathname || '/community/'
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
function closePost(event) {
|
function closePost(event) {
|
||||||
|
|
||||||
if (event.target.classList.contains('cursor-zoom-out')) {
|
if (event.target.classList.contains('cursor-zoom-out')) {
|
||||||
|
|
||||||
@ -378,16 +348,18 @@ function closePost(event) {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onDestroy( () => {
|
|
||||||
|
|
||||||
|
onDestroy( () => {
|
||||||
$commentAdded = '';
|
$commentAdded = '';
|
||||||
$commentIdDeleted = '';
|
$commentIdDeleted = '';
|
||||||
$scrollToComment = '';
|
$scrollToComment = '';
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
function addCommentToParent(comments, newComment) {
|
function addCommentToParent(comments, newComment) {
|
||||||
// Helper function to handle the recursion
|
// Helper function to handle the recursion
|
||||||
function findAndAddParent(commentsList, newComment) {
|
function findAndAddParent(commentsList, newComment) {
|
||||||
for (let comment of commentsList) {
|
for (let comment of commentsList) {
|
||||||
@ -421,9 +393,9 @@ function addCommentToParent(comments, newComment) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return comments;
|
return comments;
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateCommentInList(newObject, list) {
|
function updateCommentInList(newObject, list) {
|
||||||
// Helper function to handle the recursion
|
// Helper function to handle the recursion
|
||||||
function findAndReplaceComment(commentsList, newComment) {
|
function findAndReplaceComment(commentsList, newComment) {
|
||||||
for (let comment of commentsList) {
|
for (let comment of commentsList) {
|
||||||
@ -446,12 +418,12 @@ function updateCommentInList(newObject, list) {
|
|||||||
|
|
||||||
// Return the updated list
|
// Return the updated list
|
||||||
return list;
|
return list;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Function to recursively find and remove a comment by id
|
// Function to recursively find and remove a comment by id
|
||||||
function removeCommentById(comments, idToRemove) {
|
function removeCommentById(comments, idToRemove) {
|
||||||
for (let i = 0; i < comments?.length; i++) {
|
for (let i = 0; i < comments?.length; i++) {
|
||||||
let comment = comments[i];
|
let comment = comments[i];
|
||||||
// If the current comment has the id to remove
|
// If the current comment has the id to remove
|
||||||
@ -466,40 +438,40 @@ function removeCommentById(comments, idToRemove) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
return comments; // Return the original comments list if the comment is not found
|
return comments; // Return the original comments list if the comment is not found
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$: {
|
$: {
|
||||||
if($commentAdded?.length !== 0)
|
if($commentAdded?.length !== 0)
|
||||||
{
|
{
|
||||||
comments = sortCommentsByDate(addCommentToParent(comments, $commentAdded))
|
comments = sortCommentsByDate(addCommentToParent(comments, $commentAdded))
|
||||||
numberOfComments = countAllComments(comments)
|
numberOfComments = countAllComments(comments)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$: {
|
$: {
|
||||||
if($commentUpdated?.length !== 0)
|
if($commentUpdated?.length !== 0)
|
||||||
{
|
{
|
||||||
comments = updateCommentInList($commentUpdated, comments);
|
comments = updateCommentInList($commentUpdated, comments);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$: {
|
$: {
|
||||||
if($commentIdDeleted?.length !== 0)
|
if($commentIdDeleted?.length !== 0)
|
||||||
{
|
{
|
||||||
comments = removeCommentById(comments, $commentIdDeleted)
|
comments = removeCommentById(comments, $commentIdDeleted)
|
||||||
numberOfComments = countAllComments(comments)
|
numberOfComments = countAllComments(comments)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<svelte:head>
|
<svelte:head>
|
||||||
<title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} {post.title} · stocknear</title>
|
<title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} {post.title} · stocknear</title>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width" />
|
<meta name="viewport" content="width=device-width" />
|
||||||
@ -518,16 +490,15 @@ $: {
|
|||||||
<meta name="twitter:description" content="Your daily dose of stock market funny memes, GIFs, videos and weird news stories. We deliver hundreds of new stock market memes daily.">
|
<meta name="twitter:description" content="Your daily dose of stock market funny memes, GIFs, videos and weird news stories. We deliver hundreds of new stock market memes daily.">
|
||||||
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||||
<!-- Add more Twitter meta tags as needed -->
|
<!-- Add more Twitter meta tags as needed -->
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--<section on:click={closePost} class="bg-[#0F0F0F] cursor-zoom-out min-h-screen">-->
|
<!--<section on:click={closePost} class="bg-[#0F0F0F] cursor-zoom-out min-h-screen">-->
|
||||||
|
|
||||||
<!--in:pageTransitionIn={{ duration: 250, screenWidth: $screenWidth }}-->
|
<!--in:pageTransitionIn={{ duration: 250, screenWidth: $screenWidth }}-->
|
||||||
{#if isLoaded}
|
<div class="overflow-hidden flex flex-row item-start w-full lg:mt-5 relative max-w-6xl m-auto lg:px-5 sm:pb-40">
|
||||||
<div class="overflow-hidden flex flex-row item-start w-full lg:mt-5 relative max-w-6xl m-auto lg:px-5 sm:pb-40">
|
|
||||||
<!--Start Voting-->
|
<!--Start Voting-->
|
||||||
<div style="top: 4rem;" class="hidden lg:flex flex-col items-center relative h-fit sticky z-20 lg:mr-3 ">
|
<div style="top: 4rem;" class="hidden lg:flex flex-col items-center relative h-fit sticky z-20 lg:mr-3 ">
|
||||||
<!--Start Upvote-->
|
<!--Start Upvote-->
|
||||||
@ -579,10 +550,10 @@ $: {
|
|||||||
<!--End Voting-->
|
<!--End Voting-->
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full bg-[#202020] max-w-5xl m-auto border sm:hover:border-slate-800 border-slate-800 rounded-none sm:rounded-xl ">
|
<div class="w-full bg-[#202020] max-w-5xl m-auto border sm:hover:border-slate-800 border-slate-800 rounded-none sm:rounded-xl ">
|
||||||
|
|
||||||
<!-- Start Header -->
|
<!-- Start Header -->
|
||||||
<div style="top: 0.8rem;" class="sm:rounded-xl absolute h-12 sticky z-20 bg-[#202020] w-full {isScrolled && $screenWidth < 640 ? 'border-b border-gray-700 ease-in' : 'ease-out'}">
|
<div style="top: 0.8rem;" class="sm:rounded-xl absolute h-12 sticky z-20 bg-[#202020] w-full {isScrolled && $screenWidth < 640 ? 'border-b border-gray-700 ease-in' : 'ease-out'}">
|
||||||
<div class="flex flex-row items-center justify-between w-full pt-3">
|
<div class="flex flex-row items-center justify-between w-full pt-3">
|
||||||
<a href={previousPage} class="absolute left-2 sm:left-4 sm:top-4">
|
<a href={previousPage} class="absolute left-2 sm:left-4 sm:top-4">
|
||||||
<svg class="w-5 h-5 inline-block sm:mr-1 sm:-mt-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
<svg class="w-5 h-5 inline-block sm:mr-1 sm:-mt-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
||||||
@ -598,9 +569,9 @@ $: {
|
|||||||
Post
|
Post
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Page wrapper -->
|
<!-- Page wrapper -->
|
||||||
<div class="flex flex-col overflow-hidden pb-40">
|
<div class="flex flex-col overflow-hidden pb-40">
|
||||||
|
|
||||||
|
|
||||||
@ -924,33 +895,29 @@ $: {
|
|||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{:else}
|
|
||||||
<div class="flex justify-center items-center m-auto h-full w-full max-w-6xl">
|
|
||||||
<div class="loader">Loading...</div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
<!--Start Login Modal-->
|
|
||||||
{#if LoginPopup}
|
<!--Start Login Modal-->
|
||||||
|
{#if LoginPopup}
|
||||||
<LoginPopup form={form}/>
|
<LoginPopup form={form}/>
|
||||||
{/if}
|
{/if}
|
||||||
<!--End Login Modal-->
|
<!--End Login Modal-->
|
||||||
|
|
||||||
|
|
||||||
{#if data?.user}
|
{#if data?.user}
|
||||||
|
|
||||||
<!--Start Delete Strategy Modal-->
|
<!--Start Delete Strategy Modal-->
|
||||||
|
|
||||||
<input type="checkbox" id="deletePostModal" class="modal-toggle" />
|
<input type="checkbox" id="deletePostModal" class="modal-toggle" />
|
||||||
|
|
||||||
<dialog id="deletePostModal" class="modal modal-bottom sm:modal-middle">
|
<dialog id="deletePostModal" class="modal modal-bottom sm:modal-middle">
|
||||||
|
|
||||||
|
|
||||||
<label for="deletePostModal" class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.5]"></label>
|
<label for="deletePostModal" class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.5]"></label>
|
||||||
|
|
||||||
|
|
||||||
<div class="modal-box w-full bg-[#202020] sm:border sm:border-slate-600 overflow-hidden">
|
<div class="modal-box w-full bg-[#202020] sm:border sm:border-slate-600 overflow-hidden">
|
||||||
|
|
||||||
<h3 class="font-bold text-xl mb-5 pt-5 text-white m-auto w-3/4 text-center">
|
<h3 class="font-bold text-xl mb-5 pt-5 text-white m-auto w-3/4 text-center">
|
||||||
Are you sure you want to delete the post?
|
Are you sure you want to delete the post?
|
||||||
@ -964,21 +931,21 @@ $: {
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</dialog>
|
</dialog>
|
||||||
|
|
||||||
<!--End Delete Strategy Modal-->
|
<!--End Delete Strategy Modal-->
|
||||||
|
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
|
|
||||||
.info-card {
|
.info-card {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
@ -989,4 +956,4 @@ $: {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
61
src/routes/community/post/[postId]/+page.ts
Normal file
61
src/routes/community/post/[postId]/+page.ts
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
import { userRegion, cachedPosts } from '$lib/store';
|
||||||
|
|
||||||
|
import { get } from 'svelte/store';
|
||||||
|
|
||||||
|
export const load = async ({ params }) => {
|
||||||
|
|
||||||
|
const usRegion = ['cle1','iad1','pdx1','sfo1'];
|
||||||
|
let fastifyURL = import.meta.env.VITE_EU_FASTIFY_URL;
|
||||||
|
|
||||||
|
userRegion.subscribe(value => {
|
||||||
|
if (usRegion.includes(value)) {
|
||||||
|
fastifyURL = import.meta.env.VITE_USEAST_FASTIFY_URL;
|
||||||
|
} else {
|
||||||
|
fastifyURL = import.meta.env.VITE_EU_FASTIFY_URL;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
async function getOnePost() {
|
||||||
|
// Get the current value of cachedPosts
|
||||||
|
const cachedValue = get(cachedPosts);
|
||||||
|
|
||||||
|
// Try to find the post in the cached value
|
||||||
|
const output = cachedValue?.posts?.find(item => item?.id === params.postId) ?? {};
|
||||||
|
|
||||||
|
// If the post is found in the cache, return it
|
||||||
|
if (Object.keys(output).length !== 0) {
|
||||||
|
return output;
|
||||||
|
}
|
||||||
|
|
||||||
|
// If the post is not found in the cache, fetch it from the endpoint
|
||||||
|
const postData = { postId: params.postId };
|
||||||
|
|
||||||
|
const response = await fetch(fastifyURL + '/get-one-post', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify(postData),
|
||||||
|
});
|
||||||
|
|
||||||
|
const result = await response.json();
|
||||||
|
|
||||||
|
// Assuming the result contains an 'items' array
|
||||||
|
return result.items;
|
||||||
|
}
|
||||||
|
|
||||||
|
const getPostId = async () => {
|
||||||
|
|
||||||
|
return params.postId;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
return {
|
||||||
|
getPostId: await getPostId(),
|
||||||
|
getOnePost: await getOnePost(),
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
};
|
||||||
Loading…
x
Reference in New Issue
Block a user