mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-11-12 02:00:28 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve Members Right Panel (#1286)

Browse source 
* fix room members hook

* fix resize observer hook

* add intersection observer hook

* install react-virtual lib

* improve right panel - WIP

* add filters for members

* fix bug in async search

* categories members and add search

* show spinner on room member fetch

* make invite member btn clickable

* so no member text

* add line between room view and member drawer

* fix imports

* add screen size hook

* fix set setting hook

* make member drawer responsive

* extract power level tags hook

* fix room members hook

* fix use async search api

* produce search result on filter change
This commit is contained in:
Ajay Bura 2023-06-22 09:14:50 +10:00 • committed by GitHub
parent da32d0d9e7
commit c07905c360
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 984 additions and 79 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/app/hooks/useAsyncSearch.ts
View file

@ -25,11 +25,13 @@ export type UseAsyncSearchResult<TSearchItem extends object | string | number> =
items: TSearchItem[];
};
export type SearchResetHandler = () => void;
export const useAsyncSearch = <TSearchItem extends object | string | number>(
list: TSearchItem[],
getItemStr: SearchItemStrGetter<TSearchItem>,
options?: UseAsyncSearchOptions
): [UseAsyncSearchResult<TSearchItem> | undefined, AsyncSearchHandler] => {
): [UseAsyncSearchResult<TSearchItem> | undefined, AsyncSearchHandler, SearchResetHandler] => {
const [result, setResult] = useState<UseAsyncSearchResult<TSearchItem>>();
const [searchCallback, terminateSearch] = useMemo(() => {
@ -51,7 +53,7 @@ export const useAsyncSearch = <TSearchItem extends object | string | number>(
const handleResult: ResultHandler<TSearchItem> = (results, query) =>
setResult({
query,
items: results,
items: [...results],
});
return AsyncSearch(list, handleMatch, handleResult, options);
@ -60,15 +62,16 @@ export const useAsyncSearch = <TSearchItem extends object | string | number>(
const searchHandler: AsyncSearchHandler = useCallback(
(query) => {
const normalizedQuery = normalize(query, options?.normalizeOptions);
if (!normalizedQuery) {
setResult(undefined);
return;
}
searchCallback(normalizedQuery);
},
[searchCallback, options?.normalizeOptions]
);
const resetHandler: SearchResetHandler = useCallback(() => {
terminateSearch();
setResult(undefined);
}, [terminateSearch]);
useEffect(
() => () => {
// terminate any ongoing search request on unmount.
@ -77,5 +80,5 @@ export const useAsyncSearch = <TSearchItem extends object | string | number>(
[terminateSearch]
);
return [result, searchHandler];
return [result, searchHandler, resetHandler];
};