mirror of
https://github.com/cheeaun/phanpy.git
synced 2025-02-17 07:41:35 +03:00
Simplify and robustify
This commit is contained in:
parent
81170c6d05
commit
6f4a5553ec
1 changed files with 17 additions and 19 deletions
|
@ -4,7 +4,6 @@ import Icon from '../components/Icon';
|
||||||
import Link from '../components/link';
|
import Link from '../components/link';
|
||||||
import Loader from '../components/Loader';
|
import Loader from '../components/Loader';
|
||||||
import Status from '../components/status';
|
import Status from '../components/status';
|
||||||
import { saveStatus } from '../utils/states';
|
|
||||||
import useTitle from '../utils/useTitle';
|
import useTitle from '../utils/useTitle';
|
||||||
|
|
||||||
const LIMIT = 40;
|
const LIMIT = 40;
|
||||||
|
@ -15,21 +14,14 @@ function Bookmarks() {
|
||||||
const [uiState, setUIState] = useState('default');
|
const [uiState, setUIState] = useState('default');
|
||||||
const [showMore, setShowMore] = useState(false);
|
const [showMore, setShowMore] = useState(false);
|
||||||
|
|
||||||
const bookmarksIterator = useRef(masto.v1.bookmarks.list({ limit: LIMIT }));
|
const bookmarksIterator = useRef();
|
||||||
async function fetchBookmarks(firstLoad) {
|
async function fetchBookmarks(firstLoad) {
|
||||||
console.log('fetchBookmarks', firstLoad);
|
if (firstLoad || !bookmarksIterator.current) {
|
||||||
if (firstLoad) {
|
|
||||||
bookmarksIterator.current = masto.v1.bookmarks.list({ limit: LIMIT });
|
bookmarksIterator.current = masto.v1.bookmarks.list({ limit: LIMIT });
|
||||||
}
|
}
|
||||||
const allBookmarks = await bookmarksIterator.current.next();
|
const allBookmarks = await bookmarksIterator.current.next();
|
||||||
if (allBookmarks.value?.length) {
|
const bookmarksValue = allBookmarks.value;
|
||||||
const bookmarksValue = allBookmarks.value.map((status) => {
|
if (bookmarksValue?.length) {
|
||||||
saveStatus(status, {
|
|
||||||
skipThreading: true,
|
|
||||||
override: false,
|
|
||||||
});
|
|
||||||
return status;
|
|
||||||
});
|
|
||||||
if (firstLoad) {
|
if (firstLoad) {
|
||||||
setBookmarks(bookmarksValue);
|
setBookmarks(bookmarksValue);
|
||||||
} else {
|
} else {
|
||||||
|
@ -43,9 +35,7 @@ function Bookmarks() {
|
||||||
setUIState('loading');
|
setUIState('loading');
|
||||||
(async () => {
|
(async () => {
|
||||||
try {
|
try {
|
||||||
console.log('loadBookmarks', firstLoad);
|
|
||||||
const { done } = await fetchBookmarks(firstLoad);
|
const { done } = await fetchBookmarks(firstLoad);
|
||||||
console.log('loadBookmarks', firstLoad);
|
|
||||||
setShowMore(!done);
|
setShowMore(!done);
|
||||||
setUIState('default');
|
setUIState('default');
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
@ -78,6 +68,9 @@ function Bookmarks() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
onDblClick={(e) => {
|
||||||
|
loadBookmarks(true);
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<div class="header-side">
|
<div class="header-side">
|
||||||
<Link to="/" class="button plain">
|
<Link to="/" class="button plain">
|
||||||
|
@ -85,7 +78,9 @@ function Bookmarks() {
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
<h1>Bookmarks</h1>
|
<h1>Bookmarks</h1>
|
||||||
<div class="header-side"></div>{' '}
|
<div class="header-side">
|
||||||
|
<Loader hidden={uiState !== 'loading'} />
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
{!!bookmarks.length ? (
|
{!!bookmarks.length ? (
|
||||||
<>
|
<>
|
||||||
|
@ -98,7 +93,6 @@ function Bookmarks() {
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
{showMore && (
|
{showMore && (
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -117,9 +111,13 @@ function Bookmarks() {
|
||||||
)
|
)
|
||||||
)}
|
)}
|
||||||
{uiState === 'loading' ? (
|
{uiState === 'loading' ? (
|
||||||
<div class="ui-state">
|
<ul class="timeline">
|
||||||
<Loader />
|
{Array.from({ length: 5 }).map((_, i) => (
|
||||||
</div>
|
<li key={i}>
|
||||||
|
<Status skeleton />
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
) : uiState === 'error' ? (
|
) : uiState === 'error' ? (
|
||||||
<p class="ui-state">
|
<p class="ui-state">
|
||||||
Unable to load bookmarks.
|
Unable to load bookmarks.
|
||||||
|
|
Loading…
Add table
Reference in a new issue