Fix infinite loading due to search API not supporting offset

This commit is contained in:
Lim Chee Aun 2024-11-18 15:10:49 +08:00
parent fac1209153
commit 121d11e20f
2 changed files with 35 additions and 24 deletions

40
src/locales/en.po generated
View file

@ -97,8 +97,8 @@ msgstr "Following"
#: src/components/account-info.jsx:421 #: src/components/account-info.jsx:421
#: src/components/account-info.jsx:778 #: src/components/account-info.jsx:778
#: src/pages/account-statuses.jsx:484 #: src/pages/account-statuses.jsx:484
#: src/pages/search.jsx:312 #: src/pages/search.jsx:323
#: src/pages/search.jsx:459 #: src/pages/search.jsx:470
msgid "Posts" msgid "Posts"
msgstr "" msgstr ""
@ -956,8 +956,8 @@ msgstr ""
#: src/components/generic-accounts.jsx:145 #: src/components/generic-accounts.jsx:145
#: src/components/notification.jsx:438 #: src/components/notification.jsx:438
#: src/pages/accounts.jsx:41 #: src/pages/accounts.jsx:41
#: src/pages/search.jsx:302 #: src/pages/search.jsx:313
#: src/pages/search.jsx:335 #: src/pages/search.jsx:346
msgid "Accounts" msgid "Accounts"
msgstr "" msgstr ""
@ -965,14 +965,14 @@ msgstr ""
#: src/components/timeline.jsx:519 #: src/components/timeline.jsx:519
#: src/pages/list.jsx:293 #: src/pages/list.jsx:293
#: src/pages/notifications.jsx:848 #: src/pages/notifications.jsx:848
#: src/pages/search.jsx:529 #: src/pages/search.jsx:540
#: src/pages/status.jsx:1332 #: src/pages/status.jsx:1332
msgid "Show more…" msgid "Show more…"
msgstr "" msgstr ""
#: src/components/generic-accounts.jsx:210 #: src/components/generic-accounts.jsx:210
#: src/components/timeline.jsx:524 #: src/components/timeline.jsx:524
#: src/pages/search.jsx:534 #: src/pages/search.jsx:545
msgid "The end." msgid "The end."
msgstr "" msgstr ""
@ -1079,7 +1079,7 @@ msgstr ""
#: src/components/shortcuts-settings.jsx:52 #: src/components/shortcuts-settings.jsx:52
#: src/components/shortcuts-settings.jsx:179 #: src/components/shortcuts-settings.jsx:179
#: src/pages/search.jsx:45 #: src/pages/search.jsx:45
#: src/pages/search.jsx:284 #: src/pages/search.jsx:295
msgid "Search" msgid "Search"
msgstr "" msgstr ""
@ -2697,7 +2697,7 @@ msgstr ""
#: src/pages/catchup.jsx:1316 #: src/pages/catchup.jsx:1316
#: src/pages/mentions.jsx:147 #: src/pages/mentions.jsx:147
#: src/pages/search.jsx:297 #: src/pages/search.jsx:308
msgid "All" msgid "All"
msgstr "" msgstr ""
@ -3301,42 +3301,42 @@ msgstr ""
msgid "Search: {q}" msgid "Search: {q}"
msgstr "" msgstr ""
#: src/pages/search.jsx:307 #: src/pages/search.jsx:318
#: src/pages/search.jsx:389 #: src/pages/search.jsx:400
msgid "Hashtags" msgid "Hashtags"
msgstr "" msgstr ""
#: src/pages/search.jsx:339 #: src/pages/search.jsx:350
#: src/pages/search.jsx:393 #: src/pages/search.jsx:404
#: src/pages/search.jsx:463 #: src/pages/search.jsx:474
msgid "See more" msgid "See more"
msgstr "" msgstr ""
#: src/pages/search.jsx:365 #: src/pages/search.jsx:376
msgid "See more accounts" msgid "See more accounts"
msgstr "" msgstr ""
#: src/pages/search.jsx:379 #: src/pages/search.jsx:390
msgid "No accounts found." msgid "No accounts found."
msgstr "" msgstr ""
#: src/pages/search.jsx:435 #: src/pages/search.jsx:446
msgid "See more hashtags" msgid "See more hashtags"
msgstr "" msgstr ""
#: src/pages/search.jsx:449 #: src/pages/search.jsx:460
msgid "No hashtags found." msgid "No hashtags found."
msgstr "" msgstr ""
#: src/pages/search.jsx:493 #: src/pages/search.jsx:504
msgid "See more posts" msgid "See more posts"
msgstr "" msgstr ""
#: src/pages/search.jsx:507 #: src/pages/search.jsx:518
msgid "No posts found." msgid "No posts found."
msgstr "" msgstr ""
#: src/pages/search.jsx:551 #: src/pages/search.jsx:562
msgid "Enter your search term or paste a URL above to get started." msgid "Enter your search term or paste a URL above to get started."
msgstr "" msgstr ""

View file

@ -79,6 +79,11 @@ function Search({ columnMode, ...props }) {
setAccountResults([]); setAccountResults([]);
setHashtagResults([]); setHashtagResults([]);
}, [q]); }, [q]);
const typeResults = {
statuses: statusResults,
accounts: accountResults,
hashtags: hashtagResults,
};
const setTypeResultsFunc = { const setTypeResultsFunc = {
statuses: setStatusResults, statuses: setStatusResults,
accounts: setAccountResults, accounts: setAccountResults,
@ -136,10 +141,16 @@ function Search({ columnMode, ...props }) {
offsetRef.current = LIMIT; offsetRef.current = LIMIT;
setShowMore(!!length); setShowMore(!!length);
} else { } else {
setTypeResultsFunc[type]((prev) => [...prev, ...results[type]]); // If first item is the same, it means API doesn't support offset
const length = results[type]?.length; // I know this is a very basic check, but it works for now
offsetRef.current = offsetRef.current + LIMIT; if (results[type]?.[0]?.id === typeResults[type]?.[0]?.id) {
setShowMore(!!length); setShowMore(false);
} else {
setTypeResultsFunc[type]((prev) => [...prev, ...results[type]]);
const length = results[type]?.length;
offsetRef.current = offsetRef.current + LIMIT;
setShowMore(!!length);
}
} }
} else { } else {
setStatusResults(results.statuses || []); setStatusResults(results.statuses || []);