import { ref, type Ref } from 'vue' import axios, { AxiosError } from 'axios' import { usePage } from '@inertiajs/vue3' import type { SharedProps } from '@/Types/types' export type SettingValue = string | number | boolean | null | Record | unknown[] export interface UpdateSettingOptions { endpoint?: (name: string) => string method?: 'patch' | 'put' | 'post' } export interface UpdateSettingResponse { [key: string]: T } export interface UseUpdateSettingReturn { updateSetting: (name: string, value: T) => Promise isUpdating: Ref error: Ref } interface LaravelValidationErrorResponse { message?: string errors?: Record } export function useUpdateSetting(options: UpdateSettingOptions = {}): UseUpdateSettingReturn { const { endpoint = (name: string) => `/settings/${name}`, method = 'patch', } = options const isUpdating = ref(false) const error = ref(null) async function updateSetting( name: string, value: T ): Promise { isUpdating.value = true error.value = null const page = usePage() if (!page.props.auth?.user) { error.value = 'You must be logged in to update settings.' return Promise.reject(new Error(error.value)) } try { const response = await axios.request({ method, url: endpoint(name), data: { value }, }) return response.data } catch (err) { const axiosError = err as AxiosError if (axiosError.response?.status === 401) { error.value = 'You must be logged in to update settings.' } else if (axiosError.response?.status === 422) { error.value = axiosError.response.data?.message ?? 'Invalid setting value.' } else { error.value = 'Something went wrong updating your setting.' } throw err } finally { isUpdating.value = false } } return { updateSetting, isUpdating, error, } }