Feed fixes, also fixed stackernews graphql query to fetch most recent 21 items

This commit is contained in:
austinkelsay 2024-09-25 17:19:02 -05:00
parent 24afd44409
commit 8d2ed9a967
6 changed files with 25 additions and 16 deletions

View File

@ -13,9 +13,11 @@ const DiscordFeed = ({ searchQuery }) => {
// Memoize the filtered data // Memoize the filtered data
const filteredData = useMemo(() => { const filteredData = useMemo(() => {
if (!data) return []; if (!data) return [];
return data.filter(message => return data
message.content.toLowerCase().includes(searchQuery.toLowerCase()) .filter(message =>
); message.content.toLowerCase().includes(searchQuery.toLowerCase())
)
.sort((a, b) => new Date(b.timestamp) - new Date(a.timestamp));
}, [data, searchQuery]); }, [data, searchQuery]);
if (isLoading) { if (isLoading) {

View File

@ -120,13 +120,13 @@ const GlobalFeed = ({searchQuery}) => {
item.type === 'stackernews' ? item.user.name : item.type === 'stackernews' ? item.user.name :
authorData[item.pubkey]?.username || item.pubkey.substring(0, 12) + '...', authorData[item.pubkey]?.username || item.pubkey.substring(0, 12) + '...',
avatar: item.type === 'discord' ? item.avatar : avatar: item.type === 'discord' ? item.avatar :
item.type === 'stackernews' ? item.user.image : item.type === 'stackernews' ? "https://pbs.twimg.com/profile_images/1403162883941359619/oca7LMQ2_400x400.png" :
authorData[item.pubkey]?.avatar, authorData[item.pubkey]?.avatar,
content: item.type === 'stackernews' ? item.title : item.content, content: item.type === 'stackernews' ? item.title : item.content,
timestamp: item.type === 'nostr' ? item.created_at * 1000 : new Date(item.timestamp || item.createdAt), timestamp: item.type === 'nostr' ? item.created_at * 1000 : new Date(item.timestamp || item.createdAt),
channel: item.type === 'discord' ? item.channel : channel: item.type === 'discord' ? item.channel :
item.type === 'stackernews' ? "~devs" : item.type === 'stackernews' ? "~devs" :
"plebdevs" "#plebdevs"
}} }}
searchQuery={searchQuery} searchQuery={searchQuery}
windowWidth={windowWidth} windowWidth={windowWidth}

View File

@ -79,9 +79,11 @@ const NostrFeed = ({ searchQuery }) => {
return <div className="text-red-500 text-center p-4">Failed to load messages. Please try again later.</div>; return <div className="text-red-500 text-center p-4">Failed to load messages. Please try again later.</div>;
} }
const filteredNotes = communityNotes.filter(message => const filteredNotes = communityNotes
message.content.toLowerCase().includes(searchQuery.toLowerCase()) .filter(message =>
); message.content.toLowerCase().includes(searchQuery.toLowerCase())
)
.sort((a, b) => b.created_at - a.created_at);
return ( return (
<div className="bg-gray-900 h-full w-full min-bottom-bar:w-[86vw]"> <div className="bg-gray-900 h-full w-full min-bottom-bar:w-[86vw]">

View File

@ -1,4 +1,4 @@
import React from 'react'; import React, { useEffect } from 'react';
import { ProgressSpinner } from 'primereact/progressspinner'; import { ProgressSpinner } from 'primereact/progressspinner';
import { useQuery } from '@tanstack/react-query'; import { useQuery } from '@tanstack/react-query';
import axios from 'axios'; import axios from 'axios';
@ -21,6 +21,10 @@ const StackerNewsFeed = ({ searchQuery }) => {
const { data: items, isLoading, error } = useQuery({queryKey: ['stackerNews'], queryFn: fetchStackerNews}); const { data: items, isLoading, error } = useQuery({queryKey: ['stackerNews'], queryFn: fetchStackerNews});
const windowWidth = useWindowWidth(); const windowWidth = useWindowWidth();
useEffect(() => {
console.log("ot", items);
}, [items]);
if (isLoading) { if (isLoading) {
return ( return (
<div className="h-[100vh] min-bottom-bar:w-[86vw] max-sidebar:w-[100vw]"> <div className="h-[100vh] min-bottom-bar:w-[86vw] max-sidebar:w-[100vw]">
@ -34,9 +38,11 @@ const StackerNewsFeed = ({ searchQuery }) => {
return <div className="text-red-500 text-center p-4">Error loading data. Please try again later.</div>; return <div className="text-red-500 text-center p-4">Error loading data. Please try again later.</div>;
} }
const filteredItems = items.filter(item => const filteredItems = items
item.title.toLowerCase().includes(searchQuery.toLowerCase()) .filter(item =>
); item.title.toLowerCase().includes(searchQuery.toLowerCase())
)
.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt));
return ( return (
<div className="bg-gray-900 h-full w-full min-bottom-bar:w-[86vw]"> <div className="bg-gray-900 h-full w-full min-bottom-bar:w-[86vw]">
@ -48,7 +54,7 @@ const StackerNewsFeed = ({ searchQuery }) => {
message={{ message={{
id: item.id, id: item.id,
author: item.user.name, author: item.user.name,
avatar: item.user.image, avatar: "https://pbs.twimg.com/profile_images/1403162883941359619/oca7LMQ2_400x400.png",
content: item.title, content: item.title,
timestamp: item.createdAt, timestamp: item.createdAt,
channel: "~devs", channel: "~devs",

View File

@ -51,7 +51,7 @@ const CommunityMessage = ({ message, searchQuery, windowWidth, platform }) => {
const header = ( const header = (
<div className="flex flex-row w-full items-center justify-between p-4 bg-gray-800 rounded-t-lg"> <div className="flex flex-row w-full items-center justify-between p-4 bg-gray-800 rounded-t-lg">
<div className="flex flex-row items-center"> <div className="flex flex-row items-center">
<Avatar image={message.avatar} shape="circle" size="large" className="border-2 border-blue-400" /> <Avatar image={message.avatar ? message.avatar : null} icon={message.avatar ? null : "pi pi-user"} shape="circle" size="large" className="border-2 border-blue-400" />
<p className="pl-4 font-bold text-xl text-white">{message?.pubkey ? (message?.pubkey.slice(0, 12) + "...") : message.author}</p> <p className="pl-4 font-bold text-xl text-white">{message?.pubkey ? (message?.pubkey.slice(0, 12) + "...") : message.author}</p>
</div> </div>
<div className="flex flex-col items-start justify-between"> <div className="flex flex-col items-start justify-between">

View File

@ -7,8 +7,7 @@ export default async function handler(req, res) {
query RecentDevItemsWithComments { query RecentDevItemsWithComments {
items( items(
sub: "devs", sub: "devs",
sort: "NEW", sort: "recent"
limit: 10
) { ) {
items { items {
id id