// src/types/signupApi.ts

export interface ApiErrorDetail
{
	[field: string]: string | string[];
}

export interface GenericResponse<Type = any>
{
	success: boolean;
	message?: string | null;
	errors?: ApiErrorDetail | null;
	data?: T | null;
}

// src/components/site/signup/types.ts

/**
* Typescript 
* Define signup form data shape
*/
export interface SignupData
{
	email: string;
	token: string;
	fullname: string;
	password: string;
	passwordRepeat: string;
	category: string;
	businessName: string;
	description?: string;
	phone?: string;
	website?: string;
	contactEmail?: string;
	address?: string;
	hours?: string;
	businessCard?: File | null;
	profilePicture?: File | null;
	banner?: File | null;
}

export const initialSignupData: SignupData =
{
	email: '',
	token: '',
	fullname: '',
	password: '',
	passwordRepeat: '',
	category: '',
	businessName: '',
	description: '',
	phone: '',
	website: '',
	contactEmail: '',
	address: '',
	hours: '',
	businessCard: null,
	profilePicture: null,
	banner: null,
};

// src/services/signupService.ts
import apiClient from './apiClient';
import { ENDPOINTS } from '../constants/api';
import { fetchCsrfToken, CsrfData } from '../../services/csrfService';
import type { GenericResponse } from '../types/signupApi';

/**
* Stage/step Zero - Submit email to receive verification token
*/
export interface SignupStageZeroEmailData
{
	email: string;
}

export interface SignupStageZeroEmailResponseData
{
	userId: number;
	signup_phase?: number;
	// other fields if any
}

export async function submitSignupStageZeroEmail(
	data: SignupStageZeroEmailData,
	csrf: CsrfData
): Promise<GenericResponse<SignupStageZeroEmailResponseData>>
{
	const postData =
	{
		...data,
		[csrf.csrfParam]: csrf.csrfToken,
	};
	
	const response = await apiClient.post(ENDPOINTS.signup.stageZeroEmail, postData,
	{
		headers: { 'X-CSRF-Token': csrf.csrfToken },
	});
	
	return response.data;
}

/**
* Stage/step One - Verify token
*/
export interface SignupStageOneVerifyData
{
	userId: number;
	token: string;
}

export async function submitSignupStageOneVerify(
	data: SignupStageOneVerifyData,
	csrf: CsrfData
): Promise<GenericResponse>
{
	const postData =
	{
		...data,
		[csrf.csrfParam]: csrf.csrfToken,
	};
	
	const response = await apiClient.post(ENDPOINTS.signup.stageOneVerify, postData,
	{
		headers: { 'X-CSRF-Token': csrf.csrfToken },
	});
	
	return response.data;
}

/**
* Stage/step Two - Credentials(Password, bearer token, etc)
*/
export interface SignupStageTwoCredentialsData
{
	fullName: string;
	password: string;
	passwordRepeat: string;
}

export interface SignupStageTwoCredentialsResponseData
{
	token: string;
	userId?: number;
	signup_phase?: number;
}

export async function submitSignupStageTwoCredentials(
	userId: number,
	data: SignupStageTwoCredentialsData,
	csrf: CsrfData
): Promise<GenericResponse<SignupStageTwoCredentialsResponseData>>
{
	const postData =
	{
		...data,
		[csrf.csrfParam]: csrf.csrfToken,
	};
	
	const response = await apiClient.post(ENDPOINTS.signup.stageTwoCredentials, postData,
	{
		headers: { 'X-CSRF-Token': csrf.csrfToken },
	});
	
	return response.data;
}

/**
* Stage Three - Category
*/
export interface SignupStageThreeCategoryData
{
	category: string;
}

export interface SignupStageThreeCategoryResponseData
{
	// define any specific data expected from this step
	signup_phase?: number;
}

export async function submitSignupStageThreeCategory(
	userId: number,
	data: SignupStageThreeCategoryData,
	csrf: CsrfData
): Promise<GenericResponse<SignupStageThreeCategoryResponseData>>
{
	const postData =
	{
		...data,
		[csrf.csrfParam]: csrf.csrfToken,
	};
	
	const response = await apiClient.post(ENDPOINTS.signup.stageThreeCategory, postData,
	{
		headers: { 'X-CSRF-Token': csrf.csrfToken },
	});
	
	return response.data;
}

These are the api calls im makin, each stage correct? So my calls need to match them like this? 


const response: GenericResponse<{ 
	userId: number;
	signup_phase?: number
}> = await signupService.submitSignupStageZeroEmail(
{
	email
},
	csrf
);

right?