From b8ef41db1d35adc699d13c4882b642ca77d49e40 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 13:56:52 +0200
Subject: [PATCH 01/10] feat: refactor visionAction to use plimit for
 generation of big set of data

---
 custom/VisionAction.vue  | 1026 +++++++++++++++++---------------------
 custom/VisionTable.vue   |  170 ++++---
 custom/package-lock.json |   28 ++
 custom/package.json      |    3 +-
 index.ts                 |   23 +-
 types.ts                 |    5 +
 6 files changed, 613 insertions(+), 642 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index 457aa63..c5be4c3 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -20,7 +20,7 @@
         { 
           label: checkedCount > 1 ? t('Save fields') : t('Save field'), 
           options: { 
-            disabled: isLoading || checkedCount < 1 || isCriticalError || isFetchingRecords || isGeneratingImages || isAnalizingFields || isAnalizingImages, 
+            disabled: isLoading || checkedCount < 1 || isCriticalError || isFetchingRecords || isProcessingAny, 
             loader: isLoading, class: 'w-fit' 
           }, 
           onclick: async (dialog) => { await saveData(); dialog.hide(); } 
@@ -67,46 +67,23 @@
     :click-to-close-outside="false"
   >
     <div class="bulk-vision-table flex flex-col items-center gap-3 md:gap-4 overflow-y-auto">
-      <template v-if="records && props.checkboxes.length && popupMode === 'generation'" >
+      <template v-if="globalState.records.length && props.checkboxes.length && popupMode === 'generation'" >
         <VisionTable
-        class="md:max-h-[75vh] max-w-[1560px] w-full h-full"
-          :checkbox="props.checkboxes"
-          :records="records"
+          class="md:max-h-[75vh] max-w-[1560px] w-full h-full"
+          :records="globalState.records"
           :meta="props.meta"
-          :images="images"
           :tableHeaders="tableHeaders"
-          :tableColumns="tableColumns"
           :customFieldNames="customFieldNames"
-          :tableColumnsIndexes="tableColumnsIndexes"
-          :selected="selected"
-          :oldData="oldData"
           :isError="isError"
           :errorMessage="errorMessage"
-          :isAiResponseReceivedAnalizeImage="isAiResponseReceivedAnalizeImage"
-          :isAiResponseReceivedAnalizeNoImage="isAiResponseReceivedAnalizeNoImage"
-          :isAiResponseReceivedImage="isAiResponseReceivedImage"
-          :primaryKey="primaryKey"
-          :openGenerationCarousel="openGenerationCarousel"
-          :openImageCompare="openImageCompare"
-          @error="handleTableError"
-          :carouselSaveImages="carouselSaveImages"
-          :carouselImageIndex="carouselImageIndex"
           :regenerateImagesRefreshRate="props.meta.refreshRates?.regenerateImages"
-          :isAiGenerationError="isAiGenerationError"
-          :aiGenerationErrorMessage="aiGenerationErrorMessage"
-          :isAiImageGenerationError="isAiImageGenerationError"
-          :imageGenerationErrorMessage="imageGenerationErrorMessage"
-          @regenerate-images="regenerateImages"
           :isImageHasPreviewUrl="isImageHasPreviewUrl"
           :imageGenerationPrompts="generationPrompts.generateImages"
-          :isImageToTextGenerationError="isImageToTextGenerationError"
-          :imageToTextErrorMessages="imageToTextErrorMessages"
-          :isTextToTextGenerationError="isTextToTextGenerationError"
-          :textToTextErrorMessages="textToTextErrorMessages"
           :outputImageFields="props.meta.outputImageFields"
           :outputFieldsForAnalizeFromImages="props.meta.outputFieldsForAnalizeFromImages"
           :outputPlainFields="props.meta.outputPlainFields"
-          :regeneratingFieldsStatus="regeneratingFieldsStatus"
+          @error="handleTableError"
+          @regenerate-images="regenerateImages"
           @regenerate-cell="regenerateCell"
         />
         <div class="text-red-600 flex items-center w-full">
@@ -165,8 +142,9 @@
 
 <script lang="ts" setup>
 import { callAdminForthApi } from '@/utils';
-import { Ref, ref, watch } from 'vue'
-import { Dialog, Button, Textarea, Toggle, Tooltip } from '@/afcl';
+import { ref, computed, reactive } from 'vue'
+import pLimit from 'p-limit';
+import { Dialog, Textarea, Toggle, Tooltip } from '@/afcl';
 import VisionTable from './VisionTable.vue'
 import adminforth from '@/adminforth';
 import { useI18n } from 'vue-i18n';
@@ -188,58 +166,61 @@ const props = defineProps<{
   clearCheckboxes?: () => any,
 }>();
 
+type RecordStatus = 'pending' | 'processing' | 'completed' | 'failed';
+
+type RecordState = {
+  id: string | number;
+  status: RecordStatus;
+  isChecked: boolean;
+  label: string;
+  data: Record<string, any>;
+  oldData: Record<string, any>;
+  images: any[];
+  aiStatus: {
+    generatedImages: boolean;
+    analyzedImages: boolean;
+    analyzedNoImages: boolean;
+  };
+  openGenerationCarousel: Record<string, boolean>;
+  openImageCompare: Record<string, boolean>;
+  carouselSaveImages: Record<string, any[]>;
+  carouselImageIndex: Record<string, number>;
+  imageGenerationErrorMessage: string;
+  imageGenerationFailed: boolean;
+  imageToTextErrorMessages: Record<string, string>;
+  textToTextErrorMessages: Record<string, string>;
+  regeneratingFieldsStatus: Record<string, boolean>;
+  listOfImageNotGenerated: Record<string, any>;
+};
+
+const globalState = reactive<{ records: RecordState[]; recordsById: Record<string, RecordState> }>({
+  records: [],
+  recordsById: {},
+});
+
 defineExpose({
   click
 });
 
-const confirmDialog = ref(null);
-const records = ref<any[]>([]);
-const images = ref<any[]>([]);
-const tableHeaders = ref([]);
-const tableColumns = ref([]);
-const tableColumnsIndexes = ref([]);
-const customFieldNames = ref([]);
-const selected = ref<any[]>([]);
-const oldData = ref<any[]>([]);
-const carouselSaveImages = ref<any[]>([]);
-const carouselImageIndex = ref<any[]>([]);
-const isAiResponseReceivedAnalizeImage = ref([]);
-const isAiResponseReceivedAnalizeNoImage = ref([]);
-const isAiResponseReceivedImage = ref([]);
+const confirmDialog = ref<any>(null);
 const primaryKey = props.meta.primaryKey;
-const openGenerationCarousel = ref([]);
-const openImageCompare = ref([]);
 const isLoading = ref(false);
 const isFetchingRecords = ref(false);
 const isError = ref(false);
 const isCriticalError = ref(false);
-const isImageGenerationError = ref(false);
 const errorMessage = ref('');
-const checkedCount = ref(0);
-const isGeneratingImages = ref(false);
-const isAnalizingFields = ref(false);
-const isAnalizingImages = ref(false);
 const isDialogOpen = ref(false);
-const isAiGenerationError = ref<boolean[]>([false]);
-const aiGenerationErrorMessage = ref<string[]>([]);
-const isAiImageGenerationError = ref<boolean[]>([false]);
-
-const isImageToTextGenerationError = ref<boolean[]>([false]);
-const imageToTextErrorMessages = ref<Record<string, string>[]>([]);
-
-const isTextToTextGenerationError = ref<boolean[]>([false]);
-const textToTextErrorMessages = ref<Record<string, string>[]>([]);
-
-const imageGenerationErrorMessage = ref<string[]>([]);
 const isImageHasPreviewUrl = ref<Record<string, boolean>>({});
 const popupMode = ref<'generation' | 'confirmation' | 'settings'>('confirmation');
 const generationPrompts = ref<any>({});
 const isDataSaved = ref(false);
-
-const regeneratingFieldsStatus = ref<Record<string, Record<string, boolean>>>({});
 const overwriteExistingValues = ref<boolean>(false);
 
-const listOfImageThatWasNotGeneratedPerRecord = ref<Record<string, string[]>>({});
+const checkedCount = computed(() => globalState.records.filter(record => record.isChecked).length);
+const isProcessingAny = computed(() => globalState.records.some(record => record.status === 'processing'));
+
+const tableHeaders = computed(() => generateTableHeaders(props.meta.outputFields));
+const customFieldNames = computed(() => tableHeaders.value.slice((props.meta.isAttachFiles) ? 3 : 2).map(h => h.fieldName));
 
 const openDialog = async () => {
   window.addEventListener('beforeunload', beforeUnloadHandler);
@@ -251,32 +232,9 @@ const openDialog = async () => {
   isDialogOpen.value = true;
   confirmDialog.value.open();
   isFetchingRecords.value = true;
-  await getRecords();
-  if (props.meta.isAttachFiles) {
-    await getImages();
-  }
+  initializeGlobalState();
   await findPreviewURLForImages();
-  tableHeaders.value = generateTableHeaders(props.meta.outputFields);
-  const result = generateTableColumns();
-  tableColumns.value = result.tableData;
-  tableColumnsIndexes.value = result.indexes;
-  customFieldNames.value = tableHeaders.value.slice((props.meta.isAttachFiles) ? 3 : 2).map(h => h.fieldName);
-  setSelected();
-  if (props.meta.isImageGeneration) {
-    fillCarouselSaveImages();
-  }
-  for (let i = 0; i < selected.value?.length; i++) {
-    openGenerationCarousel.value[i] = props.meta.outputImageFields?.reduce((acc,key) =>{
-      acc[key] = false;
-      return acc;
-    },{[primaryKey]: records.value[i][primaryKey]} as Record<string, boolean>);
-    openImageCompare.value[i] = props.meta.outputImageFields?.reduce((acc,key) =>{
-      acc[key] = false;
-      return acc;
-    },{[primaryKey]: records.value[i][primaryKey]} as Record<string, boolean>);
-  }
   isFetchingRecords.value = false;
-  // Ensure prompts are loaded before any automatic AI action run
   if (!generationPrompts.value || Object.keys(generationPrompts.value).length === 0) {
     await getGenerationPrompts();
   }
@@ -286,194 +244,363 @@ const openDialog = async () => {
 }
  
 
-function runAiActions() {
+async function runAiActions() {
   popupMode.value = 'generation';
-
-  if (props.meta.isImageGeneration) {
-    isGeneratingImages.value = true;
-    runAiAction({
-      endpoint: 'initial_image_generate',
-      actionType: 'generate_images',
-      responseFlag: isAiResponseReceivedImage,
-    });
-  }
-  if (props.meta.isFieldsForAnalizeFromImages) {
-    isAnalizingImages.value = true;
-    runAiAction({
-      endpoint: 'analyze',
-      actionType: 'analyze',
-      responseFlag: isAiResponseReceivedAnalizeImage,
-    });
-  }
-  if (props.meta.isFieldsForAnalizePlain) {
-    isAnalizingFields.value = true;
-    runAiAction({
-      endpoint: 'analyze_no_images',
-      actionType: 'analyze_no_images',
-      responseFlag: isAiResponseReceivedAnalizeNoImage,
-    });
+  if (!await checkRateLimits()) {
+    return;
   }
+  const limit = pLimit(props.meta.concurrencyLimit || 10);
+  const tasks = globalState.records
+    .filter(record => record.isChecked)
+    .map(record => limit(() => processOneRecord(String(record.id))));
+  await Promise.all(tasks);
 }
 
 const closeDialog = () => {
   window.removeEventListener('beforeunload', beforeUnloadHandler);
-  isAiResponseReceivedAnalizeImage.value = [];
-  isAiResponseReceivedAnalizeNoImage.value = [];
-  isAiResponseReceivedImage.value = [];
-
-  imageToTextErrorMessages.value = [];
-  textToTextErrorMessages.value = [];
-  imageGenerationErrorMessage.value = [];
-  regeneratingFieldsStatus.value = {};
-
-  records.value = [];
-  images.value = [];
-  selected.value = [];
-  tableColumns.value = [];
-  tableColumnsIndexes.value = [];
+  resetGlobalState();
   isError.value = false;
   isCriticalError.value = false;
-  isImageGenerationError.value = false;
   errorMessage.value = '';
   isDialogOpen.value = false;
   popupMode.value = 'confirmation';
   isDataSaved.value = false;
 }
 
-watch(selected, (val) => {
-  checkedCount.value = val.filter(item => item.isChecked === true).length;
-}, { deep: true });
-
-function fillCarouselSaveImages() {
-  for (const item of selected.value) {
-    const tempItem: any = {};
-    const tempItemIndex: any = {};
-    for (const [key, value] of Object.entries(item)) {
-      if (props.meta.outputImageFields?.includes(key)) {
-        tempItem[key] = [];
-        tempItemIndex[key] = 0;
-      }
-    }
-    carouselSaveImages.value.push(tempItem);
-    carouselImageIndex.value.push(tempItemIndex);
-  }
+function initializeGlobalState() {
+  const records = props.checkboxes.map((recordId: any) => createEmptyRecord(recordId));
+  globalState.records.splice(0, globalState.records.length, ...records);
+  globalState.recordsById = Object.fromEntries(records.map(record => [String(record.id), record]));
 }
 
+function resetGlobalState() {
+  globalState.records.splice(0, globalState.records.length);
+  globalState.recordsById = {};
+}
 
-function formatLabel(str) {
-  const labelsMap = props.meta?.columnLabels || {};
-  let labelFromMeta = labelsMap[str];
-  if (!labelFromMeta) {
-    const match = Object.keys(labelsMap).find(k => k.toLowerCase() === String(str).toLowerCase());
-    if (match) labelFromMeta = labelsMap[match];
+function createImageFieldMap<T>(factory: () => T): Record<string, T> {
+  const result: Record<string, T> = {};
+  for (const field of props.meta.outputImageFields || []) {
+    result[field] = factory();
   }
-  if (labelFromMeta) return labelFromMeta;
-  return str
-    .split('_')                   
-    .map(word => word.charAt(0).toUpperCase() + word.slice(1))
-    .join(' ');      
+  return result;
 }
 
-function generateTableHeaders(outputFields) {
-  const headers = [];
+function createEmptyRecord(recordId: string | number): RecordState {
+  return {
+    id: recordId,
+    status: 'pending',
+    isChecked: true,
+    label: '',
+    data: {},
+    oldData: {},
+    images: [],
+    aiStatus: {
+      generatedImages: !props.meta.isImageGeneration,
+      analyzedImages: !props.meta.isFieldsForAnalizeFromImages,
+      analyzedNoImages: !props.meta.isFieldsForAnalizePlain,
+    },
+    openGenerationCarousel: createImageFieldMap(() => false),
+    openImageCompare: createImageFieldMap(() => false),
+    carouselSaveImages: createImageFieldMap(() => []),
+    carouselImageIndex: createImageFieldMap(() => 0),
+    imageGenerationErrorMessage: '',
+    imageGenerationFailed: false,
+    imageToTextErrorMessages: {},
+    textToTextErrorMessages: {},
+    regeneratingFieldsStatus: {},
+    listOfImageNotGenerated: {},
+  };
+}
 
-  headers.push({ label: 'Checkboxes', fieldName: 'checkboxes' });
-  headers.push({ label: 'Field name', fieldName: 'label' });
+async function processOneRecord(recordId: string) {
+  const record = globalState.recordsById[recordId];
+  if (!record || !record.isChecked) {
+    return;
+  }
+  record.status = 'processing';
+  record.imageGenerationFailed = false;
+  record.imageGenerationErrorMessage = '';
+  record.imageToTextErrorMessages = {};
+  record.textToTextErrorMessages = {};
+  record.aiStatus.generatedImages = !props.meta.isImageGeneration;
+  record.aiStatus.analyzedImages = !props.meta.isFieldsForAnalizeFromImages;
+  record.aiStatus.analyzedNoImages = !props.meta.isFieldsForAnalizePlain;
+
+  const oldDataResult = await fetchOldData(recordId);
+  if (!oldDataResult) {
+    record.status = 'failed';
+    record.aiStatus.generatedImages = true;
+    record.aiStatus.analyzedImages = true;
+    record.aiStatus.analyzedNoImages = true;
+    return;
+  }
+  record.label = oldDataResult._label || record.label;
+  initializeRecordData(record, oldDataResult);
   if (props.meta.isAttachFiles) {
-    headers.push({ label: 'Source Images', fieldName: 'images' });
+    await fetchImages(record, oldDataResult);
   }
-  for (const key in outputFields) {
-    headers.push({
-      label: formatLabel(key),
-      fieldName: key,
-    });
+
+  const actions: Array<'generate_images' | 'analyze' | 'analyze_no_images'> = [];
+  if (props.meta.isImageGeneration) {
+    actions.push('generate_images');
   }
-  return headers;
+  if (props.meta.isFieldsForAnalizeFromImages) {
+    actions.push('analyze');
+  }
+  if (props.meta.isFieldsForAnalizePlain) {
+    actions.push('analyze_no_images');
+  }
+
+  const results = await Promise.allSettled(actions.map(actionType => runActionForRecord(record, actionType)));
+  const hasError = results.some(result => result.status === 'rejected');
+  record.status = hasError ? 'failed' : 'completed';
 }
 
-function generateTableColumns() {
-  const fields = [];
-  const tableData = [];
-  const indexes = [];
-  for (const field of tableHeaders.value) {
-    fields.push( field.fieldName );
+async function checkRateLimits() {
+  const actionsToCheck: Array<'generate_images' | 'analyze' | 'analyze_no_images'> = [];
+  if (props.meta.isImageGeneration) {
+    actionsToCheck.push('generate_images');
+  }
+  if (props.meta.isFieldsForAnalizeFromImages) {
+    actionsToCheck.push('analyze');
   }
-  for (const [index, checkbox] of props.checkboxes.entries()) {
-    const record = records.value[index];
-    let reqFields: any = {};
-    for (const field of fields) {
-      reqFields[field] = record[field] || '';
+  if (props.meta.isFieldsForAnalizePlain) {
+    actionsToCheck.push('analyze_no_images');
+  }
+  for (const actionType of actionsToCheck) {
+    try {
+      const rateLimitRes = await callAdminForthApi({
+        path: `/plugin/${props.meta.pluginInstanceId}/update-rate-limits`,
+        method: 'POST',
+        body: { actionType },
+      });
+      if (rateLimitRes?.error || rateLimitRes?.ok === false) {
+        adminforth.alert({
+          message: t(`Rate limit exceeded for "${actionType.replace('_', ' ')}" action. Please try again later.`),
+          variant: 'danger',
+          timeout: 'unlimited',
+        });
+        return false;
+      }
+    } catch (e) {
+      adminforth.alert({
+        message: t(`Error checking rate limit for "${actionType.replace('_', ' ')}" action.`),
+        variant: 'danger',
+        timeout: 'unlimited',
+      });
+      return false;
     }
-    reqFields.label = record._label;
-    reqFields.images = images.value[index];
-    reqFields[primaryKey] = record[primaryKey];
-    indexes.push({
-      [primaryKey]: record[primaryKey],
-      label: record._label,
+  }
+  return true;
+}
+
+async function runActionForRecord(record: RecordState, actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
+  const responseFlag = actionType === 'generate_images'
+    ? 'generatedImages'
+    : actionType === 'analyze'
+      ? 'analyzedImages'
+      : 'analyzedNoImages';
+  record.aiStatus[responseFlag] = false;
+
+  let customPrompt;
+  if (actionType === 'generate_images') {
+    customPrompt = generationPrompts.value.imageGenerationPrompts || generationPrompts.value.generateImages;
+  } else if (actionType === 'analyze') {
+    customPrompt = generationPrompts.value.imageFieldsPrompts;
+  } else if (actionType === 'analyze_no_images') {
+    customPrompt = generationPrompts.value.plainFieldsPrompts;
+  }
+
+  let createJobResponse;
+  try {
+    createJobResponse = await callAdminForthApi({
+      path: `/plugin/${props.meta.pluginInstanceId}/create-job`,
+      method: 'POST',
+      body: {
+        actionType,
+        recordId: record.id,
+        ...(customPrompt !== undefined ? { customPrompt: JSON.stringify(customPrompt) } : {}),
+        filterFilledFields: !overwriteExistingValues.value,
+      },
+      silentError: true,
+    });
+  } catch (e) {
+    record.aiStatus[responseFlag] = true;
+    throw e;
+  }
+
+  if (createJobResponse?.error || !createJobResponse?.jobId) {
+    record.aiStatus[responseFlag] = true;
+    adminforth.alert({
+      message: t(`Failed to ${actionType.replace('_', ' ')}. Please, try to re-run the action.`),
+      variant: 'danger',
+      timeout: 'unlimited',
+    });
+    throw new Error(createJobResponse?.error || 'Failed to create job');
+  }
+
+  await pollJob(record, createJobResponse.jobId, actionType, responseFlag);
+}
+
+async function pollJob(
+  record: RecordState,
+  jobId: string,
+  actionType: 'analyze' | 'analyze_no_images' | 'generate_images',
+  responseFlag: keyof RecordState['aiStatus']
+) {
+  let isInProgress = true;
+  while (isInProgress && isDialogOpen.value) {
+    const jobResponse = await callAdminForthApi({
+      path: `/plugin/${props.meta.pluginInstanceId}/get-job-status`,
+      method: 'POST',
+      body: { jobId },
+      silentError: true,
     });
-    tableData.push(reqFields);
+    if (!jobResponse) {
+      await waitForRefresh(actionType);
+      continue;
+    }
+    if (jobResponse?.error) {
+      record.aiStatus[responseFlag] = true;
+      throw new Error(jobResponse.error);
+    }
+    const jobStatus = jobResponse?.job?.status;
+    if (jobStatus === 'in_progress') {
+      await waitForRefresh(actionType);
+      continue;
+    }
+    if (jobStatus === 'completed') {
+      applyJobResult(record, jobResponse.job, actionType);
+      record.aiStatus[responseFlag] = true;
+      isInProgress = false;
+      continue;
+    }
+    if (jobStatus === 'failed') {
+      applyJobFailure(record, jobResponse.job, actionType);
+      record.aiStatus[responseFlag] = true;
+      throw new Error(jobResponse.job?.error || 'Job failed');
+    }
   }
-  return { tableData, indexes };
 }
 
-function setSelected() {
-  selected.value = records.value.map(() => ({}));
-  records.value.forEach((record, index) => {
-    for (const key in props.meta.outputFields) {
-      if (isInColumnEnum(key)) {
-        const colEnum = props.meta.columnEnums.find(c => c.name === key);
-        const object = colEnum.enum.find(item => item.value === record[key]);
-        selected.value[index][key] = object ? record[key] : null;
-      } else {
-        selected.value[index][key] = record[key];
+function applyJobResult(record: RecordState, job: any, actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
+  if (actionType === 'generate_images') {
+    for (const fieldName of props.meta.outputImageFields || []) {
+      const resultValue = job?.result?.[fieldName];
+      if (resultValue !== undefined) {
+        record.data[fieldName] = resultValue;
+      }
+      record.carouselSaveImages[fieldName] = resultValue ? [resultValue] : [];
+      if (job?.recordMeta?.[`${fieldName}_meta`]) {
+        record.carouselSaveImages[fieldName] = [job.recordMeta[`${fieldName}_meta`].originalImage];
+        record.listOfImageNotGenerated[fieldName] = job.recordMeta[`${fieldName}_meta`];
       }
     }
-    selected.value[index].isChecked = true;
-    selected.value[index][primaryKey] = record[primaryKey];
-    oldData.value[index] = { ...selected.value[index] };
-  });
+  } else {
+    record.data = {
+      ...record.data,
+      ...(job?.result || {}),
+    };
+  }
 }
 
-function isInColumnEnum(key: string): boolean {
-  const colEnum = props.meta.columnEnums?.find(c => c.name === key);
-  if (!colEnum) {
-    return false;
+function applyJobFailure(record: RecordState, job: any, actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
+  adminforth.alert({
+    message: t(`Generation action "${actionType.replace('_', ' ')}" failed for record: ${record.id}. Error: ${job?.error || 'Unknown error'}`),
+    variant: 'danger',
+    timeout: 'unlimited',
+  });
+  if (actionType === 'generate_images') {
+    record.imageGenerationFailed = true;
+    record.imageGenerationErrorMessage = job?.error || 'Unknown error';
+  } else if (actionType === 'analyze') {
+    for (const field of Object.keys(props.meta.outputFieldsForAnalizeFromImages || {})) {
+      record.imageToTextErrorMessages[props.meta.outputFieldsForAnalizeFromImages[field]] = job?.error || 'Unknown error';
+    }
+  } else if (actionType === 'analyze_no_images') {
+    for (const field of Object.keys(props.meta.outputPlainFields || {})) {
+      record.textToTextErrorMessages[props.meta.outputPlainFields[field]] = job?.error || 'Unknown error';
+    }
   }
-  return true;
 }
 
-function handleTableError(errorData) {
-  isError.value = errorData.isError;
-  errorMessage.value = errorData.errorMessage;
+async function waitForRefresh(actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
+  if (actionType === 'generate_images') {
+    await new Promise(resolve => setTimeout(resolve, props.meta.refreshRates?.generateImages));
+  } else if (actionType === 'analyze') {
+    await new Promise(resolve => setTimeout(resolve, props.meta.refreshRates?.fillFieldsFromImages));
+  } else if (actionType === 'analyze_no_images') {
+    await new Promise(resolve => setTimeout(resolve, props.meta.refreshRates?.fillPlainFields));
+  }
 }
 
-async function getRecords() {
+async function fetchOldData(recordId: string) {
   try {
     const res = await callAdminForthApi({
-      path: `/plugin/${props.meta.pluginInstanceId}/get_records`,
+      path: `/plugin/${props.meta.pluginInstanceId}/get_old_data`,
       method: 'POST',
-      body: {
-        record: props.checkboxes,
-      },
+      body: { recordId },
+      silentError: true,
     });
-    records.value = res.records;
+    if (!res?.ok || !res?.record) {
+      adminforth.alert({
+        message: res?.error || t('Failed to fetch old data. Please, try to re-run the action.'),
+        variant: 'danger',
+        timeout: 'unlimited',
+      });
+      return null;
+    }
+    return res.record;
   } catch (error) {
-    console.error('Failed to get records:', error);
+    console.error('Failed to get old record:', error);
     isError.value = true;
     errorMessage.value = t(`Failed to fetch records. Please, try to re-run the action.`);
+    return null;
   }
 }
 
-async function getImages() {
+function initializeRecordData(record: RecordState, oldRecord: Record<string, any>) {
+  const newData: Record<string, any> = {};
+  const newOldData: Record<string, any> = {};
+  for (const key in props.meta.outputFields || {}) {
+    const normalizedValue = normalizeEnumValue(key, oldRecord[key] ?? null);
+    newData[key] = normalizedValue;
+    newOldData[key] = normalizedValue;
+  }
+  if (props.meta.outputImageFields) {
+    for (const key of props.meta.outputImageFields) {
+      const normalizedValue = normalizeEnumValue(key, oldRecord[key] ?? null);
+      newData[key] = normalizedValue;
+      newOldData[key] = normalizedValue;
+    }
+  }
+  newData[primaryKey] = oldRecord[primaryKey] ?? record.id;
+  newOldData[primaryKey] = oldRecord[primaryKey] ?? record.id;
+  newOldData._label = oldRecord._label;
+  record.data = newData;
+  record.oldData = newOldData;
+}
+
+function normalizeEnumValue(key: string, value: any) {
+  const colEnum = props.meta.columnEnums?.find(c => c.name === key);
+  if (!colEnum) {
+    return value;
+  }
+  const match = colEnum.enum.find(item => item.value === value);
+  return match ? value : null;
+}
+
+async function fetchImages(record: RecordState, oldRecord: Record<string, any>) {
   try {
     const res = await callAdminForthApi({
       path: `/plugin/${props.meta.pluginInstanceId}/get_images`,
       method: 'POST',
       body: {
-        record: records.value,
+        record: [oldRecord],
       },
     });
-    images.value = res.images;
+    record.images = res.images?.[0] || [];
   } catch (error) {
     console.error('Failed to get images:', error);
     isError.value = true;
@@ -481,33 +608,64 @@ async function getImages() {
   }
 }
 
-async function prepareDataForSave() {
-  const checkedItems = selected.value
-    .filter(item => item.isChecked === true)
-    .map(item => {
-      const { isChecked, primaryKey, ...itemWithoutIsCheckedAndId } = item;
-      return itemWithoutIsCheckedAndId;
+function formatLabel(str) {
+  const labelsMap = props.meta?.columnLabels || {};
+  let labelFromMeta = labelsMap[str];
+  if (!labelFromMeta) {
+    const match = Object.keys(labelsMap).find(k => k.toLowerCase() === String(str).toLowerCase());
+    if (match) labelFromMeta = labelsMap[match];
+  }
+  if (labelFromMeta) return labelFromMeta;
+  return str
+    .split('_')                   
+    .map(word => word.charAt(0).toUpperCase() + word.slice(1))
+    .join(' ');      
+}
+
+function generateTableHeaders(outputFields) {
+  const headers = [];
+
+  headers.push({ label: 'Checkboxes', fieldName: 'checkboxes' });
+  headers.push({ label: 'Field name', fieldName: 'label' });
+  if (props.meta.isAttachFiles) {
+    headers.push({ label: 'Source Images', fieldName: 'images' });
+  }
+  for (const key in outputFields) {
+    headers.push({
+      label: formatLabel(key),
+      fieldName: key,
     });
-  const checkedItemsIDs = selected.value
-    .filter(item => item.isChecked === true)
-    .map(item => item[primaryKey]);
-
-  if (isImageGenerationError.value !== true) {
-    const promises = [];
-    for (const item of checkedItems) {
-      for (const [key, value] of Object.entries(item)) {
-        if(props.meta.outputImageFields?.includes(key)) {
-          const p = convertImages(key, value).then(result => {
-            item[key] = result;
-          });
-        
-          promises.push(p);
-        }
+  }
+  return headers;
+}
+function handleTableError(errorData) {
+  isError.value = errorData.isError;
+  errorMessage.value = errorData.errorMessage;
+}
+async function prepareDataForSave() {
+  const checkedRecords = globalState.records.filter(record => record.isChecked);
+  const checkedItems = checkedRecords.map(record => ({
+    ...record.data,
+    [primaryKey]: record.id,
+  }));
+
+  const promises: Promise<void>[] = [];
+  checkedRecords.forEach((record, index) => {
+    if (record.imageGenerationFailed) {
+      return;
+    }
+    for (const [key, value] of Object.entries(checkedItems[index])) {
+      if (props.meta.outputImageFields?.includes(key)) {
+        const p = convertImages(key, value).then(result => {
+          checkedItems[index][key] = result;
+        });
+        promises.push(p);
       }
     }
-    await Promise.all(promises);
-  }
-  return [checkedItemsIDs, checkedItems];
+  });
+
+  await Promise.all(promises);
+  return [checkedItems, checkedRecords] as const;
 }
 
 async function convertImages(fieldName, img) {
@@ -532,36 +690,32 @@ async function convertImages(fieldName, img) {
 
 
 async function saveData() {
-  if (!selected.value?.length) {
+  if (checkedCount.value < 1) {
     adminforth.alert({ message: t('No items selected'), variant: 'warning' });
     return;
   }
   try {
     isLoading.value = true;
-    const [checkedItemsIDs, reqData] = await prepareDataForSave();
-    if (isImageGenerationError.value === false) {
+  const [reqData, checkedRecords] = await prepareDataForSave();
+    if (!checkedRecords.some(record => record.imageGenerationFailed)) {
       const imagesToUpload = [];
-      for (const item of reqData) {
+      for (const [index, item] of reqData.entries()) {
+        const record = checkedRecords[index];
         for (const [key, value] of Object.entries(item)) {
-          if(props.meta.outputImageFields?.includes(key)) {
+          if (props.meta.outputImageFields?.includes(key)) {
             if (!value) {
               continue;
             }
             if (!overwriteExistingValues.value) {
-              const imageURL = selected.value.find(rec => rec[primaryKey] === item[primaryKey])[key];
-              let originalImageUrl = ''
-              try {
-                originalImageUrl = listOfImageThatWasNotGeneratedPerRecord.value[item[primaryKey]][key].originalImage;
-              } catch (error) {
-                originalImageUrl = '';
-              }
+              const imageURL = record.data[key];
+              const originalImageUrl = record.listOfImageNotGenerated?.[key]?.originalImage || '';
               if (originalImageUrl === imageURL) {
-                reqData.find(rec => rec[primaryKey] === item[primaryKey])[key] = undefined;
+                reqData[index][key] = undefined;
                 continue;
               }
             }
-            const p = uploadImage(value, item[primaryKey], key).then(result => {
-              item[key] = result;
+            const p = uploadImage(value, record.id, key).then(result => {
+              reqData[index][key] = result;
             });
             imagesToUpload.push(p);
           }
@@ -569,30 +723,38 @@ async function saveData() {
       }
       await Promise.all(imagesToUpload);
     }
-    const res = await callAdminForthApi({
-      path: `/plugin/${props.meta.pluginInstanceId}/update_fields`,
-      method: 'POST',
-      body: {
-        selectedIds: checkedItemsIDs,
-        fields: reqData,
-        saveImages: !isImageGenerationError.value
-      },
-    });
+    const limit = pLimit(props.meta.concurrencyLimit || 10);
+    const saveTasks = checkedRecords.map((record, index) =>
+      limit(async () => {
+        return await callAdminForthApi({
+          path: `/plugin/${props.meta.pluginInstanceId}/update_fields`,
+          method: 'POST',
+          body: {
+            selectedIds: [record.id],
+            fields: [reqData[index]],
+            saveImages: !record.imageGenerationFailed,
+          },
+        });
+      })
+    );
 
-    if(res.ok === true) {
+    const saveResults = await Promise.all(saveTasks);
+    const failedResult = saveResults.find(res => res?.ok === false || res?.error);
+
+    if (!failedResult) {
       confirmDialog.value.close();
       props.updateList();
-      props.clearCheckboxes();
-    } else if (res.ok === false) {
+      props.clearCheckboxes?.();
+    } else if (failedResult.ok === false) {
       adminforth.alert({
-        message: res.error,
+        message: failedResult.error,
         variant: 'danger',
         timeout: 'unlimited',
       });
       isError.value = true;
       errorMessage.value = t(`Failed to save data. You are not allowed to save.`);
     } else {
-      console.error('Error saving data:', res);
+      console.error('Error saving data:', failedResult);
       isError.value = true;
       errorMessage.value = t(`Failed to save data. Please, try to re-run the action.`);
     }
@@ -606,250 +768,6 @@ async function saveData() {
     window.removeEventListener('beforeunload', beforeUnloadHandler);
   }
 }
-
-
-async function runAiAction({
-  endpoint,
-  actionType,
-  responseFlag,
-  updateOnSuccess = true,
-  recordsIds = props.checkboxes,
-  disableRateLimitCheck = false,
-}: {
-  endpoint: string;
-  actionType: 'analyze' | 'analyze_no_images' | 'generate_images';
-  responseFlag: Ref<boolean[]>;
-  updateOnSuccess?: boolean;
-  recordsIds?: any[];
-  disableRateLimitCheck?: boolean;
-}) {
-  let hasError = false;
-  let errorMessage = '';
-  const jobsIds: { jobId: any; recordId: any; }[] = [];
-  // responseFlag.value = props.checkboxes.map(() => false);
-  for (let i = 0; i < recordsIds.length; i++) {
-    const index = props.checkboxes.findIndex(item => String(item) === String(recordsIds[i]));
-    if (index !== -1) {
-      responseFlag.value[index] = false;
-    }
-  }
-  let isRateLimitExceeded = false;
-  if (!disableRateLimitCheck){
-    try {
-      const rateLimitRes = await callAdminForthApi({
-        path: `/plugin/${props.meta.pluginInstanceId}/update-rate-limits`,
-        method: 'POST',
-        body: {
-          actionType: actionType,
-        },
-      });
-      if (rateLimitRes?.error) {
-        isRateLimitExceeded = true;
-        adminforth.alert({
-        message: t(`Rate limit exceeded for "${actionType.replace('_', ' ')}" action. Please try again later.`),
-        variant: 'danger',
-        timeout: 'unlimited',
-      });
-        return;
-      }
-    } catch (e) {
-      adminforth.alert({
-        message: t(`Error checking rate limit for "${actionType.replace('_', ' ')}" action.`),
-        variant: 'danger',
-        timeout: 'unlimited',
-      });
-      isRateLimitExceeded = true;
-    }
-    if (isRateLimitExceeded) {
-      return;
-    };
-  }
-
-  let customPrompt;
-  if (actionType === 'generate_images') {
-    customPrompt = generationPrompts.value.imageGenerationPrompts || generationPrompts.value.generateImages;
-  } else if (actionType === 'analyze') {
-    customPrompt = generationPrompts.value.imageFieldsPrompts;
-  } else if (actionType === 'analyze_no_images') {
-    customPrompt = generationPrompts.value.plainFieldsPrompts;
-  }
-  //creating jobs
-  const tasks = recordsIds.map(async (checkbox, i) => {
-    try {
-      const res = await callAdminForthApi({
-        path: `/plugin/${props.meta.pluginInstanceId}/create-job`,
-        method: 'POST',
-        body: {
-          actionType: actionType,
-          recordId: checkbox,
-          ...(customPrompt !== undefined ? { customPrompt: JSON.stringify(customPrompt) } : {}),
-          filterFilledFields: !overwriteExistingValues.value,
-        },
-        silentError: true,
-      });
-
-      if (res?.error) {
-        throw new Error(res.error);
-      }
-      
-      if (!res) {
-        throw new Error(`${actionType} request returned empty response.`);
-      }
-
-      jobsIds.push({ jobId: res.jobId, recordId: checkbox });
-    } catch (e) {
-      console.error(`Error during ${actionType} for item ${i}:`, e);
-      hasError = true;
-      errorMessage = t(`Failed to ${actionType.replace('_', ' ')}. Please, try to re-run the action.`);
-      return { success: false, index: i, error: e };
-    }
-  });
-  await Promise.all(tasks);
-
-  //polling jobs
-  let isInProgress = true;
-  //if no jobs were created, skip polling
-  while (isInProgress && isDialogOpen.value) {
-    //check if at least one job is still in progress
-    let isAtLeastOneInProgress = false;
-    //checking status of each job
-    for (const { jobId, recordId } of jobsIds) {
-      //check job status
-      const jobResponse = await callAdminForthApi({
-        path: `/plugin/${props.meta.pluginInstanceId}/get-job-status`,
-        method: 'POST',
-        body: { jobId },
-        silentError: true,
-      });
-      //check for errors
-      if (!jobResponse) {
-        isAtLeastOneInProgress = true;
-        continue;
-      }
-      if (jobResponse?.error) {
-        console.error(`Error during ${actionType}:`, jobResponse.error);
-        break;
-      };
-      // extract job status
-      let jobStatus = jobResponse?.job?.status;
-      // check if job is still in progress. If in progress - skip to next job
-      if (jobStatus === 'in_progress') {
-        isAtLeastOneInProgress = true;
-      //if job is completed - update record data
-      } else if (jobStatus === 'completed') {
-        // finding index of the record in selected array
-        const index = selected.value.findIndex(item => String(item[primaryKey]) === String(recordId));
-        //if we are generating images - update carouselSaveImages with new image
-        if (actionType === 'generate_images') {
-          for (const [key, value] of Object.entries(carouselSaveImages.value[index])) {
-            if (props.meta.outputImageFields?.includes(key)) {
-              carouselSaveImages.value[index][key] = [jobResponse.job.result[key]];
-              if (jobResponse.job.recordMeta?.[`${key}_meta`]) {
-                carouselSaveImages.value[index][key] = [jobResponse.job.recordMeta[`${key}_meta`].originalImage];
-                if (!listOfImageThatWasNotGeneratedPerRecord.value[recordId]) {
-                  listOfImageThatWasNotGeneratedPerRecord.value[recordId] = [];
-                }
-                listOfImageThatWasNotGeneratedPerRecord.value[recordId][key] = jobResponse.job.recordMeta[`${key}_meta`];
-              }
-            } 
-          }
-        }
-        //marking that we received response for this record
-        //if (actionType !== 'analyze_no_images' || !props.meta.isFieldsForAnalizeFromImages) {
-          responseFlag.value[index] = true;
-        //}
-        //updating selected with new data from AI
-        const pk = selected.value[index]?.[primaryKey];
-        if (pk) {
-          selected.value[index] = {
-            ...selected.value[index],
-            ...jobResponse.job.result,
-            isChecked: true,
-            [primaryKey]: pk,
-          };
-        }
-        //removing job from jobsIds
-        if (index !== -1) {
-          jobsIds.splice(jobsIds.findIndex(j => j.jobId === jobId), 1);
-        }
-        // checking one more time if we have in progress jobs
-        isAtLeastOneInProgress = true;
-        // if job is failed - set error
-      } else if (jobStatus === 'failed') {
-        const index = selected.value.findIndex(item => String(item[primaryKey]) === String(recordId));
-        //if (actionType !== 'analyze_no_images' || !props.meta.isFieldsForAnalizeFromImages) {
-          responseFlag.value[index] = true;
-        //}
-        if (index !== -1) {
-          jobsIds.splice(jobsIds.findIndex(j => j.jobId === jobId), 1);
-        } else {
-          jobsIds.splice(0, jobsIds.length);
-        }
-        isAtLeastOneInProgress = true;
-        adminforth.alert({
-          message: t(`Generation action "${actionType.replace('_', ' ')}" failed for record: ${recordId}. Error: ${jobResponse.job?.error || 'Unknown error'}`),
-          variant: 'danger',
-          timeout: 'unlimited',
-        });
-        if (actionType === 'generate_images') {
-          isAiImageGenerationError.value[index] = true;
-          imageGenerationErrorMessage.value[index] = jobResponse.job?.error || 'Unknown error';
-        } else if (actionType === 'analyze') {
-          for (const field of Object.keys(props.meta.outputFieldsForAnalizeFromImages ) ) {
-            if (!imageToTextErrorMessages.value[index]) {
-              imageToTextErrorMessages.value[index] = {};
-            }
-            imageToTextErrorMessages.value[index][props.meta.outputFieldsForAnalizeFromImages[field]] = jobResponse.job?.error || 'Unknown error';
-          }
-        } else if (actionType === 'analyze_no_images') {
-          for( const field of Object.keys(props.meta.outputPlainFields ) ) {
-            if (!textToTextErrorMessages.value[index]) {
-              textToTextErrorMessages.value[index] = {};
-            }
-            textToTextErrorMessages.value[index][props.meta.outputPlainFields[field]] = jobResponse.job?.error || 'Unknown error';
-          }
-        }
-      }
-    }
-    if (!isAtLeastOneInProgress) {
-      isInProgress = false;
-    }
-    if (jobsIds.length > 0) {
-      if (actionType === 'generate_images') {
-        await new Promise(resolve => setTimeout(resolve, props.meta.refreshRates?.generateImages));
-      } else if (actionType === 'analyze') {
-        await new Promise(resolve => setTimeout(resolve, props.meta.refreshRates?.fillFieldsFromImages));
-      } else if (actionType === 'analyze_no_images') {
-        await new Promise(resolve => setTimeout(resolve, props.meta.refreshRates?.fillPlainFields));
-      } else {
-        await new Promise(resolve => setTimeout(resolve, 2000));
-      }
-    }
-  }
-
-  if (hasError) {
-    adminforth.alert({
-      message: errorMessage,
-      variant: 'danger',
-      timeout: 'unlimited',
-    });
-    isError.value = true;
-    if (actionType === 'generate_images') {
-      isImageGenerationError.value = true;
-    }
-    this.errorMessage.value = errorMessage;
-    return;
-  }
-
-  if (actionType === 'generate_images') {
-    isGeneratingImages.value = false;
-  } else if (actionType === 'analyze') {
-    isAnalizingImages.value = false;
-  } else if (actionType === 'analyze_no_images') {
-    isAnalizingFields.value = false;
-  }
-}
-
 async function uploadImage(imgBlob, id, fieldName) {
   const file = new File([imgBlob], `generated_${fieldName}_${id}.${imgBlob.type.split('/').pop()}`, { type: imgBlob.type });
   const { name, size, type } = file;
@@ -921,7 +839,7 @@ async function uploadImage(imgBlob, id, fieldName) {
   }
 }
 
-function regenerateImages(recordInfo: any) {
+function regenerateImages({ recordId }: { recordId: any }) {
   if (coreStore.isInternetError) {
     adminforth.alert({
       message: t('Cannot regenerate images while internet connection is lost. Please check your connection and try again.'),
@@ -930,13 +848,13 @@ function regenerateImages(recordInfo: any) {
     });
     return;
   }
-  isGeneratingImages.value = true;
-  runAiAction({
-    endpoint: 'initial_image_generate',
-    actionType: 'generate_images',
-    responseFlag: isAiResponseReceivedImage,
-    recordsIds: [recordInfo.recordInfo],
-    disableRateLimitCheck: true,
+  const record = globalState.recordsById[String(recordId)];
+  if (!record) {
+    return;
+  }
+  record.aiStatus.generatedImages = false;
+  runActionForRecord(record, 'generate_images').catch(() => {
+    record.aiStatus.generatedImages = true;
   });
 }
 
@@ -1078,10 +996,14 @@ async function regenerateCell(recordInfo: any) {
     });
     return;
   }
-  if (!regeneratingFieldsStatus.value[recordInfo.recordId]) {
-    regeneratingFieldsStatus.value[recordInfo.recordId] = {};
+  const record = globalState.recordsById[String(recordInfo.recordId)];
+  if (!record) {
+    return;
+  }
+  if (!record.regeneratingFieldsStatus[recordInfo.fieldName]) {
+    record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
   }
-  regeneratingFieldsStatus.value[recordInfo.recordId][recordInfo.fieldName] = true;
+  record.regeneratingFieldsStatus[recordInfo.fieldName] = true;
   const actionType = props.meta.outputFieldsForAnalizeFromImages?.includes(recordInfo.fieldName)
     ? 'analyze'
     : props.meta.outputPlainFields?.includes(recordInfo.fieldName)
@@ -1089,16 +1011,17 @@ async function regenerateCell(recordInfo: any) {
       : null;
   if (!actionType) {
     console.error(`Field ${recordInfo.fieldName} is not configured for analysis.`);
+    record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
     return;
   }
   
   let generationPromptsForField = {};
   if (actionType === 'analyze') {
     generationPromptsForField = generationPrompts.value.imageFieldsPrompts || {};
-    isAnalizingFields.value = true;
+    record.aiStatus.analyzedImages = false;
   } else if (actionType === 'analyze_no_images') {
     generationPromptsForField = generationPrompts.value.plainFieldsPrompts || {};
-    isAnalizingImages.value = true;
+    record.aiStatus.analyzedNoImages = false;
   }
   
   let jobId;
@@ -1117,7 +1040,7 @@ async function regenerateCell(recordInfo: any) {
       silentError: true,
     });
   } catch (e) {
-    regeneratingFieldsStatus.value[recordInfo.recordId][recordInfo.fieldName] = false;
+    record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
     console.error(`Error during cell regeneration for record ${recordInfo.recordId}, field ${recordInfo.fieldName}:`, e);
   }
   if ( res.ok === false) {
@@ -1127,7 +1050,7 @@ async function regenerateCell(recordInfo: any) {
     });
     isError.value = true;
     errorMessage.value = t(`Failed to regenerate field`);
-    regeneratingFieldsStatus.value[recordInfo.recordId][recordInfo.fieldName] = false;
+    record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
     return;
   }
   jobId = res.jobId;
@@ -1152,38 +1075,27 @@ async function regenerateCell(recordInfo: any) {
       timeout: 'unlimited',
     });
     if (actionType === 'analyze') {
-      imageToTextErrorMessages.value[recordInfo.recordId][recordInfo.fieldName] = res.job?.error || 'Unknown error';
-      isAnalizingFields.value = false;
+      record.imageToTextErrorMessages[recordInfo.fieldName] = res.job?.error || 'Unknown error';
+      record.aiStatus.analyzedImages = true;
     } else if (actionType === 'analyze_no_images') {
-      textToTextErrorMessages.value[recordInfo.recordId][recordInfo.fieldName] = res.job?.error || 'Unknown error';
-      isAnalizingImages.value = false;
+      record.textToTextErrorMessages[recordInfo.fieldName] = res.job?.error || 'Unknown error';
+      record.aiStatus.analyzedNoImages = true;
     }
-    regeneratingFieldsStatus.value[recordInfo.recordId][recordInfo.fieldName] = false;
+    record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
     return;
   } else if (res.job?.status === 'completed') {
-    const index = selected.value.findIndex(item => String(item[primaryKey]) === String(recordInfo.recordId));
-
-    const pk = selected.value[index]?.[primaryKey];
-    if (pk) {
-      selected.value[index] = {
-        ...selected.value[index],
-        ...res.job.result,
-        isChecked: true,
-        [primaryKey]: pk,
-      };
-    }
+    record.data = {
+      ...record.data,
+      ...res.job.result,
+    };
     if (actionType === 'analyze') {
-      if (imageToTextErrorMessages.value[index]) {
-        imageToTextErrorMessages.value[index][recordInfo.fieldName] = '';
-      }
-      isAnalizingFields.value = false;
+      record.imageToTextErrorMessages[recordInfo.fieldName] = '';
+      record.aiStatus.analyzedImages = true;
     } else if (actionType === 'analyze_no_images') {
-      if (textToTextErrorMessages.value[index]) {
-        textToTextErrorMessages.value[index][recordInfo.fieldName] = '';
-      }
-      isAnalizingImages.value = false;
+      record.textToTextErrorMessages[recordInfo.fieldName] = '';
+      record.aiStatus.analyzedNoImages = true;
     }
-    regeneratingFieldsStatus.value[recordInfo.recordId][recordInfo.fieldName] = false;
+    record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
   }
 }
 
diff --git a/custom/VisionTable.vue b/custom/VisionTable.vue
index e77671e..436147c 100644
--- a/custom/VisionTable.vue
+++ b/custom/VisionTable.vue
@@ -1,8 +1,8 @@
 <template>
     <Table
       :columns="tableHeaders"
-      :data="tableColumns"
-      :pageSize="6"
+      :data="tableDataProvider"
+      :pageSize="pageSize"
       makeHeaderSticky
       makePaginationSticky
       >
@@ -14,7 +14,7 @@
       <template #cell:checkboxes="{ item }">
         <div class="max-w-[100px] flex items-center justify-center">
           <Checkbox
-            v-model="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])].isChecked"
+            v-model="item.isChecked"
           />
         </div>
       </template>
@@ -55,8 +55,8 @@
         </div>
       </template>
       <!-- CUSTOM FIELD TEMPLATES -->
-      <template v-for="n in customFieldNames" :key="n" #[`cell:${n}`]="{ item, column }">
-        <div v-if="(isAnalyzing(item, n) && !(props.regeneratingFieldsStatus[item[props.primaryKey]] && props.regeneratingFieldsStatus[item[props.primaryKey]][n])) && !isInColumnImage(n)" @mouseenter="(() => { hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = true})" @mouseleave="(() => { hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = false})">
+      <template v-for="n in customFieldNames" :key="n" #[`cell:${n}`]="{ item }">
+        <div v-if="(isAnalyzing(item, n) && !item.regeneratingFieldsStatus?.[n]) && !isInColumnImage(n)" @mouseenter="(() => { setHover(item.id, n, true) })" @mouseleave="(() => { setHover(item.id, n, false) })">
           <div class="flex gap-1 justify-end">
             <Tooltip v-if="checkForError(item, n)">
               <IconExclamationCircleSolid class="my-2 w-5 h-5 text-red-500" />
@@ -75,143 +75,143 @@
               <Select
                 class="min-w-[150px]"
                 :options="convertColumnEnumToSelectOptions(props.meta.columnEnums, n)"
-                v-model="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+                v-model="item.data[n]"
                 :teleportToTop="true"
                 :teleportToBody="false"
               >
               </Select>
               <Tooltip>
-                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] }">
+                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !isHovered(item.id, n) }">
                   <p class="text-sm ">{{ $t('old value') }}</p>
                 </div>
                 <template #tooltip>
-                  {{  oldData[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] ?? "No old value" }}
+                  {{  item.oldData?.[n] ?? "No old value" }}
                 </template>
               </Tooltip>
           </div>
-            <div v-else-if="typeof selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] === 'string' || typeof selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] === 'object'" class="flex flex-col items-start justify-end min-h-[90px]">
+            <div v-else-if="typeof item.data?.[n] === 'string' || typeof item.data?.[n] === 'object'" class="flex flex-col items-start justify-end min-h-[90px]">
             <Textarea
               class="min-w-[150px] h-full"
               type="text"
-              v-model="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+              v-model="item.data[n]"
             >
             </Textarea>
             <Tooltip>
-                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] }">
+                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !isHovered(item.id, n) }">
                   <p class="text-sm ">{{ $t('old value') }}</p>
                 </div>
               <template #tooltip>
-                <p class="max-w-[200px]">{{  oldData[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] ?? "No old value" }}</p>
+                <p class="max-w-[200px]">{{  item.oldData?.[n] ?? "No old value" }}</p>
               </template>
             </Tooltip>
             </div>
-          <div v-else-if="typeof selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] === 'boolean'" class="flex flex-col items-center justify-end min-h-[90px]">
+          <div v-else-if="typeof item.data?.[n] === 'boolean'" class="flex flex-col items-center justify-end min-h-[90px]">
             <Toggle
               class="p-2"
-              v-model="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+              v-model="item.data[n]"
             >
             </Toggle>
             <Tooltip>
-                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] }">
+                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !isHovered(item.id, n) }">
                   <p class="text-sm ">{{ $t('old value') }}</p>
                 </div>
               <template #tooltip>
-                {{  oldData[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] ?? "No old value" }}
+                {{  item.oldData?.[n] ?? "No old value" }}
               </template>
             </Tooltip>
           </div>
           <div v-else class="flex flex-col items-start justify-end min-h-[90px]">
             <Input
               type="number"
-              v-model="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+              v-model="item.data[n]"
               class="w-full min-w-[80px]"
               :fullWidth="true"
             />
             <Tooltip>
-                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] }">
+                <div class="mt-2 flex items-center justify-start gap-1 hover:text-blue-500" :class="{ 'opacity-0': !isHovered(item.id, n) }">
                   <p class="text-sm ">{{ $t('old value') }}</p>
                 </div>
               <template #tooltip>
-                {{  oldData[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] ?? "No old value" }}
+                {{  item.oldData?.[n] ?? "No old value" }}
               </template>
             </Tooltip>
           </div>
         </div>
 
-        <div v-if="isAiResponseReceivedImage[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])]" @mouseenter="(() => { hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = true})" @mouseleave="(() => { hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = false})">
+        <div v-if="item.aiStatus.generatedImages" @mouseenter="(() => { setHover(item.id, n, true) })" @mouseleave="(() => { setHover(item.id, n, false) })">
           <div v-if="isInColumnImage(n)">
             <div class="mt-2 mb-2 flex items-center justify-start gap-2">
-              <div v-if="isValidUrl(selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n])" class="flex flex-col items-center relative">
+              <div v-if="isValidUrl(item.data?.[n])" class="flex flex-col items-center relative">
               <img 
-                :src="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+                :src="item.data?.[n]"
                 class="w-20 h-20 object-cover rounded cursor-pointer border hover:border-blue-500 transition"
-                @click="() => {openGenerationCarousel[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = true}"
+                @click="() => {item.openGenerationCarousel[n] = true}"
               />
               <p
                 v-if="isImageHasPreviewUrl[n]"
                 class="absolute mt-20 text-sm hover:text-blue-500 hover:underline hover:cursor-pointer flex items-center gap-1"
-                :class="{ 'opacity-0': !hovers[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] }"
-                @click="() => {openImageCompare[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = true}"  
+                :class="{ 'opacity-0': !isHovered(item.id, n) }"
+                @click="() => {item.openImageCompare[n] = true}"  
               >
                 {{ $t('old image') }}
               </p>
               </div>
               <div v-else class="flex items-center justify-center text-center w-20 h-20">
-                <Tooltip v-if="imageGenerationErrorMessage[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])] === 'No source images found'">
+                <Tooltip v-if="item.imageGenerationErrorMessage === 'No source images found'">
                   <p
                   >
                     {{ $t("Can't generate image.") }}
                   </p>
                   <template #tooltip>
-                    {{ imageGenerationErrorMessage[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])] }}
+                    {{ item.imageGenerationErrorMessage }}
                   </template>
                 </Tooltip>
                 <Tooltip v-else>
                   <div>
                     <IconRefreshOutline
-                      @click="() => {regenerateImages(item[primaryKey])}"
+                      @click="() => {regenerateImages(item.id)}"
                       class="w-20 h-20 hover:text-blue-500 cursor-pointer transition hover:scale-105"
                     />
                   </div>
                   <template #tooltip>
-                    {{ imageGenerationErrorMessage[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])] + '. Click to retry.' }}
+                    {{ item.imageGenerationErrorMessage + '. Click to retry.' }}
                   </template>
                 </Tooltip>
               </div>
             </div>
             <div>
               <GenerationCarousel
-                v-if="openGenerationCarousel[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
-                :images="carouselSaveImages[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
-                :recordId="item[primaryKey]"
+                v-if="item.openGenerationCarousel[n]"
+                :images="item.carouselSaveImages[n]"
+                :recordId="item.id"
                 :meta="props.meta"
                 :fieldName="n"
-                :carouselImageIndex="carouselImageIndex[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+                :carouselImageIndex="item.carouselImageIndex[n]"
                 :regenerateImagesRefreshRate="regenerateImagesRefreshRate"
                 :sourceImage="item.images && item.images.length ? item.images : null"
                 :imageGenerationPrompts="imageGenerationPrompts[n]"
                 @error="handleError"
-                @close="openGenerationCarousel[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = false"
+                @close="item.openGenerationCarousel[n] = false"
                 @selectImage="updateSelectedImage"
                 @updateCarouselIndex="updateActiveIndex"
               />
               <ImageCompare
-                v-if="openImageCompare[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
+                v-if="item.openImageCompare[n]"
                 :meta="props.meta"
                 :columnName="n"
-                :oldImage="oldData[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
-                :newImage="selected[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n]"
-                @close="openImageCompare[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])][n] = false"
+                :oldImage="item.oldData?.[n]"
+                :newImage="item.data?.[n]"
+                @close="item.openImageCompare[n] = false"
               />
             </div>
           </div>
         </div>
 
-        <div v-if="!isAiResponseReceivedImage[tableColumnsIndexes.findIndex(el => el[primaryKey] === item[primaryKey])] && isInColumnImage(n)">
+        <div v-if="!item.aiStatus.generatedImages && isInColumnImage(n)">
             <Skeleton type="image" class="w-20 h-20" />
         </div>
 
-        <div v-if="(!isAnalyzing(item, n) || (props.regeneratingFieldsStatus[item[props.primaryKey]] && props.regeneratingFieldsStatus[item[props.primaryKey]][n])) && !isInColumnImage(n)">
+        <div v-if="(!isAnalyzing(item, n) || item.regeneratingFieldsStatus?.[n]) && !isInColumnImage(n)">
           <Skeleton class="w-full h-6" />
         </div>
       </template>
@@ -219,7 +219,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, watch, onMounted } from 'vue'
+import { ref, watch, computed, reactive } from 'vue'
 import { Select, Input, Textarea, Table, Checkbox, Skeleton, Toggle, Tooltip } from '@/afcl'
 import GenerationCarousel from './ImageGenerationCarousel.vue'
 import ImageCompare from './ImageCompare.vue';
@@ -228,48 +228,38 @@ import { IconRefreshOutline, IconExclamationCircleSolid } from '@iconify-prerend
 const props = defineProps<{
   meta: any,
   tableHeaders: any,
-  tableColumns: any,
+  records: any[],
   customFieldNames: any,
-  tableColumnsIndexes: any,
-  selected: any,
-  isAiResponseReceivedAnalizeImage: boolean[],
-  isAiResponseReceivedAnalizeNoImage: boolean[],
-  isAiResponseReceivedImage: boolean[],
-  primaryKey: any,
-  openGenerationCarousel: any,
-  openImageCompare: any,
   isError: boolean,
   errorMessage: string
-  carouselSaveImages: any[]
-  carouselImageIndex: any[]
   regenerateImagesRefreshRate: number
-  isAiGenerationError: boolean[],
-  aiGenerationErrorMessage: string[],
-  isAiImageGenerationError: boolean[],
-  imageGenerationErrorMessage: string[],
-  oldData: any[],
   isImageHasPreviewUrl: Record<string, boolean>
   imageGenerationPrompts: Record<string, any>
-  isImageToTextGenerationError: boolean[],
-  imageToTextErrorMessages: Record<string, string>[],
-  isTextToTextGenerationError: boolean[],
-  textToTextErrorMessages: Record<string, string>[],
   outputImageFields: string[],
   outputFieldsForAnalizeFromImages: string[],
   outputPlainFields: string[],
-  regeneratingFieldsStatus: Record<string, Record<string, boolean>>
 }>();
 const emit = defineEmits(['error', 'regenerateImages', 'regenerateCell']);
 
-
+const pageSize = 6;
+const pagination = reactive({ offset: 0, limit: pageSize });
 const zoomedImage = ref(null);
-const hovers = ref<{ [key: string]: boolean }[]>([]);
+const hovers = ref<Record<string, Record<string, boolean>>>({});
 
-watch(() => props.tableColumnsIndexes, (newVal) => {
-  if (newVal) {
-    hovers.value = newVal.map(() => ({}));
-  }
-}, { immediate: true });
+const paginatedRecords = computed(() => props.records.slice(pagination.offset, pagination.offset + pagination.limit));
+
+const tableDataProvider = async ({ offset, limit }) => {
+  pagination.offset = offset;
+  pagination.limit = limit;
+  return {
+    data: paginatedRecords.value,
+    total: props.records.length,
+  };
+};
+
+watch(() => props.records, (newVal) => {
+  hovers.value = Object.fromEntries((newVal || []).map(record => [String(record.id), {}]));
+}, { immediate: true, deep: true });
 
 function zoomImage(img) {
   zoomedImage.value = img
@@ -301,7 +291,10 @@ function convertColumnEnumToSelectOptions(columnEnumArray: any[], key: string) {
 }
 
 function updateSelectedImage(image: string, id: any, fieldName: string) {
-  props.selected[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === id)][fieldName] = image;
+  const record = props.records.find(rec => String(rec.id) === String(id));
+  if (record) {
+    record.data[fieldName] = image;
+  }
 }
 
 function handleError({ isError, errorMessage }) {
@@ -311,14 +304,15 @@ function handleError({ isError, errorMessage }) {
   });
 }
 
-function regenerateImages(recordInfo: any) {
-  emit('regenerateImages', {
-    recordInfo
-  });
+function regenerateImages(recordId: any) {
+  emit('regenerateImages', { recordId });
 }
 
 function updateActiveIndex(newIndex: number, id: any, fieldName: string) {
-  props.carouselImageIndex[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === id)][fieldName] = newIndex;
+  const record = props.records.find(rec => String(rec.id) === String(id));
+  if (record) {
+    record.carouselImageIndex[fieldName] = newIndex;
+  }
 }
 
 function isValidUrl(str: string): boolean {
@@ -335,14 +329,14 @@ function regerenerateFieldIconClick(item, name) {
     return;
   }
   emit('regenerateCell', {
-    recordId: item[props.primaryKey],
+    recordId: item.id,
     fieldName: name
   });
 };
 
 function shouldDisableRegenerateFieldIcon(item, name) {
   if (props.outputFieldsForAnalizeFromImages.findIndex( el => el === name) !== -1 &&
-      props.imageToTextErrorMessages[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === item[props.primaryKey])]?.[name] === 'No source images found') {
+      item.imageToTextErrorMessages?.[name] === 'No source images found') {
     return true;
   }
   return false;
@@ -350,13 +344,13 @@ function shouldDisableRegenerateFieldIcon(item, name) {
 
 function checkForError(item, name) {
   if (props.outputFieldsForAnalizeFromImages.findIndex( el => el === name) !== -1) {
-    const errorMessage = props.imageToTextErrorMessages?.[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === item[props.primaryKey])]?.[name];
+    const errorMessage = item.imageToTextErrorMessages?.[name];
     if (errorMessage) {
       return errorMessage;
     }
   }
   if (props.outputPlainFields.findIndex( el => el === name) !== -1) {
-    const errorMessage = props.textToTextErrorMessages?.[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === item[props.primaryKey])]?.[name];
+    const errorMessage = item.textToTextErrorMessages?.[name];
     if (errorMessage) {
       return errorMessage;
     }
@@ -376,13 +370,23 @@ function isAnalyzing(item, name) {
 }
 
 function isImagesAnalyzing(item) {
-  const isImagesAnalyzing = props.isAiResponseReceivedAnalizeImage[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === item[props.primaryKey])]
-  return isImagesAnalyzing;
+  return item.aiStatus.analyzedImages;
 }
 
 function isNoImageAnalyzing(item) {
-  const isNoImageAnalyzing = props.isAiResponseReceivedAnalizeNoImage[props.tableColumnsIndexes.findIndex(el => el[props.primaryKey] === item[props.primaryKey])]
-  return isNoImageAnalyzing;
+  return item.aiStatus.analyzedNoImages;
+}
+
+function setHover(recordId: string | number, field: string, value: boolean) {
+  const key = String(recordId);
+  if (!hovers.value[key]) {
+    hovers.value[key] = {};
+  }
+  hovers.value[key][field] = value;
+}
+
+function isHovered(recordId: string | number, field: string) {
+  return Boolean(hovers.value?.[String(recordId)]?.[field]);
 }
 
 
diff --git a/custom/package-lock.json b/custom/package-lock.json
index 0d2bc84..0335c96 100644
--- a/custom/package-lock.json
+++ b/custom/package-lock.json
@@ -11,6 +11,7 @@
       "dependencies": {
         "@iconify-prerendered/vue-mdi": "^0.25.1718880438",
         "medium-zoom": "^1.1.0",
+        "p-limit": "^4.0.0",
         "swiper": "^11.2.10"
       }
     },
@@ -254,6 +255,21 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/p-limit": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-4.0.0.tgz",
+      "integrity": "sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==",
+      "license": "MIT",
+      "dependencies": {
+        "yocto-queue": "^1.0.0"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -340,6 +356,18 @@
           "optional": true
         }
       }
+    },
+    "node_modules/yocto-queue": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.2.2.tgz",
+      "integrity": "sha512-4LCcse/U2MHZ63HAJVE+v71o7yOdIe4cZ70Wpf8D/IyjDKYQLV5GD46B+hSTjJsvV5PztjvHoU580EftxjDZFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     }
   }
 }
diff --git a/custom/package.json b/custom/package.json
index 24fbf99..7f1d39d 100644
--- a/custom/package.json
+++ b/custom/package.json
@@ -12,6 +12,7 @@
   "dependencies": {
     "@iconify-prerendered/vue-mdi": "^0.25.1718880438",
     "medium-zoom": "^1.1.0",
-    "swiper": "^11.2.10"
+    "swiper": "^11.2.10",
+    "p-limit": "^4.0.0"
   }
 }
diff --git a/index.ts b/index.ts
index 6ea9478..14edbad 100644
--- a/index.ts
+++ b/index.ts
@@ -609,6 +609,7 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
           regenerateImages: this.options.refreshRates?.regenerateImages || 5_000,
         },
         askConfirmationBeforeGenerating: this.options.askConfirmationBeforeGenerating || false,
+        concurrencyLimit: this.options.concurrencyLimit || 10,
         generationPrompts: {
           plainFieldsPrompts: this.options.fillPlainFields || {},
           imageFieldsPrompts: this.options.fillFieldsFromImages || {},
@@ -765,6 +766,26 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
     });
 
 
+    server.endpoint({
+      method: 'POST',
+      path: `/plugin/${this.pluginInstanceId}/get_old_data`,
+      handler: async ({ body }) => {
+        const recordId = body.recordId;
+        if (recordId === undefined || recordId === null) {
+          return { ok: false, error: "Missing recordId" };
+        }
+        const primaryKeyColumn = this.resourceConfig.columns.find((col) => col.primaryKey);
+        const record = await this.adminforth.resource(this.resourceConfig.resourceId)
+          .get([Filters.EQ(primaryKeyColumn.name, recordId)]);
+        if (!record) {
+          return { ok: false, error: "Record not found" };
+        }
+        record._label = this.resourceConfig.recordLabel(record);
+        return { ok: true, record };
+      }
+    });
+
+
     server.endpoint({
       method: 'POST',
       path: `/plugin/${this.pluginInstanceId}/get_images`,
@@ -905,7 +926,7 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
           jobs.set(jobId, { status: "failed", error: "Missing action type" });
           //return { error: "Missing action type" };
         }
-        else if (!recordId) {
+        else if (!recordId && typeof recordId !== 'number') {
           jobs.set(jobId, { status: "failed", error: "Missing record id" });
           //return { error: "Missing record id" };
         } else {
diff --git a/types.ts b/types.ts
index b823dab..fe36337 100644
--- a/types.ts
+++ b/types.ts
@@ -119,4 +119,9 @@ export interface PluginOptions {
     }) => Record<string, any> | Promise<Record<string, any>>;
 
     askConfirmationBeforeGenerating?: boolean;
+
+  /**
+   * Maximum number of records processed concurrently on the frontend.
+   */
+  concurrencyLimit?: number;
 }

From ce467f9a8669a3685f2bb7b769ed445f914d9001 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 15:06:47 +0200
Subject: [PATCH 02/10] feat: add ability to process records, which are
 filtered

---
 custom/VisionAction.vue | 40 +++++++++++++++++++++++++++++++++----
 index.ts                | 44 +++++++++++++++++++++++++++++++++++++++--
 types.ts                | 12 +++++++++++
 3 files changed, 90 insertions(+), 6 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index c5be4c3..a45f226 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -67,7 +67,7 @@
     :click-to-close-outside="false"
   >
     <div class="bulk-vision-table flex flex-col items-center gap-3 md:gap-4 overflow-y-auto">
-      <template v-if="globalState.records.length && props.checkboxes.length && popupMode === 'generation'" >
+      <template v-if="globalState.records.length && popupMode === 'generation'" >
         <VisionTable
           class="md:max-h-[75vh] max-w-[1560px] w-full h-full"
           :records="globalState.records"
@@ -152,9 +152,11 @@ import { AdminUser, type AdminForthResourceCommon } from '@/types/Common';
 import { useCoreStore } from '@/stores/core';
 import { IconShieldSolid, IconInfoCircleSolid } from '@iconify-prerendered/vue-flowbite';
 import { IconExclamationTriangle } from '@iconify-prerendered/vue-humbleicons';
+import { useFiltersStore } from '@/stores/filters';
 
 
 const coreStore = useCoreStore();
+const filtersStore = useFiltersStore();
 
 const { t } = useI18n();
 const props = defineProps<{
@@ -232,7 +234,7 @@ const openDialog = async () => {
   isDialogOpen.value = true;
   confirmDialog.value.open();
   isFetchingRecords.value = true;
-  initializeGlobalState();
+  await initializeGlobalState();
   await findPreviewURLForImages();
   isFetchingRecords.value = false;
   if (!generationPrompts.value || Object.keys(generationPrompts.value).length === 0) {
@@ -242,6 +244,35 @@ const openDialog = async () => {
     runAiActions();
   }
 }
+
+async function getListOfIds() {
+  if ( props.meta.recordSelector === 'filtered' ) {
+    const filters = filtersStore.getFilters(props.resource.resourceId);
+    let res;
+    try {
+      res = await callAdminForthApi({
+        path: `/plugin/${props.meta.pluginInstanceId}/get_filtered_ids`,
+        method: 'POST',
+        body: { filters },
+        silentError: true,
+      });
+    } catch (e) {
+      console.error('Failed to get records for filtered selector:', e);
+      isError.value = true;
+      errorMessage.value = t(`Failed to fetch records. Please, try to re-run the action.`);
+      return [];
+    }
+    if (!res?.ok || !res?.recordIds) {
+      console.error('Failed to get records for filtered selector, response error:', res);
+      isError.value = true;
+      errorMessage.value = t(`Failed to fetch records. Please, try to re-run the action.`);
+      return [];
+    }
+    return res.recordIds;
+  } else {
+   return props.checkboxes;
+  }
+}
  
 
 async function runAiActions() {
@@ -267,8 +298,9 @@ const closeDialog = () => {
   isDataSaved.value = false;
 }
 
-function initializeGlobalState() {
-  const records = props.checkboxes.map((recordId: any) => createEmptyRecord(recordId));
+async function initializeGlobalState() {
+  const ids = await getListOfIds();
+  const records = ids.map((recordId: any) => createEmptyRecord(recordId));
   globalState.records.splice(0, globalState.records.length, ...records);
   globalState.recordsById = Object.fromEntries(records.map(record => [String(record.id), record]));
 }
diff --git a/index.ts b/index.ts
index 14edbad..8e53065 100644
--- a/index.ts
+++ b/index.ts
@@ -1,4 +1,4 @@
-import { AdminForthPlugin, Filters } from "adminforth";
+import { AdminForthFilterOperators, AdminForthPlugin, Filters } from "adminforth";
 import type { IAdminForth, IHttpServer, AdminForthComponentDeclaration, AdminForthResource } from "adminforth";
 import { suggestIfTypo } from "adminforth";
 import type { PluginOptions } from './types.js';
@@ -601,7 +601,7 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
         isFieldsForAnalizePlain: this.options.fillPlainFields ? Object.keys(this.options.fillPlainFields).length > 0 : false,
         isImageGeneration: this.options.generateImages ? Object.keys(this.options.generateImages).length > 0 : false,
         isAttachFiles: this.options.attachFiles ? true : false,
-        disabledWhenNoCheckboxes: true,
+        disabledWhenNoCheckboxes: this.options.recordSelector === 'filtered' ? false : true,
         refreshRates: {
           fillFieldsFromImages: this.options.refreshRates?.fillFieldsFromImages || 2_000,
           fillPlainFields: this.options.refreshRates?.fillPlainFields || 1_000,
@@ -610,6 +610,7 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
         },
         askConfirmationBeforeGenerating: this.options.askConfirmationBeforeGenerating || false,
         concurrencyLimit: this.options.concurrencyLimit || 10,
+        recordSelector: this.options.recordSelector || 'checkbox',
         generationPrompts: {
           plainFieldsPrompts: this.options.fillPlainFields || {},
           imageFieldsPrompts: this.options.fillFieldsFromImages || {},
@@ -1034,5 +1035,44 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
         }
       }
     });
+
+    server.endpoint({
+      method: 'POST',
+      path: `/plugin/${this.pluginInstanceId}/get_filtered_ids`,
+      handler: async ({ body, adminUser, headers }) => {
+        const filters = body.filters;
+
+        const normalizedFilters = { operator: AdminForthFilterOperators.AND, subFilters: [] };
+        if (filters) {
+          if (typeof filters !== 'object') {
+            throw new Error(`Filter should be an array or an object`);
+          }
+          if (Array.isArray(filters)) {
+            // if filters are an array, they will be connected with "AND" operator by default
+            normalizedFilters.subFilters = filters;
+          } else if (filters.field) {
+            // assume filter is a SingleFilter
+            normalizedFilters.subFilters = [filters];
+          } else if (filters.subFilters) {
+            // assume filter is a AndOr filter
+            normalizedFilters.operator = filters.operator;
+            normalizedFilters.subFilters = filters.subFilters;
+          } else {
+            // wrong filter
+            throw new Error(`Wrong filter object value: ${JSON.stringify(filters)}`);
+          }
+        }
+
+        const records = await this.adminforth.resource(this.resourceConfig.resourceId).list(normalizedFilters);
+        if (!records) {
+          return { ok: true, recordIds: [] };
+        }
+        const primaryKeyColumn = this.resourceConfig.columns.find((col) => col.primaryKey);
+
+        const recordIds = records.map(record => record[primaryKeyColumn.name]);
+
+        return { ok: true, recordIds }
+      }
+    });
   }
 }
\ No newline at end of file
diff --git a/types.ts b/types.ts
index fe36337..75b8c5c 100644
--- a/types.ts
+++ b/types.ts
@@ -124,4 +124,16 @@ export interface PluginOptions {
    * Maximum number of records processed concurrently on the frontend.
    */
   concurrencyLimit?: number;
+
+  /**
+   * Defines the way how records are selected for the action. 
+   * 
+   * 'checkbox' means that user will select records manually by checkboxes, 
+   * 
+   * 'filtered' means that action will be applied to all records matching current 
+   *  filters without showing any checkboxes (use with caution). 
+   * 
+   * Default is 'checkbox'.
+   */
+  recordSelector?: 'checkbox' | 'filtered';
 }

From 10b5d877840eb80da3b1a1d55cad48ae03281b38 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 16:22:44 +0200
Subject: [PATCH 03/10] fix: resolve performance problems by getting rid of
 huge reactive array

---
 custom/VisionAction.vue | 79 ++++++++++++++++++++++++++++++-----------
 1 file changed, 58 insertions(+), 21 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index a45f226..4094583 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -67,10 +67,10 @@
     :click-to-close-outside="false"
   >
     <div class="bulk-vision-table flex flex-col items-center gap-3 md:gap-4 overflow-y-auto">
-      <template v-if="globalState.records.length && popupMode === 'generation'" >
+      <template v-if="recordsList.length && popupMode === 'generation'" >
         <VisionTable
           class="md:max-h-[75vh] max-w-[1560px] w-full h-full"
-          :records="globalState.records"
+          :records="recordsList"
           :meta="props.meta"
           :tableHeaders="tableHeaders"
           :customFieldNames="customFieldNames"
@@ -195,10 +195,9 @@ type RecordState = {
   listOfImageNotGenerated: Record<string, any>;
 };
 
-const globalState = reactive<{ records: RecordState[]; recordsById: Record<string, RecordState> }>({
-  records: [],
-  recordsById: {},
-});
+const recordIds = ref<Array<string | number>>([]);
+const recordsById = new Map<string, RecordState>();
+const uncheckedRecordIds = new Set<string>();
 
 defineExpose({
   click
@@ -218,11 +217,16 @@ const generationPrompts = ref<any>({});
 const isDataSaved = ref(false);
 const overwriteExistingValues = ref<boolean>(false);
 
-const checkedCount = computed(() => globalState.records.filter(record => record.isChecked).length);
-const isProcessingAny = computed(() => globalState.records.some(record => record.status === 'processing'));
+const checkedCount = computed(() => recordIds.value.length - uncheckedRecordIds.size);
+const isProcessingAny = computed(() => Array.from(recordsById.values()).some(record => record.status === 'processing'));
 
 const tableHeaders = computed(() => generateTableHeaders(props.meta.outputFields));
 const customFieldNames = computed(() => tableHeaders.value.slice((props.meta.isAttachFiles) ? 3 : 2).map(h => h.fieldName));
+const recordsVersion = ref(0);
+const recordsList = computed(() => {
+  recordsVersion.value;
+  return recordIds.value.map(id => getOrCreateRecord(id));
+});
 
 const openDialog = async () => {
   window.addEventListener('beforeunload', beforeUnloadHandler);
@@ -281,9 +285,9 @@ async function runAiActions() {
     return;
   }
   const limit = pLimit(props.meta.concurrencyLimit || 10);
-  const tasks = globalState.records
-    .filter(record => record.isChecked)
-    .map(record => limit(() => processOneRecord(String(record.id))));
+  const tasks = recordIds.value
+    .filter(id => !uncheckedRecordIds.has(String(id)))
+    .map(id => limit(() => processOneRecord(String(id))));
   await Promise.all(tasks);
 }
 
@@ -300,14 +304,30 @@ const closeDialog = () => {
 
 async function initializeGlobalState() {
   const ids = await getListOfIds();
-  const records = ids.map((recordId: any) => createEmptyRecord(recordId));
-  globalState.records.splice(0, globalState.records.length, ...records);
-  globalState.recordsById = Object.fromEntries(records.map(record => [String(record.id), record]));
+  recordIds.value = ids;
+  recordsById.clear();
+  uncheckedRecordIds.clear();
 }
 
 function resetGlobalState() {
-  globalState.records.splice(0, globalState.records.length);
-  globalState.recordsById = {};
+  recordIds.value = [];
+  recordsById.clear();
+  uncheckedRecordIds.clear();
+}
+
+function getOrCreateRecord(recordId: string | number): RecordState {
+  const key = String(recordId);
+  let record = recordsById.get(key);
+  if (!record) {
+    record = createEmptyRecord(recordId);
+    record.isChecked = !uncheckedRecordIds.has(key);
+    recordsById.set(key, record);
+  }
+  return record;
+}
+
+function touchRecords() {
+  recordsVersion.value += 1;
 }
 
 function createImageFieldMap<T>(factory: () => T): Record<string, T> {
@@ -346,11 +366,12 @@ function createEmptyRecord(recordId: string | number): RecordState {
 }
 
 async function processOneRecord(recordId: string) {
-  const record = globalState.recordsById[recordId];
+  const record = getOrCreateRecord(recordId);
   if (!record || !record.isChecked) {
     return;
   }
   record.status = 'processing';
+  touchRecords();
   record.imageGenerationFailed = false;
   record.imageGenerationErrorMessage = '';
   record.imageToTextErrorMessages = {};
@@ -365,6 +386,7 @@ async function processOneRecord(recordId: string) {
     record.aiStatus.generatedImages = true;
     record.aiStatus.analyzedImages = true;
     record.aiStatus.analyzedNoImages = true;
+    touchRecords();
     return;
   }
   record.label = oldDataResult._label || record.label;
@@ -387,6 +409,7 @@ async function processOneRecord(recordId: string) {
   const results = await Promise.allSettled(actions.map(actionType => runActionForRecord(record, actionType)));
   const hasError = results.some(result => result.status === 'rejected');
   record.status = hasError ? 'failed' : 'completed';
+  touchRecords();
 }
 
 async function checkRateLimits() {
@@ -535,6 +558,7 @@ function applyJobResult(record: RecordState, job: any, actionType: 'analyze' | '
       ...(job?.result || {}),
     };
   }
+  touchRecords();
 }
 
 function applyJobFailure(record: RecordState, job: any, actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
@@ -555,6 +579,7 @@ function applyJobFailure(record: RecordState, job: any, actionType: 'analyze' |
       record.textToTextErrorMessages[props.meta.outputPlainFields[field]] = job?.error || 'Unknown error';
     }
   }
+  touchRecords();
 }
 
 async function waitForRefresh(actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
@@ -612,6 +637,7 @@ function initializeRecordData(record: RecordState, oldRecord: Record<string, any
   newOldData._label = oldRecord._label;
   record.data = newData;
   record.oldData = newOldData;
+  touchRecords();
 }
 
 function normalizeEnumValue(key: string, value: any) {
@@ -633,6 +659,7 @@ async function fetchImages(record: RecordState, oldRecord: Record<string, any>)
       },
     });
     record.images = res.images?.[0] || [];
+    touchRecords();
   } catch (error) {
     console.error('Failed to get images:', error);
     isError.value = true;
@@ -675,7 +702,10 @@ function handleTableError(errorData) {
   errorMessage.value = errorData.errorMessage;
 }
 async function prepareDataForSave() {
-  const checkedRecords = globalState.records.filter(record => record.isChecked);
+  const checkedRecords = recordIds.value
+    .filter(id => !uncheckedRecordIds.has(String(id)))
+    .map(id => recordsById.get(String(id)))
+    .filter((record): record is RecordState => Boolean(record));
   const checkedItems = checkedRecords.map(record => ({
     ...record.data,
     [primaryKey]: record.id,
@@ -731,7 +761,8 @@ async function saveData() {
   const [reqData, checkedRecords] = await prepareDataForSave();
     if (!checkedRecords.some(record => record.imageGenerationFailed)) {
       const imagesToUpload = [];
-      for (const [index, item] of reqData.entries()) {
+      for (let index = 0; index < reqData.length; index++) {
+        const item = reqData[index];
         const record = checkedRecords[index];
         for (const [key, value] of Object.entries(item)) {
           if (props.meta.outputImageFields?.includes(key)) {
@@ -880,13 +911,15 @@ function regenerateImages({ recordId }: { recordId: any }) {
     });
     return;
   }
-  const record = globalState.recordsById[String(recordId)];
+  const record = recordsById.get(String(recordId));
   if (!record) {
     return;
   }
   record.aiStatus.generatedImages = false;
+  touchRecords();
   runActionForRecord(record, 'generate_images').catch(() => {
     record.aiStatus.generatedImages = true;
+    touchRecords();
   });
 }
 
@@ -1028,7 +1061,7 @@ async function regenerateCell(recordInfo: any) {
     });
     return;
   }
-  const record = globalState.recordsById[String(recordInfo.recordId)];
+  const record = recordsById.get(String(recordInfo.recordId));
   if (!record) {
     return;
   }
@@ -1036,6 +1069,7 @@ async function regenerateCell(recordInfo: any) {
     record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
   }
   record.regeneratingFieldsStatus[recordInfo.fieldName] = true;
+  touchRecords();
   const actionType = props.meta.outputFieldsForAnalizeFromImages?.includes(recordInfo.fieldName)
     ? 'analyze'
     : props.meta.outputPlainFields?.includes(recordInfo.fieldName)
@@ -1044,6 +1078,7 @@ async function regenerateCell(recordInfo: any) {
   if (!actionType) {
     console.error(`Field ${recordInfo.fieldName} is not configured for analysis.`);
     record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
+    touchRecords();
     return;
   }
   
@@ -1114,6 +1149,7 @@ async function regenerateCell(recordInfo: any) {
       record.aiStatus.analyzedNoImages = true;
     }
     record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
+    touchRecords();
     return;
   } else if (res.job?.status === 'completed') {
     record.data = {
@@ -1128,6 +1164,7 @@ async function regenerateCell(recordInfo: any) {
       record.aiStatus.analyzedNoImages = true;
     }
     record.regeneratingFieldsStatus[recordInfo.fieldName] = false;
+    touchRecords();
   }
 }
 

From 23d4ebe006936ef643b14ca5f6280c349e834b33 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 16:30:23 +0200
Subject: [PATCH 04/10] fix: stop generation when window is closed

---
 custom/VisionAction.vue | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index 4094583..327db7f 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -228,6 +228,10 @@ const recordsList = computed(() => {
   return recordIds.value.map(id => getOrCreateRecord(id));
 });
 
+function checkIfDialogOpen() {
+  return isDialogOpen.value === true;
+}
+
 const openDialog = async () => {
   window.addEventListener('beforeunload', beforeUnloadHandler);
   if (props.meta.askConfirmationBeforeGenerating) {
@@ -366,6 +370,9 @@ function createEmptyRecord(recordId: string | number): RecordState {
 }
 
 async function processOneRecord(recordId: string) {
+  if (!checkIfDialogOpen()) {
+    return;
+  }
   const record = getOrCreateRecord(recordId);
   if (!record || !record.isChecked) {
     return;
@@ -381,6 +388,9 @@ async function processOneRecord(recordId: string) {
   record.aiStatus.analyzedNoImages = !props.meta.isFieldsForAnalizePlain;
 
   const oldDataResult = await fetchOldData(recordId);
+  if (!checkIfDialogOpen()) {
+    return;
+  }
   if (!oldDataResult) {
     record.status = 'failed';
     record.aiStatus.generatedImages = true;
@@ -393,6 +403,9 @@ async function processOneRecord(recordId: string) {
   initializeRecordData(record, oldDataResult);
   if (props.meta.isAttachFiles) {
     await fetchImages(record, oldDataResult);
+    if (!checkIfDialogOpen()) {
+      return;
+    }
   }
 
   const actions: Array<'generate_images' | 'analyze' | 'analyze_no_images'> = [];
@@ -407,6 +420,9 @@ async function processOneRecord(recordId: string) {
   }
 
   const results = await Promise.allSettled(actions.map(actionType => runActionForRecord(record, actionType)));
+  if (!checkIfDialogOpen()) {
+    return;
+  }
   const hasError = results.some(result => result.status === 'rejected');
   record.status = hasError ? 'failed' : 'completed';
   touchRecords();
@@ -451,6 +467,9 @@ async function checkRateLimits() {
 }
 
 async function runActionForRecord(record: RecordState, actionType: 'analyze' | 'analyze_no_images' | 'generate_images') {
+  if (!checkIfDialogOpen()) {
+    return;
+  }
   const responseFlag = actionType === 'generate_images'
     ? 'generatedImages'
     : actionType === 'analyze'
@@ -469,6 +488,9 @@ async function runActionForRecord(record: RecordState, actionType: 'analyze' | '
 
   let createJobResponse;
   try {
+    if (!checkIfDialogOpen()) {
+      return;
+    }
     createJobResponse = await callAdminForthApi({
       path: `/plugin/${props.meta.pluginInstanceId}/create-job`,
       method: 'POST',
@@ -485,6 +507,10 @@ async function runActionForRecord(record: RecordState, actionType: 'analyze' | '
     throw e;
   }
 
+  if (!checkIfDialogOpen()) {
+    return;
+  }
+
   if (createJobResponse?.error || !createJobResponse?.jobId) {
     record.aiStatus[responseFlag] = true;
     adminforth.alert({

From 61859389f7451c08b96d34166383980d951eb099 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 17:32:29 +0200
Subject: [PATCH 05/10] fix: don't use deprecated param "record" for the update

---
 index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.ts b/index.ts
index 8e53065..8482717 100644
--- a/index.ts
+++ b/index.ts
@@ -877,7 +877,7 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
               resource: this.resourceConfig,
               recordId: ID,
               oldRecord: oldRecord,
-              record: newRecord,
+              updates: newRecord,
               adminUser: adminUser,
             })
           });

From e534a57d9df4684bd68a0a6577f0ddeda4458b87 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 17:33:16 +0200
Subject: [PATCH 06/10] fix: block save button when generation in progress

---
 custom/VisionAction.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index 327db7f..433dbdc 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -20,7 +20,7 @@
         { 
           label: checkedCount > 1 ? t('Save fields') : t('Save field'), 
           options: { 
-            disabled: isLoading || checkedCount < 1 || isCriticalError || isFetchingRecords || isProcessingAny, 
+            disabled: isLoading || checkedCount < 1 || isFetchingRecords || isProcessingAny, 
             loader: isLoading, class: 'w-fit' 
           }, 
           onclick: async (dialog) => { await saveData(); dialog.hide(); } 
@@ -208,7 +208,6 @@ const primaryKey = props.meta.primaryKey;
 const isLoading = ref(false);
 const isFetchingRecords = ref(false);
 const isError = ref(false);
-const isCriticalError = ref(false);
 const errorMessage = ref('');
 const isDialogOpen = ref(false);
 const isImageHasPreviewUrl = ref<Record<string, boolean>>({});
@@ -218,7 +217,10 @@ const isDataSaved = ref(false);
 const overwriteExistingValues = ref<boolean>(false);
 
 const checkedCount = computed(() => recordIds.value.length - uncheckedRecordIds.size);
-const isProcessingAny = computed(() => Array.from(recordsById.values()).some(record => record.status === 'processing'));
+const isProcessingAny = computed(() => {
+  recordsVersion.value;
+  return Array.from(recordsById.values()).some(record => record.status === 'processing');
+});
 
 const tableHeaders = computed(() => generateTableHeaders(props.meta.outputFields));
 const customFieldNames = computed(() => tableHeaders.value.slice((props.meta.isAttachFiles) ? 3 : 2).map(h => h.fieldName));
@@ -299,7 +301,6 @@ const closeDialog = () => {
   window.removeEventListener('beforeunload', beforeUnloadHandler);
   resetGlobalState();
   isError.value = false;
-  isCriticalError.value = false;
   errorMessage.value = '';
   isDialogOpen.value = false;
   popupMode.value = 'confirmation';

From b1e79850b9bdd8f1cf0a94b64197cfcc7d88a3da Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Wed, 11 Feb 2026 17:45:12 +0200
Subject: [PATCH 07/10] fix: fix checkboxes in table. Now it doesn't save
 record with unchecked checkbox

---
 custom/VisionAction.vue | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index 433dbdc..f25f9a3 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -730,9 +730,8 @@ function handleTableError(errorData) {
 }
 async function prepareDataForSave() {
   const checkedRecords = recordIds.value
-    .filter(id => !uncheckedRecordIds.has(String(id)))
-    .map(id => recordsById.get(String(id)))
-    .filter((record): record is RecordState => Boolean(record));
+    .map(id => getOrCreateRecord(id))
+    .filter(record => record.isChecked === true);
   const checkedItems = checkedRecords.map(record => ({
     ...record.data,
     [primaryKey]: record.id,
@@ -779,13 +778,13 @@ async function convertImages(fieldName, img) {
 
 
 async function saveData() {
-  if (checkedCount.value < 1) {
-    adminforth.alert({ message: t('No items selected'), variant: 'warning' });
-    return;
-  }
   try {
     isLoading.value = true;
   const [reqData, checkedRecords] = await prepareDataForSave();
+    if (checkedRecords.length < 1) {
+      adminforth.alert({ message: t('No items selected'), variant: 'warning' });
+      return;
+    }
     if (!checkedRecords.some(record => record.imageGenerationFailed)) {
       const imagesToUpload = [];
       for (let index = 0; index < reqData.length; index++) {

From 1f53d7e394f49acdc1bad26d041b7bc5d2ba5005 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Thu, 12 Feb 2026 10:34:58 +0200
Subject: [PATCH 08/10] chore: improve error messaging on save failure

---
 custom/VisionAction.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index f25f9a3..73ce71e 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -292,7 +292,6 @@ async function runAiActions() {
   }
   const limit = pLimit(props.meta.concurrencyLimit || 10);
   const tasks = recordIds.value
-    .filter(id => !uncheckedRecordIds.has(String(id)))
     .map(id => limit(() => processOneRecord(String(id))));
   await Promise.all(tasks);
 }
@@ -778,6 +777,7 @@ async function convertImages(fieldName, img) {
 
 
 async function saveData() {
+  const errorText = 'Failed to save some records. Not all data may be saved'
   try {
     isLoading.value = true;
   const [reqData, checkedRecords] = await prepareDataForSave();
@@ -841,16 +841,16 @@ async function saveData() {
         timeout: 'unlimited',
       });
       isError.value = true;
-      errorMessage.value = t(`Failed to save data. You are not allowed to save.`);
+      errorMessage.value = t(errorText);
     } else {
       console.error('Error saving data:', failedResult);
       isError.value = true;
-      errorMessage.value = t(`Failed to save data. Please, try to re-run the action.`);
+      errorMessage.value = t(errorText);
     }
   } catch (error) {
     console.error('Error saving data:', error);
     isError.value = true;
-    errorMessage.value = t(`Failed to save data. Please, try to re-run the action.`);
+    errorMessage.value = t(errorText);
   } finally {
     isLoading.value = false;
     isDataSaved.value = true;

From a089a52a3bc2c2f5f8a21cb20900c5863891db11 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Thu, 12 Feb 2026 11:15:04 +0200
Subject: [PATCH 09/10] fix: if user passes integer/float as string for
 integer/float fields to the save data api - before throwing error we are
 trying to parse it

---
 custom/VisionAction.vue | 22 ++++++++++++----------
 index.ts                | 25 ++++++++++++++++++++++++-
 2 files changed, 36 insertions(+), 11 deletions(-)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index 73ce71e..dd2cbbf 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -830,19 +830,18 @@ async function saveData() {
     const saveResults = await Promise.all(saveTasks);
     const failedResult = saveResults.find(res => res?.ok === false || res?.error);
 
-    if (!failedResult) {
-      confirmDialog.value.close();
-      props.updateList();
-      props.clearCheckboxes?.();
-    } else if (failedResult.ok === false) {
-      adminforth.alert({
-        message: failedResult.error,
-        variant: 'danger',
-        timeout: 'unlimited',
+     if (failedResult && failedResult.ok === false) {
+      saveResults.filter(res => res?.ok === false).forEach(res => {
+        adminforth.alert({
+          message: res.error || t(errorText),
+          variant: 'danger',
+          timeout: 'unlimited',
+        });
+        console.error('Error saving data:', res.error);
       });
       isError.value = true;
       errorMessage.value = t(errorText);
-    } else {
+    } else if ( failedResult ) {
       console.error('Error saving data:', failedResult);
       isError.value = true;
       errorMessage.value = t(errorText);
@@ -852,6 +851,9 @@ async function saveData() {
     isError.value = true;
     errorMessage.value = t(errorText);
   } finally {
+    confirmDialog.value.close();
+    props.updateList();
+    props.clearCheckboxes?.();
     isLoading.value = false;
     isDataSaved.value = true;
     window.removeEventListener('beforeunload', beforeUnloadHandler);
diff --git a/index.ts b/index.ts
index 8482717..1c5036b 100644
--- a/index.ts
+++ b/index.ts
@@ -825,7 +825,11 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
             }
           }
           const primaryKeyColumn = this.resourceConfig.columns.find((col) => col.primaryKey);
+
           const decimalFieldsArray = this.resourceConfig.columns.filter(c => c.type === 'decimal').map(c => c.name);
+          const integerFieldsArray = this.resourceConfig.columns.filter(c => c.type === 'integer').map(c => c.name);
+          const floatFieldsArray = this.resourceConfig.columns.filter(c => c.type === 'float').map(c => c.name);
+
           const updates = selectedIds.map(async (ID, idx) => {
             const oldRecord = await this.adminforth.resource(this.resourceConfig.resourceId).get( [Filters.EQ(primaryKeyColumn.name, ID)] );
             for (const [key, value] of Object.entries(outputImageFields)) {
@@ -869,6 +873,21 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
                 }
               }
             }
+            if (integerFieldsArray.length > 0) {
+              for (const fieldName of integerFieldsArray) {
+                if (fieldsToUpdate[idx].hasOwnProperty(fieldName)) {
+                  fieldsToUpdate[idx][fieldName] = parseInt(fieldsToUpdate[idx][fieldName], 10);
+                }
+              }
+            }
+            if (floatFieldsArray.length > 0) {
+              for (const fieldName of floatFieldsArray) {
+                if (fieldsToUpdate[idx].hasOwnProperty(fieldName)) {
+                  fieldsToUpdate[idx][fieldName] = parseFloat(fieldsToUpdate[idx][fieldName]);
+                }
+              }
+            }
+
             const newRecord = {
               ...oldRecord,
               ...fieldsToUpdate[idx]
@@ -881,7 +900,11 @@ export default class  BulkAiFlowPlugin extends AdminForthPlugin {
               adminUser: adminUser,
             })
           });
-          await Promise.all(updates);
+          try {
+            await Promise.all(updates);
+          } catch (error) {
+            return { ok: false, error: `Error updating records, because of unprocesseble data for record ID ${selectedIds}` };
+          }
           return { ok: true };
         } else {
           return { ok: false, error: isAllowedToSave.error };

From 8802582aeef2a8f67b9ce4f0575d9140f2212ff5 Mon Sep 17 00:00:00 2001
From: yaroslav8765 <pechorkin2014@gmail.com>
Date: Thu, 12 Feb 2026 15:03:14 +0200
Subject: [PATCH 10/10] feat: add progress bar

---
 custom/VisionAction.vue | 53 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 53 insertions(+)

diff --git a/custom/VisionAction.vue b/custom/VisionAction.vue
index dd2cbbf..3eee480 100644
--- a/custom/VisionAction.vue
+++ b/custom/VisionAction.vue
@@ -68,6 +68,32 @@
   >
     <div class="bulk-vision-table flex flex-col items-center gap-3 md:gap-4 overflow-y-auto">
       <template v-if="recordsList.length && popupMode === 'generation'" >
+
+
+        <div class="w-full">
+          <div
+            class="w-full h-[30px] rounded-md bg-gray-200 dark:bg-gray-700 overflow-hidden relative"
+            role="progressbar"
+            :aria-valuenow="displayedProcessedCount"
+            :aria-valuemin="0"
+            :aria-valuemax="totalRecords"
+          >
+            <div
+              class="h-full bg-gradient-to-r from-purple-500 via-purple-600 to-purple-700 transition-all duration-200"
+              :style="{ width: `${displayedProgressPercent}%` }"
+            ></div>
+            <div class="absolute inset-0 flex items-center justify-center text-sm font-medium text-white drop-shadow">
+              <template v-if="isProcessingAny">
+                {{ displayedProcessedCount }} / {{ totalRecords }}
+              </template>
+              <template v-else>
+                {{ t('Processed') }}
+              </template>
+            </div>
+          </div>
+        </div>
+
+
         <VisionTable
           class="md:max-h-[75vh] max-w-[1560px] w-full h-full"
           :records="recordsList"
@@ -217,6 +243,33 @@ const isDataSaved = ref(false);
 const overwriteExistingValues = ref<boolean>(false);
 
 const checkedCount = computed(() => recordIds.value.length - uncheckedRecordIds.size);
+const totalRecords = computed(() => recordIds.value.length);
+const processedCount = computed(() => {
+  recordsVersion.value;
+  return Array.from(recordsById.values()).filter(record => record.status === 'completed' || record.status === 'failed').length;
+});
+const progressStep = computed(() => {
+  if (!totalRecords.value || totalRecords.value < 100) {
+    return 1;
+  }
+  return Math.max(1, Math.floor(totalRecords.value / 100));
+});
+const displayedProcessedCount = computed(() => {
+  const step = progressStep.value;
+  if (step <= 1) {
+    return processedCount.value;
+  }
+  if (processedCount.value >= totalRecords.value) {
+    return totalRecords.value;
+  }
+  return Math.floor(processedCount.value / step) * step;
+});
+const displayedProgressPercent = computed(() => {
+  if (!totalRecords.value) {
+    return 0;
+  }
+  return Math.min(100, Math.round((displayedProcessedCount.value / totalRecords.value) * 100));
+});
 const isProcessingAny = computed(() => {
   recordsVersion.value;
   return Array.from(recordsById.values()).some(record => record.status === 'processing');