chore: Move to Typescript (#2783)
This PR moves the entire project to Typescript. Due to the ~1000 ignores this will lead to a messy codebase for a while, but the churn is worth it – all of those ignore comments are places that were never type-safe previously. closes #1282
This commit is contained in:
44
app/components/CommandBarResults.tsx
Normal file
44
app/components/CommandBarResults.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
import { useMatches, KBarResults, Action } from "kbar";
|
||||
import * as React from "react";
|
||||
import styled from "styled-components";
|
||||
import CommandBarItem from "~/components/CommandBarItem";
|
||||
import { CommandBarAction } from "~/types";
|
||||
|
||||
export default function CommandBarResults() {
|
||||
const matches = useMatches();
|
||||
const items = React.useMemo(
|
||||
() =>
|
||||
matches
|
||||
.reduce((acc, curr) => {
|
||||
const { actions, name } = curr;
|
||||
acc.push(name);
|
||||
acc.push(...actions);
|
||||
return acc;
|
||||
}, [] as (Action | string)[])
|
||||
.filter((i) => i !== "none"),
|
||||
[matches]
|
||||
);
|
||||
|
||||
return (
|
||||
<KBarResults
|
||||
items={items}
|
||||
maxHeight={400}
|
||||
onRender={({ item, active }) =>
|
||||
typeof item === "string" ? (
|
||||
<Header>{item}</Header>
|
||||
) : (
|
||||
<CommandBarItem action={item as CommandBarAction} active={active} />
|
||||
)
|
||||
}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const Header = styled.h3`
|
||||
font-size: 13px;
|
||||
letter-spacing: 0.04em;
|
||||
margin: 0;
|
||||
padding: 16px 0 4px 20px;
|
||||
color: ${(props) => props.theme.textTertiary};
|
||||
height: 36px;
|
||||
`;
|
||||
Reference in New Issue
Block a user