feat(imports): retry stalled Intercom imports

2026-07-17 14:39:35 +05:30
parent 5af26e45a9
commit 2decd8c544
15 changed files with 445 additions and 2 deletions
@@ -11,6 +11,10 @@ class DataImportsAPI extends ApiClient {
    return axios.post(`${this.url}/${id}/start`);
  }

+  retry(id) {
+    return axios.post(`${this.url}/${id}/retry`);
+  }
+
  abandon(id) {
    return axios.post(`${this.url}/${id}/abandon`);
  }
@@ -461,6 +461,7 @@
      "STATUS": "Status",
      "IMPORTED": "Imported",
      "CREATED": "Created",
+      "RETRY": "Retry",
      "ABANDON": "Abandon"
    },
    "DETAIL": {
@@ -507,6 +508,8 @@
    },
    "ALERTS": {
      "IMPORT_STARTED": "Intercom import has started.",
+      "IMPORT_RETRIED": "Intercom import has been queued to resume.",
+      "IMPORT_RETRY_FAILED": "Could not retry the Intercom import.",
      "IMPORT_ABANDONED": "Intercom import has been abandoned.",
      "IMPORT_FAILED": "Could not start the Intercom import."
    }
@@ -26,6 +26,7 @@ const dataImport = ref(null);
 const isLoading = ref(true);
 const isRefreshing = ref(false);
 const isPolling = ref(false);
+const isRetrying = ref(false);
 const isAbandoning = ref(false);
 const isDownloadingErrorLogs = ref(false);
 const isDownloadingSkipLogs = ref(false);
@@ -117,6 +118,19 @@ const abandonImport = async () => {
  }
 };

+const retryImport = async () => {
+  isRetrying.value = true;
+  try {
+    const response = await DataImportsAPI.retry(dataImport.value.id);
+    dataImport.value = response.data;
+    useAlert(t('DATA_IMPORTS.ALERTS.IMPORT_RETRIED'));
+  } catch {
+    useAlert(t('DATA_IMPORTS.ALERTS.IMPORT_RETRY_FAILED'));
+  } finally {
+    isRetrying.value = false;
+  }
+};
+
 const downloadCsv = (response, filename) => {
  const url = window.URL.createObjectURL(
    new Blob([response.data], { type: 'text/csv' })
@@ -197,9 +211,11 @@ onBeforeUnmount(() => {
      <ImportDetailHeader
        :data-import="dataImport"
        :is-refreshing="isRefreshing"
+        :is-retrying="isRetrying"
        :is-abandoning="isAbandoning"
        :is-polling="isPolling"
        @refresh="fetchImport({ manual: true })"
+        @retry="retryImport"
        @abandon="abandonImport"
      />
    </template>
@@ -21,6 +21,10 @@ const props = defineProps({
    type: Boolean,
    default: false,
  },
+  isRetrying: {
+    type: Boolean,
+    default: false,
+  },
  isAbandoning: {
    type: Boolean,
    default: false,
@@ -31,7 +35,7 @@ const props = defineProps({
  },
 });

-defineEmits(['refresh', 'abandon']);
+defineEmits(['refresh', 'retry', 'abandon']);

 const { t } = useI18n();

@@ -90,11 +94,23 @@ const canAbandonImport = computed(() => isAbandonableImport(props.dataImport));
            :title="$t('DATA_IMPORTS.MONITOR.REFRESH')"
            @click="$emit('refresh')"
          />
+          <Button
+            v-if="dataImport?.stalled"
+            outline
+            slate
+            size="sm"
+            icon="i-lucide-rotate-ccw"
+            :is-loading="isRetrying"
+            :disabled="isAbandoning"
+            :label="$t('DATA_IMPORTS.TABLE.RETRY')"
+            @click="$emit('retry')"
+          />
          <Button
            v-if="canAbandonImport"
            ruby
            size="sm"
            :is-loading="isAbandoning"
+            :disabled="isRetrying"
            :label="$t('DATA_IMPORTS.TABLE.ABANDON')"
            @click="$emit('abandon')"
          />
@@ -0,0 +1,85 @@
+import { mount } from '@vue/test-utils';
+import ImportDetailHeader from '../components/ImportDetailHeader.vue';
+
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({ t: key => key }),
+}));
+
+const ButtonStub = {
+  name: 'Button',
+  props: {
+    label: { type: String, default: '' },
+    icon: { type: String, default: '' },
+    isLoading: { type: Boolean, default: false },
+  },
+  emits: ['click'],
+  template: `
+    <button
+      :data-label="label"
+      :data-icon="icon"
+      :data-loading="isLoading"
+      @click="$emit('click')"
+    >
+      {{ label }}
+    </button>
+  `,
+};
+
+const BaseSettingsHeaderStub = {
+  template: `
+    <section>
+      <slot name="title" />
+      <slot name="description" />
+    </section>
+  `,
+};
+
+const mountHeader = props =>
+  mount(ImportDetailHeader, {
+    props,
+    global: {
+      stubs: {
+        Button: ButtonStub,
+        BaseSettingsHeader: BaseSettingsHeaderStub,
+      },
+      mocks: {
+        $t: key => key,
+      },
+    },
+  });
+
+describe('ImportDetailHeader', () => {
+  const activeImport = {
+    id: 1,
+    name: 'Intercom import',
+    data_type: 'intercom',
+    source_provider: 'intercom',
+    status: 'processing',
+    stalled: true,
+  };
+
+  it('shows Retry between Refresh and Abandon for stalled imports', async () => {
+    const wrapper = mountHeader({ dataImport: activeImport });
+    const buttons = wrapper.findAll('button');
+
+    expect(buttons.map(button => button.attributes('data-label'))).toEqual([
+      '',
+      'DATA_IMPORTS.TABLE.RETRY',
+      'DATA_IMPORTS.TABLE.ABANDON',
+    ]);
+
+    await buttons[1].trigger('click');
+
+    expect(wrapper.emitted('retry')).toHaveLength(1);
+  });
+
+  it('hides Retry when the server does not report the import as stalled', () => {
+    const wrapper = mountHeader({
+      dataImport: { ...activeImport, stalled: false },
+    });
+
+    expect(
+      wrapper.find('[data-label="DATA_IMPORTS.TABLE.RETRY"]').exists()
+    ).toBe(false);
+  });
+});
@@ -0,0 +1,104 @@
+import { flushPromises, mount } from '@vue/test-utils';
+import { KeepAlive, defineComponent, h, nextTick } from 'vue';
+import { useAlert } from 'dashboard/composables';
+import DataImportsAPI from 'dashboard/api/dataImports';
+import Show from '../Show.vue';
+
+vi.mock('dashboard/api/dataImports', () => ({
+  default: {
+    show: vi.fn(),
+    retry: vi.fn(),
+  },
+}));
+
+vi.mock('dashboard/composables', () => ({
+  useAlert: vi.fn(),
+}));
+
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({ t: key => key }),
+}));
+
+vi.mock('vue-router', async importOriginal => ({
+  ...(await importOriginal()),
+  useRoute: () => ({ params: { dataImportId: 1 } }),
+}));
+
+const SettingsLayoutStub = {
+  template: `
+    <main>
+      <slot name="header" />
+      <slot name="body" />
+    </main>
+  `,
+};
+
+const ImportDetailHeaderStub = {
+  name: 'ImportDetailHeader',
+  emits: ['retry'],
+  template: '<button data-test="retry" @click="$emit(\'retry\')" />',
+};
+
+const mountShow = () => {
+  const Host = defineComponent({
+    render() {
+      return h(KeepAlive, null, { default: () => h(Show) });
+    },
+  });
+
+  return mount(Host, {
+    global: {
+      stubs: {
+        SettingsLayout: SettingsLayoutStub,
+        ImportDetailHeader: ImportDetailHeaderStub,
+        ImportSummaryTiles: true,
+        ImportProgress: true,
+        ImportErrorsSection: true,
+        ImportSkipLogsSection: true,
+      },
+      mocks: {
+        $t: key => key,
+      },
+    },
+  });
+};
+
+describe('data import detail actions', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+    DataImportsAPI.show.mockResolvedValue({
+      data: {
+        id: 1,
+        status: 'processing',
+        stalled: true,
+        skip_logs_filters: {},
+      },
+    });
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+    vi.clearAllMocks();
+  });
+
+  it('retries a stalled import and replaces the page state', async () => {
+    DataImportsAPI.retry.mockResolvedValue({
+      data: {
+        id: 1,
+        status: 'pending',
+        stalled: false,
+        skip_logs_filters: {},
+      },
+    });
+    const wrapper = mountShow();
+    await nextTick();
+    await flushPromises();
+
+    await wrapper.find('[data-test="retry"]').trigger('click');
+    await flushPromises();
+
+    expect(DataImportsAPI.retry).toHaveBeenCalledWith(1);
+    expect(useAlert).toHaveBeenCalledWith('DATA_IMPORTS.ALERTS.IMPORT_RETRIED');
+    wrapper.unmount();
+  });
+});