feat: improve consulting booking UX - allow single slot selection
- Add pending slot state to distinguish between selected and confirmed slots - First click: slot shows as pending (amber) with "Pilih" label - Second click (same slot): confirms single slot selection - Second click (different slot): creates range from pending to clicked slot - Fix "Body already consumed" error in OAuth token refresh - Enhance admin consulting slot display with category and notes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -50,15 +50,16 @@ async function getGoogleAccessToken(oauthConfig: GoogleOAuthConfig): Promise<{ a
|
||||
body: new URLSearchParams(tokenRequest),
|
||||
});
|
||||
|
||||
const responseText = await response.text();
|
||||
console.log("Token response status:", response.status);
|
||||
console.log("Token response body:", responseText);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`Token exchange failed: ${responseText}`);
|
||||
const errorText = await response.text();
|
||||
console.error("Token response error:", errorText);
|
||||
throw new Error(`Token exchange failed: ${errorText}`);
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
console.log("Token response data:", JSON.stringify(data, null, 2));
|
||||
|
||||
if (!data.access_token) {
|
||||
throw new Error("No access token in response");
|
||||
@@ -80,6 +81,12 @@ serve(async (req: Request): Promise<Response> => {
|
||||
return new Response(null, { headers: corsHeaders });
|
||||
}
|
||||
|
||||
const logs: string[] = [];
|
||||
const log = (msg: string) => {
|
||||
console.log(msg);
|
||||
logs.push(msg);
|
||||
};
|
||||
|
||||
try {
|
||||
const supabaseUrl = Deno.env.get("SUPABASE_URL")!;
|
||||
const supabaseServiceKey = Deno.env.get("SUPABASE_SERVICE_ROLE_KEY")!;
|
||||
@@ -96,46 +103,60 @@ serve(async (req: Request): Promise<Response> => {
|
||||
};
|
||||
|
||||
try {
|
||||
log("Starting to read request body...");
|
||||
debugInfo.bodyReadAttempt = "Starting req.text()";
|
||||
const bodyText = await req.text();
|
||||
debugInfo.bodyLength = bodyText.length;
|
||||
debugInfo.bodyPreview = bodyText.substring(0, 200);
|
||||
console.log("Raw body text:", bodyText.substring(0, 100) + "...");
|
||||
log(`Raw body text: ${bodyText.substring(0, 100)}...`);
|
||||
body = JSON.parse(bodyText);
|
||||
debugInfo.parsedBody = body;
|
||||
log(`Parsed body: ${JSON.stringify(body)}`);
|
||||
} catch (bodyError) {
|
||||
debugInfo.readError = (bodyError as Error).message;
|
||||
console.error("Error reading body:", bodyError);
|
||||
console.error("Debug info:", JSON.stringify(debugInfo, null, 2));
|
||||
log(`Error reading body: ${(bodyError as Error).message}`);
|
||||
log(`Debug info: ${JSON.stringify(debugInfo, null, 2)}`);
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Invalid request body: " + (bodyError as Error).message,
|
||||
debug: debugInfo
|
||||
debug: debugInfo,
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 400, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
}
|
||||
console.log("Creating Google Meet event for slot:", body.slot_id);
|
||||
log(`Creating Google Meet event for slot: ${body.slot_id}`);
|
||||
|
||||
// Get platform settings
|
||||
log("Fetching platform settings...");
|
||||
const { data: settings, error: settingsError } = await supabase
|
||||
.from("platform_settings")
|
||||
.select("integration_google_calendar_id, google_oauth_config")
|
||||
.single();
|
||||
|
||||
if (settingsError) {
|
||||
console.error("Error fetching settings:", settingsError);
|
||||
throw settingsError;
|
||||
}
|
||||
|
||||
const calendarId = settings?.integration_google_calendar_id;
|
||||
|
||||
if (!calendarId) {
|
||||
log(`Error fetching settings: ${JSON.stringify(settingsError)}`);
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Google Calendar ID belum dikonfigurasi di Pengaturan > Integrasi"
|
||||
message: "Error fetching settings: " + settingsError.message,
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
}
|
||||
|
||||
const calendarId = settings?.integration_google_calendar_id;
|
||||
log(`Calendar ID: ${calendarId}`);
|
||||
|
||||
if (!calendarId) {
|
||||
log("Calendar ID not configured");
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Google Calendar ID belum dikonfigurasi di Pengaturan > Integrasi",
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 400, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
@@ -145,10 +166,12 @@ serve(async (req: Request): Promise<Response> => {
|
||||
const oauthConfigJson = settings?.google_oauth_config;
|
||||
|
||||
if (!oauthConfigJson) {
|
||||
log("OAuth config not found");
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Google OAuth Config belum dikonfigurasi. Tambahkan di Pengaturan > Integrasi. Format: {\"client_id\":\"...\",\"client_secret\":\"...\",\"refresh_token\":\"...\"}"
|
||||
message: "Google OAuth Config belum dikonfigurasi. Tambahkan di Pengaturan > Integrasi. Format: {\"client_id\":\"...\",\"client_secret\":\"...\",\"refresh_token\":\"...\"}",
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 400, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
@@ -158,12 +181,14 @@ serve(async (req: Request): Promise<Response> => {
|
||||
let oauthConfig: GoogleOAuthConfig;
|
||||
try {
|
||||
oauthConfig = JSON.parse(oauthConfigJson);
|
||||
log("OAuth config parsed successfully");
|
||||
} catch (error: any) {
|
||||
console.error("Failed to parse OAuth config JSON:", error);
|
||||
log(`Failed to parse OAuth config: ${error.message}`);
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Format Google OAuth Config tidak valid: " + error.message
|
||||
message: "Format Google OAuth Config tidak valid: " + error.message,
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 400, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
@@ -175,11 +200,11 @@ serve(async (req: Request): Promise<Response> => {
|
||||
|
||||
if (oauthConfig.access_token && oauthConfig.expires_at && oauthConfig.expires_at > now + 60) {
|
||||
// Token is still valid (with 60 second buffer)
|
||||
console.log("Using cached access_token (expires at:", new Date(oauthConfig.expires_at * 1000).toISOString(), ")");
|
||||
log(`Using cached access_token (expires at: ${new Date(oauthConfig.expires_at * 1000).toISOString()})`);
|
||||
accessToken = oauthConfig.access_token;
|
||||
} else {
|
||||
// Need to refresh the token
|
||||
console.log("Access token expired or missing, refreshing...");
|
||||
log("Access token expired or missing, refreshing...");
|
||||
const tokenData = await getGoogleAccessToken(oauthConfig);
|
||||
accessToken = tokenData.access_token;
|
||||
|
||||
@@ -197,15 +222,17 @@ serve(async (req: Request): Promise<Response> => {
|
||||
.update({ google_oauth_config: JSON.stringify(updatedConfig) })
|
||||
.eq("id", settings.id);
|
||||
|
||||
console.log("Updated cached access_token in database");
|
||||
log("Updated cached access_token in database");
|
||||
}
|
||||
console.log("Got access token");
|
||||
log("Got access token");
|
||||
|
||||
// Build event data
|
||||
// Include +07:00 timezone offset to ensure times are treated as Asia/Jakarta time
|
||||
const startDate = new Date(`${body.date}T${body.start_time}+07:00`);
|
||||
const endDate = new Date(`${body.date}T${body.end_time}+07:00`);
|
||||
|
||||
log(`Event time: ${startDate.toISOString()} to ${endDate.toISOString()}`);
|
||||
|
||||
const eventData = {
|
||||
summary: `Konsultasi: ${body.topic} - ${body.client_name}`,
|
||||
description: `Client: ${body.client_email}\n\nNotes: ${body.notes || '-'}\n\nSlot ID: ${body.slot_id}`,
|
||||
@@ -227,12 +254,13 @@ serve(async (req: Request): Promise<Response> => {
|
||||
},
|
||||
};
|
||||
|
||||
console.log("Creating event in calendar:", calendarId);
|
||||
console.log("Event data:", JSON.stringify(eventData, null, 2));
|
||||
log(`Creating event in calendar: ${calendarId}`);
|
||||
log(`Event data: ${JSON.stringify(eventData, null, 2)}`);
|
||||
|
||||
// Create event via Google Calendar API with better error handling
|
||||
let calendarResponse: Response;
|
||||
try {
|
||||
log("Calling Google Calendar API...");
|
||||
calendarResponse = await fetch(
|
||||
`https://www.googleapis.com/calendar/v3/calendars/${encodeURIComponent(calendarId)}/events?conferenceDataVersion=1`,
|
||||
{
|
||||
@@ -246,50 +274,73 @@ serve(async (req: Request): Promise<Response> => {
|
||||
}
|
||||
);
|
||||
} catch (fetchError: any) {
|
||||
console.error("Network error calling Google Calendar API:", fetchError);
|
||||
log(`Network error calling Google Calendar API: ${fetchError.message}`);
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Network error calling Google Calendar API: " + fetchError.message
|
||||
message: "Network error calling Google Calendar API: " + fetchError.message,
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
}
|
||||
|
||||
console.log("Calendar API response status:", calendarResponse.status);
|
||||
log(`Calendar API response status: ${calendarResponse.status}`);
|
||||
|
||||
if (!calendarResponse.ok) {
|
||||
const errorText = await calendarResponse.text();
|
||||
console.error("Google Calendar API error:", errorText);
|
||||
log(`Google Calendar API error: ${errorText}`);
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Gagal membuat event di Google Calendar: " + errorText
|
||||
message: "Gagal membuat event di Google Calendar: " + errorText,
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
}
|
||||
|
||||
const eventDataResult = await calendarResponse.json();
|
||||
console.log("Event created:", eventDataResult.id);
|
||||
console.log("Full event response:", JSON.stringify(eventDataResult, null, 2));
|
||||
log(`Event created with ID: ${eventDataResult.id}`);
|
||||
log(`Full event response: ${JSON.stringify(eventDataResult, null, 2)}`);
|
||||
|
||||
// Check if conference data was created
|
||||
if (eventDataResult.conferenceData && eventDataResult.conferenceData.entryPoints) {
|
||||
const meetLink = eventDataResult.conferenceData.entryPoints.find((ep: any) => ep.entryPointType === "video")?.uri;
|
||||
|
||||
if (meetLink) {
|
||||
await supabase
|
||||
.from("consulting_slots")
|
||||
.update({ meet_link: meetLink })
|
||||
.eq("id", body.slot_id);
|
||||
log(`Meet link found: ${meetLink}`);
|
||||
|
||||
// If this is part of a multi-slot order, update all slots with the same order_id
|
||||
// First, check if this slot has an order_id
|
||||
const { data: slotData } = await supabase
|
||||
.from("consulting_slots")
|
||||
.select("order_id")
|
||||
.eq("id", body.slot_id)
|
||||
.single();
|
||||
|
||||
if (slotData?.order_id) {
|
||||
log(`Updating all slots in order ${slotData.order_id} with meet_link`);
|
||||
await supabase
|
||||
.from("consulting_slots")
|
||||
.update({ meet_link: meetLink })
|
||||
.eq("order_id", slotData.order_id);
|
||||
} else {
|
||||
log(`No order_id found, updating only slot ${body.slot_id}`);
|
||||
await supabase
|
||||
.from("consulting_slots")
|
||||
.update({ meet_link: meetLink })
|
||||
.eq("id", body.slot_id);
|
||||
}
|
||||
|
||||
log("Successfully completed");
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: true,
|
||||
meet_link: meetLink,
|
||||
event_id: eventDataResult.id,
|
||||
html_link: eventDataResult.htmlLink,
|
||||
logs: logs
|
||||
}),
|
||||
{ headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
@@ -298,36 +349,60 @@ serve(async (req: Request): Promise<Response> => {
|
||||
|
||||
// Fallback to hangoutLink for backwards compatibility
|
||||
if (eventDataResult.hangoutLink) {
|
||||
await supabase
|
||||
.from("consulting_slots")
|
||||
.update({ meet_link: eventDataResult.hangoutLink })
|
||||
.eq("id", body.slot_id);
|
||||
log(`Using hangoutLink: ${eventDataResult.hangoutLink}`);
|
||||
|
||||
// If this is part of a multi-slot order, update all slots with the same order_id
|
||||
const { data: slotData } = await supabase
|
||||
.from("consulting_slots")
|
||||
.select("order_id")
|
||||
.eq("id", body.slot_id)
|
||||
.single();
|
||||
|
||||
if (slotData?.order_id) {
|
||||
log(`Updating all slots in order ${slotData.order_id} with meet_link`);
|
||||
await supabase
|
||||
.from("consulting_slots")
|
||||
.update({ meet_link: eventDataResult.hangoutLink })
|
||||
.eq("order_id", slotData.order_id);
|
||||
} else {
|
||||
log(`No order_id found, updating only slot ${body.slot_id}`);
|
||||
await supabase
|
||||
.from("consulting_slots")
|
||||
.update({ meet_link: eventDataResult.hangoutLink })
|
||||
.eq("id", body.slot_id);
|
||||
}
|
||||
|
||||
log("Successfully completed");
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: true,
|
||||
meet_link: eventDataResult.hangoutLink,
|
||||
event_id: eventDataResult.id,
|
||||
html_link: eventDataResult.htmlLink,
|
||||
logs: logs
|
||||
}),
|
||||
{ headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
}
|
||||
|
||||
log("Event created but no meet link found");
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: "Event berhasil dibuat tapi tidak ada meet link"
|
||||
message: "Event berhasil dibuat tapi tidak ada meet link",
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
|
||||
} catch (error: any) {
|
||||
console.error("Error creating Google Meet event:", error);
|
||||
log(`Error creating Google Meet event: ${error.message}`);
|
||||
log(`Stack: ${error.stack}`);
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
message: error.message || "Unknown error occurred"
|
||||
message: error.message || "Unknown error occurred",
|
||||
logs: logs
|
||||
}),
|
||||
{ status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user