35 lines
829 B
TypeScript
35 lines
829 B
TypeScript
import { parseAsInteger, useQueryState } from 'nuqs';
|
|
import { useTransition } from 'react';
|
|
|
|
import { useDebounceValue } from './useDebounceValue';
|
|
|
|
export function useCursor() {
|
|
const [loading, startTransition] = useTransition();
|
|
const [cursor, setCursor] = useQueryState(
|
|
'cursor',
|
|
parseAsInteger
|
|
.withOptions({ shallow: false, history: 'push', startTransition })
|
|
.withDefault(0),
|
|
);
|
|
return {
|
|
cursor,
|
|
setCursor,
|
|
loading,
|
|
};
|
|
}
|
|
|
|
export type UseDebouncedCursor = ReturnType<typeof useDebouncedCursor>;
|
|
|
|
export function useDebouncedCursor() {
|
|
const [cursor, setCursor] = useQueryState(
|
|
'cursor',
|
|
parseAsInteger.withDefault(0),
|
|
);
|
|
const debouncedCursor = useDebounceValue(cursor, 200);
|
|
return {
|
|
value: cursor,
|
|
set: setCursor,
|
|
debounced: debouncedCursor,
|
|
};
|
|
}
|