this repo has no description
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Recode some parts in search page

Still very messy, I know

+31 -22
+31 -22
src/pages/search.jsx
··· 54 54 const offsetRef = useRef(0); 55 55 useEffect(() => { 56 56 offsetRef.current = 0; 57 - }, [type]); 57 + }, [q, type]); 58 58 59 59 const scrollableRef = useRef(); 60 60 useLayoutEffect(() => { ··· 64 64 const [statusResults, setStatusResults] = useState([]); 65 65 const [accountResults, setAccountResults] = useState([]); 66 66 const [hashtagResults, setHashtagResults] = useState([]); 67 + useEffect(() => { 68 + setStatusResults([]); 69 + setAccountResults([]); 70 + setHashtagResults([]); 71 + }, [q]); 72 + const setTypeResultsFunc = { 73 + statuses: setStatusResults, 74 + accounts: setAccountResults, 75 + hashtags: setHashtagResults, 76 + }; 67 77 68 78 function loadResults(firstLoad) { 69 79 setUiState('loading'); ··· 87 97 try { 88 98 const results = await masto.v2.search(params); 89 99 console.log(results); 90 - if (type && !firstLoad) { 91 - if (type === 'statuses') { 92 - setStatusResults((prev) => [...prev, ...results.statuses]); 93 - } else if (type === 'accounts') { 94 - setAccountResults((prev) => [...prev, ...results.accounts]); 95 - } else if (type === 'hashtags') { 96 - setHashtagResults((prev) => [...prev, ...results.hashtags]); 100 + if (type) { 101 + if (firstLoad) { 102 + setTypeResultsFunc[type](results[type]); 103 + const length = results[type]?.length; 104 + offsetRef.current = LIMIT; 105 + setShowMore(!!length); 106 + } else { 107 + setTypeResultsFunc[type]((prev) => [...prev, ...results[type]]); 108 + const length = results[type]?.length; 109 + offsetRef.current = offsetRef.current + LIMIT; 110 + setShowMore(!!length); 97 111 } 98 - offsetRef.current = offsetRef.current + LIMIT; 99 - setShowMore(!!results[type]?.length); 100 112 } else { 101 113 setStatusResults(results.statuses); 102 114 setAccountResults(results.accounts); 103 115 setHashtagResults(results.hashtags); 104 - if (type) { 105 - offsetRef.current = LIMIT; 106 - setShowMore(!!results[type]?.length); 107 - } 116 + offsetRef.current = 0; 117 + setShowMore(false); 108 118 } 109 119 setUiState('default'); 110 120 } catch (err) { ··· 325 335 <p class="ui-state insignificant">The end.</p> 326 336 ) 327 337 ) : ( 328 - !!( 329 - hashtagResults.length || 330 - accountResults.length || 331 - statusResults.length 332 - ) && ( 338 + uiState === 'loading' && ( 333 339 <p class="ui-state"> 334 340 <Loader abrupt /> 335 341 </p> ··· 357 363 const { instance } = api(); 358 364 const [searchParams, setSearchParams] = useSearchParams(); 359 365 const [searchMenuOpen, setSearchMenuOpen] = useState(false); 360 - const [query, setQuery] = useState(searchParams.q || ''); 366 + const [query, setQuery] = useState(searchParams.get('q') || ''); 367 + const type = searchParams.get('type'); 361 368 const formRef = useRef(null); 362 369 363 370 const searchFieldRef = useRef(null); ··· 378 385 e.preventDefault(); 379 386 380 387 if (query) { 381 - setSearchParams({ 388 + const params = { 382 389 q: query, 383 - }); 390 + }; 391 + if (type) params.type = type; // Preserve type 392 + setSearchParams(params); 384 393 } else { 385 394 setSearchParams({}); 386 395 }