refactor(FE-114): auto-populate notes with product name and enhance tooltip visibility in RecordingForm

src/components/pages/production/recording/form/RecordingForm.tsx

@@ -815,8 +815,14 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                         <span className='text-error'>*</span>
                       </span>
                   </th>
-                  <th>Jumlah Pakai</th>
+                  <th>Jumlah Pakai
-                  <th>Catatan</th>
+                    <span
+                      className="tooltip tooltip-error tooltip-bottom z-[9999]"
+                      data-tip="required"
+                    >
+                        <span className="text-error">*</span>
+                      </span>
+                  </th>
                   {type !== 'detail' && <th>Action</th>}
                 </tr>
                 </thead>
@@ -859,6 +865,18 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                             `stocks.${idx}.product_warehouse_id`,
                             option?.value || 0
                           );
+                          // Auto-populate notes with product name by finding it in stockProducts data
+                          if (option?.value && isResponseSuccess(stockProducts)) {
+                            const selectedProduct = stockProducts.data.find(
+                              (product) => product.id === option.value
+                            );
+                            if (selectedProduct) {
+                              formik.setFieldValue(
+                                `stocks.${idx}.notes`,
+                                selectedProduct.product.name
+                              );
+                            }
+                          }
                         }}
                         options={unifiedStockProducts}
                         placeholder='Pilih Produk'
@@ -909,20 +927,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                         placeholder='Jumlah Pakai'
                       />
                     </td>
-                    <td>
+                      {type !== 'detail' && (
-                      <TextInput
-                        name={`stocks.${idx}.notes`}
-                        value={stock.notes || ''}
-                        onChange={formik.handleChange}
-                        onBlur={formik.handleBlur}
-                        placeholder='Catatan...'
-                        readOnly={type === 'detail'}
-                        className={{
-                          wrapper: 'w-full min-w-32',
-                        }}
-                      />
-                    </td>
-                    {type !== 'detail' && (
                       <td>
                         <div className='flex justify-center'>
                           <Button
@@ -1008,12 +1013,18 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                   )}
                   <th>
                     Kondisi
+                    <span
+                      className="tooltip tooltip-error tooltip-bottom z-[9999]"
+                      data-tip="required"
+                    >
+                        <span className="text-error">*</span>
+                      </span>
                   </th>
                   <th>
                     Total
                     <span
-                      className='tooltip tooltip-error tooltip-bottom z-[9999]'
+                      className="tooltip tooltip-error tooltip-bottom z-[9999]"
-                      data-tip='required'
+                      data-tip="required"
                     >
                         <span className='text-error'>*</span>
                     </span>