Prevent default on pointerdown

actualbudget · Sep 25, 2023 · a1561e7 · a1561e7
1 parent f75c06c
commit a1561e7
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 38 deletions.
diff --git a/packages/desktop-client/src/components/budget/MobileBudgetTable.js b/packages/desktop-client/src/components/budget/MobileBudgetTable.js
@@ -134,7 +134,11 @@ function BudgetCell({
   }
 
   return (
-    <View style={style} onPointerUp={onAmountClick}>
+    <View
+      style={style}
+      onPointerUp={onAmountClick}
+      onPointerDown={e => e.preventDefault()}
+    >
       {editing ? (
         <AmountInput
           initialValue={sheetValue}

diff --git a/packages/desktop-client/src/components/spreadsheet/CellValue.tsx b/packages/desktop-client/src/components/spreadsheet/CellValue.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, type ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 
 import { type CSSProperties, styles } from '../../style';
 import Text from '../common/Text';
@@ -36,40 +36,28 @@ function CellValue({
   let sheetValue = useSheetValue(binding);
   let format = useFormat();
 
-  return useMemo(
-    () => (
-      <ConditionalPrivacyFilter
-        privacyFilter={
-          privacyFilter != null
-            ? privacyFilter
-            : type === 'financial'
-            ? true
-            : undefined
-        }
+  return (
+    <ConditionalPrivacyFilter
+      privacyFilter={
+        privacyFilter != null
+          ? privacyFilter
+          : type === 'financial'
+          ? true
+          : undefined
+      }
+    >
+      <Text
+        style={{
+          ...(type === 'financial' && styles.tnum),
+          ...style,
+          ...(getStyle && getStyle(sheetValue)),
+        }}
+        data-testid={testId || fullSheetName}
+        data-cellname={fullSheetName}
       >
-        <Text
-          style={{
-            ...(type === 'financial' && styles.tnum),
-            ...style,
-            ...(getStyle && getStyle(sheetValue)),
-          }}
-          data-testid={testId || fullSheetName}
-          data-cellname={fullSheetName}
-        >
-          {formatter ? formatter(sheetValue) : format(sheetValue, type)}
-        </Text>
-      </ConditionalPrivacyFilter>
-    ),
-    [
-      privacyFilter,
-      type,
-      style,
-      getStyle,
-      fullSheetName,
-      formatter,
-      format,
-      sheetValue,
-    ],
+        {formatter ? formatter(sheetValue) : format(sheetValue, type)}
+      </Text>
+    </ConditionalPrivacyFilter>
   );
 }
 

diff --git a/packages/desktop-client/src/components/util/AmountInput.js b/packages/desktop-client/src/components/util/AmountInput.js
@@ -28,7 +28,7 @@ export function AmountInput({
   let [value, setValue] = useState(initialValueAbsolute);
   let ref = useRef();
   let buttonRef = useRef();
-  let mergedRef = useMergedRefs(inputRef, ref);
+  let mergedInputRef = useMergedRefs(inputRef, ref);
 
   function onSwitch() {
     ref.current?.focus();
@@ -59,13 +59,13 @@ export function AmountInput({
   return (
     <InputWithContent
       id={id}
-      inputRef={mergedRef}
+      inputRef={mergedInputRef}
       inputMode="decimal"
       leftContent={
         <Button
           type="bare"
           style={{ padding: '0 7px' }}
-          onClick={onSwitch}
+          onPointerUp={onSwitch}
           onPointerDown={e => e.preventDefault()}
           ref={buttonRef}
         >