fix: missing useRef

This commit is contained in:
Adnan Zahir
2026-04-29 12:15:02 +07:00
parent e75246ff8d
commit 631e3959cd
@@ -1,6 +1,6 @@
'use client'; 'use client';
import { useMemo, useState, useEffect, useCallback } from 'react'; import { useMemo, useState, useEffect, useCallback, useRef } from 'react';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { useFormik } from 'formik'; import { useFormik } from 'formik';
@@ -1277,10 +1277,10 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
}; };
} }
// In migration mode (edit), the form field `product_warehouse_id` must hold // In migration mode (edit), the dropdown options use product.id as their value,
// the master product ID (what the dropdown options use as `value`), not the // but the API returns product_warehouse_id (PW entity ID). Remap so the dropdown
// PW entity ID returned by the API. The API response has the product ID // can match the correct option. The product ID is available on the nested
// nested at stock.product_warehouse.product_id. // product_warehouse object returned by the API.
if (isMigrationMode && type === 'edit' && initialValues?.stocks?.length) { if (isMigrationMode && type === 'edit' && initialValues?.stocks?.length) {
baseValues.stocks = initialValues.stocks.map((stock) => ({ baseValues.stocks = initialValues.stocks.map((stock) => ({
product_warehouse_id: product_warehouse_id:
@@ -1421,19 +1421,30 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
}, },
}); });
// When migration mode activates after formik has initialized (SWR timing race), // SWR timing fix: formik initializes before system-settings load, so isMigrationMode
// push the corrected stock values (product_id, not PW entity id) into the form. // starts false. When it flips true, formikInitialValues recomputes but enableReinitialize
// is false, so formik won't pick it up. Push the corrected stock values once, and only
// once — the ref prevents re-firing if something causes isMigrationMode to re-evaluate.
const migrationEditMappingApplied = useRef(false);
useEffect(() => { useEffect(() => {
if (type !== 'edit' || !isMigrationMode || !initialValues?.stocks?.length) if (
type !== 'edit' ||
!isMigrationMode ||
!initialValues?.stocks?.length ||
migrationEditMappingApplied.current
)
return; return;
const migrationStocks = initialValues.stocks.map((stock) => ({ migrationEditMappingApplied.current = true;
product_warehouse_id: formik.setFieldValue(
stock.product_warehouse?.product_id ?? stock.product_warehouse_id, 'stocks',
qty: stock.usage_amount ?? '', initialValues.stocks.map((stock) => ({
})); product_warehouse_id:
formik.setFieldValue('stocks', migrationStocks); stock.product_warehouse?.product_id ?? stock.product_warehouse_id,
qty: stock.usage_amount ?? '',
}))
);
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [isMigrationMode]); // intentionally shallow — only run when migration mode flips }, [isMigrationMode]);
// ===== HELPER FUNCTIONS ===== // ===== HELPER FUNCTIONS =====
const { setFieldValue } = formik; const { setFieldValue } = formik;