Explorar el Código

prevent item action click propagation

mightyplow hace 4 años
padre
commit
4d70bf5816
Se han modificado 1 ficheros con 9 adiciones y 2 borrados
  1. 9 2
      src/components/caloriesList/ItemActions.tsx

+ 9 - 2
src/components/caloriesList/ItemActions.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { EventHandler, SyntheticEvent } from 'react';
 import cx from 'classnames';
 import { IconButton } from '../button/IconButton';
 import { iconTypes } from '../icon/iconTypes';
@@ -9,6 +9,13 @@ type ItemActionsProps = {
   className?: string
 };
 
+function stopPropagation (callback: EventHandler<SyntheticEvent>): EventHandler<SyntheticEvent> {
+  return (event: SyntheticEvent) => {
+    event.stopPropagation();
+    callback(event);
+  };
+}
+
 function ItemActions (props: ItemActionsProps) {
   const {
     className,
@@ -17,7 +24,7 @@ function ItemActions (props: ItemActionsProps) {
 
   return (
     <section className={cx(styles.itemActions, className)}>
-      <IconButton icon={iconTypes.TRASH} buttonClassName={styles.button} onClick={removeItem} />
+      <IconButton icon={iconTypes.TRASH} buttonClassName={styles.button} onClick={stopPropagation(removeItem)} />
     </section>
   );
 }