import { ref, computed } from "vue";
import type { Expense } from "src/modules/timesheets/models/expense.models";
import type { ExpenseType } from "src/modules/timesheets/models/expense.models";

export const useExpenseDraft = (initial?: Partial<Expense>) => {
    const DEFAULT_TYPE: ExpenseType = 'EXPENSES';

    const draft = ref<Partial<Expense>>({
        date: '',
        type: DEFAULT_TYPE,
        comment: '',
        ...(initial ?? {}),
    });

    const reset = () => {
        draft.value = {
            date: '',
            type: DEFAULT_TYPE,
            comment: '',
        }
    }

    const setType = (value: ExpenseType) => {
        draft.value.type = value;
        if(value === 'MILEAGE') {
            delete draft.value.amount;
        } else {
            delete draft.value.mileage;
        }
    };

    const showMileage = computed(()=> (draft.value.type as string) === 'MILEAGE');
    const showAmount  = computed(()=> !showMileage.value);

    return { draft, setType, reset, showMileage, showAmount };
}