scout: cleanup a few things

Author: zoontek

packages/lake/src/components/FilterChooser.tsx

@@ -3,7 +3,6 @@ import { Pressable, StyleSheet, View } from "react-native";
 import { colors } from "../constants/design";
 import { useDisclosure } from "../hooks/useDisclosure";
 import { isNotNullishOrEmpty } from "../utils/nullish";
-import { Box } from "./Box";
 import { FlatList } from "./FlatList";
 import { Icon } from "./Icon";
 import { LakeButton } from "./LakeButton";
@@ -37,7 +36,7 @@ const styles = StyleSheet.create({
   },
 });
 
-export function FilterChooser<FilterName extends string>({
+export const FilterChooser = <FilterName extends string>({
   filters,
   openFilters,
   label,
@@ -53,26 +52,24 @@ export function FilterChooser<FilterName extends string>({
   availableFilters: { label: string; name: FilterName }[];
   large?: boolean;
   onAddFilter: (filterName: FilterName) => void;
-}) {
+}) => {
   const inputRef = useRef<View>(null);
   const [visible, { close, toggle }] = useDisclosure(false);
 
   return (
     <>
-      <Box direction="row" justifyContent="start" alignItems="center">
-        <LakeButton
-          size="small"
-          mode="secondary"
-          color="gray"
-          onPress={toggle}
-          ref={inputRef}
-          icon={large ? "chevron-down-filled" : "filter-filled"}
-          iconPosition="end"
-          ariaLabel={label}
-        >
-          {large ? label : null}
-        </LakeButton>
-      </Box>
+      <LakeButton
+        size="small"
+        mode="secondary"
+        color="gray"
+        onPress={toggle}
+        ref={inputRef}
+        icon={large ? "chevron-down-filled" : "filter-filled"}
+        iconPosition="end"
+        ariaLabel={label}
+      >
+        {large ? label : null}
+      </LakeButton>
 
       <Popover
         role="listbox"
@@ -119,4 +116,4 @@ export function FilterChooser<FilterName extends string>({
       </Popover>
     </>
   );
-}
+};

packages/lake/src/components/WithCurrentColor.tsx

@@ -1,12 +1,12 @@
-import { createContext, MutableRefObject, ReactElement, useLayoutEffect, useRef } from "react";
+import { createContext, MutableRefObject, ReactNode, useLayoutEffect, useRef } from "react";
 import { StyleSheet, View, ViewProps } from "react-native";
 import { colors, ColorVariants } from "../constants/design";
 import { isNotNullish } from "../utils/nullish";
 
 type Props = {
   variant?: ColorVariants;
   style?: ViewProps["style"];
-  children: ReactElement;
+  children: ReactNode;
 };
 
 const styles = StyleSheet.create({

packages/shared-business/src/components/Filters.tsx

@@ -133,15 +133,15 @@ type FilterRadioProps<T> = {
   onValueChange: (value: T | undefined) => void;
 };
 
-function FilterRadio<T>({
+const FilterRadio = <T,>({
   label,
   items,
   width,
   value,
   onValueChange,
   onPressRemove,
   autoOpen = false,
-}: FilterRadioProps<T>) {
+}: FilterRadioProps<T>) => {
   const inputRef = useRef<View>(null);
   const [visible, { close, toggle }] = useDisclosure(autoOpen);
   const currentValue = useMemo(() => items.find(i => i.value === value), [items, value]);
@@ -194,7 +194,7 @@ function FilterRadio<T>({
       </Popover>
     </View>
   );
-}
+};
 
 type FilterCheckboxProps<T> = {
   label: string;
@@ -212,7 +212,7 @@ type CheckAllItem = {
   checked: boolean | "mixed";
 };
 
-function FilterCheckbox<T>({
+const FilterCheckbox = <T,>({
   label,
   items,
   width,
@@ -221,7 +221,7 @@ function FilterCheckbox<T>({
   onValueChange,
   onPressRemove,
   autoOpen = false,
-}: FilterCheckboxProps<T>) {
+}: FilterCheckboxProps<T>) => {
   const inputRef = useRef<View>(null);
   const [visible, { close, toggle }] = useDisclosure(autoOpen);
 
@@ -323,7 +323,7 @@ function FilterCheckbox<T>({
       </Popover>
     </View>
   );
-}
+};
 
 type FilterDateProps = {
   label: string;
@@ -339,7 +339,7 @@ type FilterDateProps = {
   autoOpen?: boolean;
 };
 
-function FilterDate({
+const FilterDate = ({
   label,
   initialValue,
   noValueText,
@@ -351,7 +351,7 @@ function FilterDate({
   onValueChange,
   onPressRemove,
   autoOpen = false,
-}: FilterDateProps) {
+}: FilterDateProps) => {
   const inputRef = useRef<View>(null);
   const [visible, { close, toggle }] = useDisclosure(autoOpen);
 
@@ -389,7 +389,7 @@ function FilterDate({
       />
     </View>
   );
-}
+};
 
 type FilterInputProps = {
   label: string;
@@ -402,7 +402,7 @@ type FilterInputProps = {
   autoOpen?: boolean;
 };
 
-function FilterInput({
+const FilterInput = ({
   label,
   initialValue = "",
   noValueText,
@@ -411,7 +411,7 @@ function FilterInput({
   validate,
   onValueChange,
   onPressRemove,
-}: FilterInputProps) {
+}: FilterInputProps) => {
   const [visible, { close, toggle }] = useDisclosure(autoOpen);
   const tagRef = useRef<View>(null);
 
@@ -480,7 +480,7 @@ function FilterInput({
       </Popover>
     </View>
   );
-}
+};
 
 export type FilterCheckboxDef<T> = {
   type: "checkbox";
@@ -522,9 +522,7 @@ type ExtractFilterValue<T extends Filter<unknown>> = T extends { type: "checkbox
   ? T["items"][number]["value"][] | undefined
   : T extends { type: "radio" }
     ? T["items"][number]["value"] | undefined
-    : T extends { type: "boolean" }
-      ? boolean | undefined
-      : string | undefined;
+    : string | undefined;
 
 const getFilterValue = <T extends Filter<unknown>["type"]>(
   _type: T,
@@ -557,6 +555,7 @@ export const FiltersStack = <T extends FiltersDefinition>({
   onChangeFilters,
 }: FiltersStackProps<T>) => {
   const previousOpened = usePreviousValue(openedFilters);
+
   const lastOpenedFilter =
     openedFilters.length > previousOpened.length
       ? openedFilters[openedFilters.length - 1]

types/react-native/index.d.ts

@@ -447,6 +447,7 @@ declare module "react-native" {
     backgroundSize?: string;
     boxShadow?: string;
     display?: DisplayValue;
+    listStyleType?: string;
     maskImage?: string;
     position?: PositionValue;
     scrollBehavior?: "auto" | "smooth";