fix weird transaction positions editing

SFTtech · May 8, 2022 · 7859f27 · 7859f27
1 parent 4e50e71
commit 7859f27
Showing 1 changed file with 15 additions and 11 deletions.
diff --git a/web/src/components/transactions/purchase/PurchaseItems.tsx b/web/src/components/transactions/purchase/PurchaseItems.tsx
@@ -227,17 +227,21 @@ export default function PurchaseItems({ group, transaction }: PropTypes) {
     );
     const [showAdvanced, setShowAdvanced] = useState(false);
 
-    const positions = transaction.positions
-        .map((p) => ({ ...p, is_empty: false }))
-        .concat([
-            {
-                ...localPositionChanges.empty,
-                is_empty: true,
-            },
-        ]);
+    const [positions, setPositions] = useState([]);
+
+    useEffect(() => {
+        setPositions(transaction.positions
+            .map((p) => ({ ...p, is_empty: false }))
+            .concat([
+                {
+                    ...localPositionChanges.empty,
+                    is_empty: true,
+                },
+            ]));
+    }, [transaction, setPositions, localPositionChanges])
 
     // find all accounts that take part in the transaction, either via debitor shares or purchase items
-    // TODO: should we add creditor items as well?
+    // TODO: should we add creditor accounts as well?
     const positionAccounts: Array<number> = Array.from(
         new Set<number>(
             positions
@@ -538,7 +542,7 @@ export default function PurchaseItems({ group, transaction }: PropTypes) {
                     </TableHead>
                     <TableBody>
                         {transaction.is_wip
-                            ? positions.map((position) => (
+                            ? positions.map(position => (
                                   <TableRow hover key={position.id}>
                                       <PositionTableRow
                                           position={position}
@@ -554,7 +558,7 @@ export default function PurchaseItems({ group, transaction }: PropTypes) {
                                   </TableRow>
                               ))
                             : positions.map(
-                                  (position) =>
+                                  position =>
                                       !position.is_empty && (
                                           <TableRow hover key={position.id}>
                                               <TableCell>{position.name}</TableCell>