highperfocused/lume
1
0
Fork 0
mirror of https://github.com/lumehq/lume.git synced 2025-03-18 05:41:53 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4 from reyamir/feat/load-newest

Browse Source 
Updated load newest button
This commit is contained in:
Ren Amamiya 2023-03-03 15:51:19 +07:00 committed by GitHub
commit 416243706c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/pages/feed/following.tsx
View File

@ -10,6 +10,7 @@ import { Single } from '@components/note/single';
import { dateToUnix } from '@utils/getDate';
import { ArrowUpIcon } from '@radix-ui/react-icons';
import { writeStorage } from '@rehooks/local-storage';
import { useCallback, useState } from 'react';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useContext, useEffect, useRef } from 'react';
@ -39,6 +40,18 @@ export default function Page() {
setData((data) => [...data, ...result]);
}, [db]);
const loadNewest = useCallback(async () => {
const result = await db.select(
`SELECT * FROM
cache_notes
WHERE created_at > ${dateToUnix(now.current)}
ORDER BY created_at DESC
LIMIT ${limit.current}`
);
setData((data) => [...result, ...data]);
setHasNewNote(false);
}, [db]);
const ItemContent = useCallback(
(index: string | number) => {
const event = data[index];
@ -78,8 +91,13 @@ export default function Page() {
<div className="relative h-full w-full">
<NoteConnector setParentReload={setParentReload} setHasNewNote={setHasNewNote} currentDate={now.current} />
{hasNewNote && (
<div className="fixed top-10 left-1/2 z-50 -translate-x-1/2 transform">
<button>Load newest</button>
<div className="absolute top-16 left-1/2 z-50 -translate-x-1/2 transform">
<button
onClick={() => loadNewest()}
className="inline-flex h-8 transform items-center justify-center gap-1 rounded-full bg-[radial-gradient(ellipse_at_bottom_right,_var(--tw-gradient-stops))] from-gray-300 via-fuchsia-600 to-orange-600 pl-3 pr-3.5 text-sm shadow-lg active:translate-y-1">
<ArrowUpIcon className="h-4 w-4" />
<span className="drop-shadow-md">Load newest</span>
</button>
</div>
)}
<Virtuoso