interface: omnibox go fast

This commit is contained in:
Liam Fitzgerald 2021-07-02 15:42:17 +10:00
parent 9a3d04a8ee
commit 6b7030d617
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB

View File

@ -1,6 +1,8 @@
import { Box, Row, Text } from '@tlon/indigo-react';
import { omit } from 'lodash';
import Mousetrap from 'mousetrap';
import _ from 'lodash';
import f from 'lodash/fp';
import React, {
ReactElement, useCallback,
useEffect, useMemo,
@ -41,6 +43,7 @@ const SEARCHED_CATEGORIES = [
'apps'
];
const settingsSel = (s: SettingsState) => s.leap;
const CAT_LIMIT = 6;
export function Omnibox(props: OmniboxProps): ReactElement {
const location = useLocation();
@ -175,7 +178,7 @@ export function Omnibox(props: OmniboxProps): ReactElement {
);
const setPreviousSelected = useCallback(() => {
const flattenedResults = Array.from(results.values()).flat();
const flattenedResults = Array.from(results.values()).map(f.take(CAT_LIMIT)).flat();
const totalLength = flattenedResults.length;
if (selected.length) {
const currentIndex = flattenedResults.indexOf(
@ -198,7 +201,7 @@ export function Omnibox(props: OmniboxProps): ReactElement {
}, [results, selected]);
const setNextSelected = useCallback(() => {
const flattenedResults = Array.from(results.values()).flat();
const flattenedResults = Array.from(results.values()).map(f.take(CAT_LIMIT)).flat();
if (selected.length) {
const currentIndex = flattenedResults.indexOf(
// @ts-ignore unclear how to give this spread a return signature
@ -309,13 +312,15 @@ export function Omnibox(props: OmniboxProps): ReactElement {
return (
<Box
maxHeight={['200px', '400px']}
overflowY='auto'
overflowX='hidden'
overflow='hidden'
borderBottomLeftRadius={2}
borderBottomRightRadius={2}
>
{SEARCHED_CATEGORIES.map(category =>
Object({ category, categoryResults: results.get(category) })
Object({
category,
categoryResults: _.take(results.get(category).sort(sortResults), CAT_LIMIT)
})
)
.filter(category => category.categoryResults.length > 0)
.map(({ category, categoryResults }, i) => {
@ -331,7 +336,7 @@ export function Omnibox(props: OmniboxProps): ReactElement {
return (
<Box key={i} width='max(50vw, 300px)' maxWidth='700px'>
{categoryTitle}
{categoryResults.sort(sortResults).map((result, i2) => (
{categoryResults.map((result, i2) => (
<OmniboxResult
key={i2}
// @ts-ignore withHovering doesn't pass props