# ivyforms/0.3/frontend/src/stores/useConfirmationSettingBuilder.ts

The Innovative Form Builder – IvyForms, version 0.3. 260 lines.

- Page: https://pluginprobe.com/plugins/ivyforms/0.3/code/frontend/src/stores/useConfirmationSettingBuilder.ts
- Raw: https://pluginprobe.com/plugins/ivyforms/0.3/raw/frontend/src/stores/useConfirmationSettingBuilder.ts
- Modified: 2025-08-20T10:20:12+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/ivyforms/0.3/code/frontend/src/stores/useConfirmationSettingBuilder.ts#L10-L20`.

```typescript
import { defineStore } from 'pinia'
import { ref } from 'vue'
import { useLabels } from '@/composables/useLabels'
import IvyMessage from '@/views/_components/message/ivyMessage.ts'
import { useApiClient } from '@/composables/useApiClient'

import { useUnsavedChangesStore } from '@/stores/useUnsavedChangesStore'

export const useConfirmationSettingBuilder = defineStore('confirmationSettingBuilder', () => {
  const allConfirmations = ref([])
  const id = ref<number | null>(null)
  const formId = ref<number | null>(null)
  const type = ref<string | null>('successMessage')
  const enabled = ref(true)
  const showForm = ref(false)
  const message = ref<string | null>('')
  const url = ref<string | null>('')
  const page = ref<string | null>('')
  const isEditing = ref(false)

  const { getLabel } = useLabels()

  // Use unsaved changes store for state management
  const unsavedChangesStore = useUnsavedChangesStore()

  // Create complete entity manager for confirmation builder
  const entityManager = unsavedChangesStore.createEntityManager('confirmationBuilder', {
    url,
    message,
    type,
    enabled,
    showForm,
    page,
  })

  const resetEntityState = () => {
    entityManager.resetUnsavedChanges()
  }
  const { request } = useApiClient()

  // Load existing confirmation if confirmation id is provided
  const loadConfirmation = async (confirmationId: number) => {
    try {
      const { data, error, status } = await request(`/confirmation/${confirmationId}`, {
        method: 'GET',
      })
      const confirmation = data?.data?.data
      if (!error && status === 200 && confirmation) {
        id.value = confirmationId
        formId.value = confirmation.formId
        type.value = confirmation.type || 'successMessage'
        enabled.value = confirmation.enabled || false
        showForm.value = confirmation.showForm || false
        message.value = confirmation.message || ''
        url.value = confirmation.url || ''
        page.value = confirmation.page || ''
        isEditing.value = true

        resetEntityState()
      } else {
        IvyMessage({
          message: `${getLabel('failed_to_load_confirmation')} ${data?.message ?? error}`,
          type: 'error',
        })
      }
    } catch (error) {
      IvyMessage({
        message: `${getLabel('failed_to_load_confirmation')} ${error}`,
        type: 'error',
      })
    }
  }

  // Fetch all confirmations
  const fetchAllConfirmations = async (formIdValue: number) => {
    try {
      const { data, error, status } = await request(`/confirmations/${formIdValue}`, {
        method: 'GET',
      })
      if (!error && status === 200 && data?.data) {
        const responseData = data.data[0][0]
        id.value = responseData.id
        formId.value = responseData.formId
        type.value = responseData.type || 'successMessage'
        enabled.value = responseData.enabled || false
        showForm.value = responseData.showForm || false
        message.value = responseData.message || ''
        url.value = responseData.url || ''
        page.value = responseData.page || ''
        isEditing.value = true

        resetEntityState()
      } else {
        IvyMessage({
          message: `${getLabel('failed_to_fetch_confirmation')} ${data?.message ?? error}`,
          type: 'error',
        })
      }
    } catch (error) {
      IvyMessage({
        message: `${getLabel('failed_to_fetch_confirmation')} ${error}`,
        type: 'error',
      })
    }
  }

  // Reset confirmation to default values
  const resetConfirmation = () => {
    id.value = null
    formId.value = null
    type.value = ''
    enabled.value = true
    showForm.value = false
    message.value = ''
    url.value = ''
    page.value = ''
    isEditing.value = false
  }

  // Create a new confirmation
  const createConfirmation = async () => {
    const confirmationData = {
      formId: formId.value ?? null,
      type: type.value || '',
      enabled: enabled.value || false,
      showForm: showForm.value || false,
      message: message.value || '',
      url: url.value || '',
      page: page.value || '',
    }
    try {
      const { data, error, status } = await request('/confirmation/add/', {
        method: 'POST',
        data: confirmationData,
      })
      if (!error && status === 200 && data?.data?.data) {
        id.value = data.data.data.id
        allConfirmations.value.push(data.data)
        IvyMessage({
          message: getLabel('create_confirmation'),
          type: 'success',
        })
        entityManager.resetUnsavedChanges()
      } else {
        IvyMessage({
          message: `${getLabel('failed_to_create_confirmation')} ${data?.message ?? error}`,
          type: 'error',
        })
      }
    } catch (error) {
      IvyMessage({
        message: `${getLabel('error_creating_confirmation')} ${error}`,
        type: 'error',
      })
    }
  }

  // Update confirmation data
  const updateConfirmation = async (confirmationId, dataToUpdate) => {
    try {
      const { data, error, status } = await request(`/confirmation/update/${confirmationId}/`, {
        method: 'POST',
        data: dataToUpdate,
      })
      if (!error && status === 200) {
        IvyMessage({
          message: getLabel('update_confirmation'),
          type: 'success',
        })
        entityManager.resetUnsavedChanges()
      } else {
        IvyMessage({
          message: `${getLabel('error_creating_confirmation')}: ${data?.message ?? error}`,
          type: 'error',
        })
      }
    } catch (error) {
      IvyMessage({
        message: `${getLabel('error_to_update_confirmation')} ${error}`,
        type: 'error',
      })
    }
  }

  // Duplicate confirmation
  const duplicateConfirmation = async (confirmationId: number) => {
    try {
      const { data, error, status } = await request(`/confirmation/duplicate/${confirmationId}/`, {
        method: 'POST',
      })
      if (!error && status === 200 && data?.data) {
        IvyMessage({
          message: getLabel('updating_duplicated_confirmation'),
          type: 'success',
        })
        allConfirmations.value.push(data.data)
      } else {
        IvyMessage({
          message: `${getLabel('failed_to_duplicate_confirmation')} ${data?.message ?? error}`,
          type: 'error',
        })
      }
    } catch (error) {
      IvyMessage({
        message: `${getLabel('error_duplicate_confirmation')} ${error}`,
        type: 'error',
      })
    }
  }

  // Delete confirmation
  const deleteConfirmation = async (confirmationId) => {
    try {
      const { data, error, status } = await request(`/confirmation/delete/${confirmationId}/`, {
        method: 'POST',
        data: { id: confirmationId },
      })
      if (!error && status === 200) {
        IvyMessage({
          message: getLabel('delete_confirmation'),
          type: 'success',
        })
        allConfirmations.value = allConfirmations.value.filter((item) => item.id !== confirmationId)
      } else {
        IvyMessage({
          message: `${getLabel('failed_to_delete_confirmation')} ${data?.message ?? error}`,
          type: 'error',
        })
      }
    } catch (error) {
      IvyMessage({
        message: `${getLabel('error_delete_confirmation')} ${error}`,
        type: 'error',
      })
    }
  }

  return {
    allConfirmations,
    id,
    formId,
    type,
    enabled,
    showForm,
    resetEntityState,
    message,
    url,
    page,
    isEditing,
    getCurrentState: entityManager.getCurrentState,
    fetchAllConfirmations,
    resetConfirmation,
    createConfirmation,
    updateConfirmation,
    deleteConfirmation,
    loadConfirmation,
    duplicateConfirmation,
  }
})

```