fix: Dealer search and feedback stuff

* Tab label added to control how tab navigator stuff is displayed.
* Viewers initial zoom changed, fixed share debounce.
* Fuse integration increase limit.
* Dealer and event share debounced.
* Dealer and event router new tab label used.
* Fixed search issue where an old property name was used.

src/components/generic/atoms/TabLabel.tsx

@@ -0,0 +1,33 @@
+import { StyleSheet } from "react-native";
+import { Label } from "./Label";
+
+export const tabLabelMaxWidth = 110;
+
+export type TabLabelProps = {
+    focused: boolean;
+    children: string;
+    wide: boolean;
+};
+
+export const TabLabel = ({ focused, children, wide }: TabLabelProps) => {
+    return (
+        <Label type="bold" style={[focused ? styles.focused : styles.unfocused, wide && styles.wide]} numberOfLines={1} ellipsizeMode="tail">
+            {children}
+        </Label>
+    );
+};
+
+const styles = StyleSheet.create({
+    wide: {
+        maxWidth: tabLabelMaxWidth,
+        paddingHorizontal: 5,
+    },
+    unfocused: {
+        maxWidth: tabLabelMaxWidth,
+        opacity: 0.5,
+    },
+    focused: {
+        maxWidth: tabLabelMaxWidth,
+        opacity: 1,
+    },
+});

src/components/viewer/ViewerImageRecord.tsx

@@ -11,7 +11,7 @@ import { Image } from "../generic/atoms/Image";
 import { Header } from "../generic/containers/Header";
 import { minZoomFor, shareImage } from "./Viewer.common";
 
-const viewerPadding = 40;
+const viewerPadding = 20;
 
 export type ViewerImageRecordProps = {
     id: RecordId;
@@ -42,7 +42,7 @@ export const ViewerImageRecord: FC<ViewerImageRecordProps> = ({ id }) => {
                     contentHeight={image.Height + viewerPadding * 2}
                     minZoom={minZoom}
                     maxZoom={maxZoom}
-                    initialZoom={minZoom}
+                    initialZoom={minZoom * 1.2}
                     bindToBorders={true}
                 >
                     <View style={styleContainer}>

src/components/viewer/ViewerUrl.tsx

@@ -7,7 +7,7 @@ import { Image } from "../generic/atoms/Image";
 import { Header } from "../generic/containers/Header";
 import { minZoomFor, shareImage } from "./Viewer.common";
 
-const viewerPadding = 40;
+const viewerPadding = 20;
 
 export type ViewerUrlProps = {
     url: string;
@@ -24,13 +24,11 @@ export const ViewerUrl: FC<ViewerUrlProps> = ({ url, title }) => {
         ReactImage.getSize(
             url,
             (width, height) => {
-                console.log("GOT SIZE", width, height);
                 // Gotten successfully.
                 setWidth(width);
                 setHeight(height);
             },
             () => {
-                console.log("SIZE FAIL");
                 // Failed, set to 0 so that expo image starts loading.
                 setWidth(0);
                 setHeight(0);
@@ -57,7 +55,7 @@ export const ViewerUrl: FC<ViewerUrlProps> = ({ url, title }) => {
                     contentHeight={height + viewerPadding * 2}
                     minZoom={minZoom}
                     maxZoom={maxZoom}
-                    initialZoom={minZoom}
+                    initialZoom={minZoom * 1.2}
                     bindToBorders={true}
                 >
                     <View style={{ width, height }}>
@@ -68,7 +66,6 @@ export const ViewerUrl: FC<ViewerUrlProps> = ({ url, title }) => {
                             source={url}
                             priority="high"
                             onLoad={(event) => {
-                                console.log("EXPO GOT SIZE", event.source.width, event.source.height);
                                 setWidth(event.source.width);
                                 setHeight(event.source.height);
                             }}

src/hooks/searching/useFuseIntegration.ts

@@ -8,7 +8,7 @@ import { RootState, useAppSelector } from "../../store";
  * @param selector The selector from the  app state.
  * @param limit Maximum results.
  */
-export const useFuseIntegration = <T extends object>(selector: (state: RootState) => Fuse<T>, limit = 30): [string, Dispatch<SetStateAction<string>>, T[] | null] => {
+export const useFuseIntegration = <T extends object>(selector: (state: RootState) => Fuse<T>, limit = 100): [string, Dispatch<SetStateAction<string>>, T[] | null] => {
     // Search state.
     const fuse = useAppSelector(selector);
     const [filter, setFilter] = useState("");

src/routes/dealers/DealersRouter.tsx

@@ -11,6 +11,7 @@ import { Icon } from "../../components/generic/atoms/Icon";
 import { useTabStyles } from "../../components/generic/nav/useTabStyles";
 import { AreasRouterParamsList } from "../AreasRouter";
 import { IndexRouterParamsList } from "../IndexRouter";
+import { TabLabel } from "../../components/generic/atoms/TabLabel";
 import { DealersAd, DealersAdParams } from "./DealersAd";
 import { DealersAll, DealersAllParams } from "./DealersAll";
 import { DealersAlpha, DealersAlphaParams } from "./DealersAlpha";
@@ -88,7 +89,18 @@ export const DealersRouter: FC<DealersRouterProps> = () => {
     // If the screens require too much performance we should set detach to true again.
     return (
         <View style={StyleSheet.absoluteFill}>
-            <Tab.Navigator initialRouteName="All" initialLayout={layout} sceneContainerStyle={scene}>
+            <Tab.Navigator
+                initialRouteName="All"
+                initialLayout={layout}
+                sceneContainerStyle={scene}
+                screenOptions={{
+                    tabBarLabel: ({ focused, children }) => (
+                        <TabLabel wide={false} focused={focused}>
+                            {children}
+                        </TabLabel>
+                    ),
+                }}
+            >
                 {defaultScreens}
             </Tab.Navigator>
         </View>

src/routes/events/EventsRouter.tsx

@@ -17,6 +17,7 @@ import { EventDayRecord } from "../../store/eurofurence/types";
 import { AreasRouterParamsList } from "../AreasRouter";
 import { IndexRouterParamsList } from "../IndexRouter";
 import { conTimeZone } from "../../configuration";
+import { TabLabel } from "../../components/generic/atoms/TabLabel";
 import { PersonalSchedule, PersonalScheduleParams } from "./PersonalSchedule";
 import { EventsSearch, EventsSearchParams } from "./EventsSearch";
 import { EventsRouterContextProvider, useEventsRouterContext } from "./EventsRouterContext";
@@ -196,6 +197,11 @@ const EventsRouterContent: FC<EventsRouterProps> = ({ route }) => {
                 screenOptions={{
                     tabBarScrollEnabled: scroll,
                     tabBarItemStyle: scroll ? { width: 110 } : undefined,
+                    tabBarLabel: ({ focused, children }) => (
+                        <TabLabel wide={scroll} focused={focused}>
+                            {children}
+                        </TabLabel>
+                    ),
                     lazy: true,
                     lazyPreloadDistance: 3,
                 }}

src/store/eurofurence/selectors/search.ts

@@ -25,7 +25,7 @@ const searchOptions: IFuseOptions<any> = {
  */
 const dealerSearchProperties: FuseOptionKey<DealerDetails>[] = [
     {
-        name: "FullName",
+        name: "DisplayNameOrAttendeeNickname",
         weight: 2,
     },
     {