Fix ContextMenu quirks

+ revert to old-ish overflow icon for Card component

src/ui/components/ContextMenu.tsx

@@ -1,17 +1,57 @@
-import { findByProps } from "@/lib/metro/filters";
+import { findByProps } from "@lib/metro/filters";
+import { ReactNative } from "@lib/preinit";
+import { instead } from "@lib/patcher";
 
-const { ContextMenu } = findByProps("ContextMenu");
+const { ContextMenu: _ContextMenu } = findByProps("ContextMenu");
+const { AccessibilityInfo } = ReactNative
 
-export default ContextMenu as (props: {
+type ContextMenuItem = {
+    label: string,
+    iconSource: import("react-native").ImageSourcePropType,
+    action: () => unknown,
+    [key: string]: any;
+}
+
+type ContextMenuProps = {
     triggerOnLongPress: boolean;
-    items: Array<{ 
-        label: string, 
-        iconSource: number, 
-        action: () => unknown,
-        [key: string]: any;
-    }>;
+    items: ContextMenuItem[] | ContextMenuItem[][];
     align: "left" | "right" | "above" | "below" | "auto" | null;
     title: string;
     children: React.FC;
     [key: string]: any;
-}) => JSX.Element;
+}
+
+export default function ContextMenu(props: ContextMenuProps) {
+    const ref = React.useRef(null);
+
+    React.useEffect(() => {
+        // hacky discord fix for android where pressing back with context menu open crashes the client
+        if (ReactNative.Platform.OS !== "android") return;
+
+        // @ts-ignore
+        const ctxMenuReactTag = ref.current?._children?.[0]?._nativeTag;
+
+        return () => {
+            if (!ctxMenuReactTag) return;
+
+            const unpatch = instead("setAccessibilityFocus", AccessibilityInfo, ([tag], orig) => {
+                if (tag !== ctxMenuReactTag) {
+                    return orig.apply(AccessibilityInfo, [tag]);
+                } else {
+                    unpatch(); // and skip this call
+                }
+            });
+        }
+    }, []);
+
+    return <ReactNative.View ref={ref}>
+        <_ContextMenu
+            {...props}
+            title={props.title}
+            children={props.children}
+            triggerOnLongPress={props.triggerOnLongPress}
+            items={props.items}
+            align={props.align}
+        />
+    </ReactNative.View>
+}

src/ui/settings/components/Card.tsx

@@ -29,6 +29,12 @@ const styles = stylesheet.createThemedStyleSheet({
         marginLeft: 5,
         tintColor: semanticColors?.INTERACTIVE_NORMAL,
     },
+    icon: {
+        width: 22,
+        height: 22,
+        marginLeft: 5,
+        tintColor: semanticColors?.INTERACTIVE_NORMAL,
+    }
 })
 
 interface Action {
@@ -58,6 +64,7 @@ interface CardProps {
     actions?: Action[];
     overflowTitle?: string;
     overflowActions?: OverflowAction[];
+    overflowIcon?: string;
 }
 
 export default function Card(props: CardProps) {
@@ -77,14 +84,15 @@ export default function Card(props: CardProps) {
                     {...headerProps}
                     value={props.toggleValue}
                     onValueChange={props.onToggleChange}
-                /> : <TableCheckboxRow
+                /> : props.toggleType === "radio" ?
+                <TableCheckboxRow
                     {...headerProps}
                     onPress={() => {
                         pressableState = !pressableState;
                         props.onToggleChange?.(pressableState)
                     }}
                     checked={props.toggleValue}
-                />)}
+                /> : undefined) || <TableRow {...headerProps} />}
             <TableRow
                 label={props.descriptionLabel}
                 trailing={
@@ -97,14 +105,11 @@ export default function Card(props: CardProps) {
                                     iconSource: getAssetIDByName(i.icon),
                                     action: i.onPress
                                 }))}
-                                align="below"
+                                align="auto"
                                 title={props.overflowTitle!!}
-                                children={(props) => <IconButton
-                                    {...props}
-                                    size="sm"
-                                    variant="secondary"
-                                    icon={getAssetIDByName("more_horizontal")} 
-                                />}
+                                children={(props) => <RN.TouchableOpacity {...props}>
+                                    <RN.Image style={styles.icon} source={getAssetIDByName("ic_more_24px")} />
+                                </RN.TouchableOpacity>}
                             />
                         }
                     </RN.View>