pendaftaran/composables/auth/userAuth.ts

// composables/auth/useLogin.ts

import {z, ZodError} from "zod";
import {computed} from "vue";

export default function useLogin() {
    const data = reactive({
        email: {
            value: '',
            error: ""
        },
        password: {
            value: '',
            error: ""
        }
    });

    const status = ref<'idle' | 'loading' | 'success' | 'error'>('idle');
    const error = ref<string | null>(null);

    const validateEmail = () => {
        const schema = z.string().email("Invalid email address");
        try {
            schema.parse(data.email.value);
            data.email.error = "";
        } catch (e: unknown) {
            data.email.error = (e as ZodError).issues[0].message;
        }
    };

    const validatePassword = () => {
        const schema = z.string({message: "Password is required"})
            .min(6, "Password must be at least 6 characters");
        try {
            schema.parse(data.password.value);
            data.password.error = "";
        } catch (e: unknown) {
            data.password.error = (e as ZodError).issues[0].message;
        }
    };


    const login = async () => {
        console.log("Will Login");
    }

    const isFormValid = computed(() => {
        return (
            data.email.value !== "" &&
            data.password.value !== "" &&
            data.email.error === "" &&
            data.password.error === ""
        );
    });

    return {
        data, login, status, error, validateEmail, validatePassword, isFormValid
    }
}