km-web-plugin/templates/base/src/composables/useExample.ts

ICE Web Plugin Initializer

import { ref, reactive, readonly } from 'vue';
import type { QuickViewRecord, ExampleRecord } from '@/types/example.ts';
import { exampleService } from '@/services/ExampleService.ts';

const ledgerState = reactive({
    items: [] as QuickViewRecord[],
});
const selectedRecord = ref<ExampleRecord | null>(null);

const initialized = ref(false);
const loading = ref(false);

export function useExample() {
    const loadLedger = async (): Promise<void> => {
        loading.value = true;
        try {
            const items = await exampleService.loadLedger();
            ledgerState.items = items;
        } catch (error) {
            ledgerState.items = [];
            throw error;
        } finally {
            initialized.value = true;
            loading.value = false;
        }
    };

    const getRecordDetails = async (
        recordId: string,
    ): Promise<ExampleRecord | null> => {
        selectedRecord.value = await exampleService.getRecordDetails(recordId);
    };

    const createRecord = async (
        recordData: Omit<ExampleRecord, 'id' | 'lastEditedBy' | 'lastEditedOn'>,
    ): Promise<
        | { success: true; record: ExampleRecord }
        | { success: false; error: string }
    > => {
        loading.value = true;
        try {
            const result = await exampleService.createRecord(
                recordData,
                ledgerState.items,
            );

            if (result.success) {
                const quickViewRecord = {
                    id: result.record.id,
                    name: result.record.name,
                    lastEditedBy: result.record.lastEditedBy,
                    lastEditedOn: result.record.lastEditedOn.toISOString(),
                };
                ledgerState.items.unshift(quickViewRecord);
            }

            return result;
        } finally {
            loading.value = false;
        }
    };

    const updateRecord = async (
        recordData: ExampleRecord,
    ): Promise<
        | { success: true; record: ExampleRecord }
        | { success: false; error: string }
    > => {
        loading.value = true;
        try {
            const result = await exampleService.updateRecord(
                recordData,
                ledgerState.items,
            );

            if (result.success) {
                const quickViewRecord = {
                    id: result.record.id,
                    name: result.record.name,
                    lastEditedBy: result.record.lastEditedBy,
                    lastEditedOn: result.record.lastEditedOn.toISOString(),
                };

                const index = ledgerState.items.findIndex(
                    (item) => item.id === result.record.id,
                );
                if (index !== -1) {
                    ledgerState.items[index] = quickViewRecord;
                }
            }

            return result;
        } finally {
            loading.value = false;
        }
    };

    const deleteRecord = async (recordId: string): Promise<boolean> => {
        loading.value = true;
        try {
            const success = await exampleService.deleteRecord(
                recordId,
                ledgerState.items,
            );

            if (success) {
                ledgerState.items = ledgerState.items.filter(
                    (item) => item.id !== recordId,
                );
            }

            return success;
        } finally {
            loading.value = false;
        }
    };

    const duplicateRecord = async (
        recordId: string,
    ): Promise<
        | { success: true; record: ExampleRecord }
        | { success: false; error: string }
    > => {
        loading.value = true;
        try {
            const result = await exampleService.duplicateRecord(
                recordId,
                ledgerState.items,
            );

            if (result.success) {
                const quickViewRecord = {
                    id: result.record.id,
                    name: result.record.name,
                    lastEditedBy: result.record.lastEditedBy,
                    lastEditedOn: result.record.lastEditedOn.toISOString(),
                };
                ledgerState.items.unshift(quickViewRecord);
            }

            return result;
        } finally {
            loading.value = false;
        }
    };

    const setSelectedRecord = (record: ExampleRecord | null = null) => {
        selectedRecord.value = record;
    };

    return {
        loading: readonly(loading),
        initialized: readonly(initialized),
        state: readonly(ledgerState),
        selectedRecord: readonly(selectedRecord),
        setSelectedRecord,
        loadLedger,
        getRecordDetails,
        createRecord,
        updateRecord,
        deleteRecord,
        duplicateRecord,
    };
}