How to Integrate Lovable with Skype

Navigate to portal.azure.com and sign in with your Microsoft 365 or Azure account. Go to 'Azure Active Directory' (now called Microsoft Entra ID) → 'App registrations' in the left sidebar, then click 'New registration'. Give the app a name like 'Lovable Communication Integration', select 'Accounts in this organizational directory only' for single-tenant access (or multi-tenant if building for multiple organizations), and set a redirect URI if needed for user-delegated flows. After creation, note the Application (client) ID and the Directory (tenant) ID from the Overview page — you will need both for authentication. Go to 'Certificates & secrets' → 'Client secrets' → 'New client secret'. Add a description and set an expiry period (12 months or 24 months — set a calendar reminder to rotate before expiry). Copy the Value field immediately — it is only shown once. Next, go to 'API permissions' → 'Add a permission' → 'Microsoft Graph'. Select 'Application permissions' for server-to-server calls (no user login required). Add: Presence.Read.All (to read presence), OnlineMeetings.ReadWrite.All (to create meetings), and User.Read.All (to look up users). After adding permissions, click 'Grant admin consent for {your tenant}' — this requires a Global Admin or Application Admin role in your Azure AD tenant.

Open the Cloud tab in your Lovable editor by clicking the '+' panel icon at the top right, then select Cloud. Scroll to the Secrets section and add three secrets. Create MICROSOFT_CLIENT_ID and paste the Application (client) ID (UUID format). Create MICROSOFT_CLIENT_SECRET and paste the client secret Value (a long string shown only at creation time). Create MICROSOFT_TENANT_ID and paste the Directory (tenant) ID (UUID format). These three values together allow the Edge Function to authenticate as your Azure AD application. The Microsoft Graph API client credentials flow uses these to obtain access tokens scoped to the Microsoft Graph resource. The client secret expires on the date you set — Lovable's Secrets panel will continue to return the stored value after expiry, but Graph API calls will fail with 401 until you rotate the secret in Azure AD and update the Secrets panel. Lovable's SOC 2 Type II infrastructure encrypts all secrets at rest, and Lovable actively blocks approximately 1,200 hardcoded credentials per day.

The Edge Function needs to obtain an access token from Microsoft identity using the client credentials flow, then call the appropriate Graph API endpoint. The token endpoint for client credentials is: https://login.microsoftonline.com/{tenantId}/oauth2/v2.0/token with grant_type=client_credentials, client_id, client_secret, and scope=https://graph.microsoft.com/.default. For presence checking, the endpoint is GET https://graph.microsoft.com/v1.0/users/{userId}/presence where userId is the Azure AD user ID or UPN (user@domain.com). The response includes availability (Available, Busy, Away, DoNotDisturb) and activity. For creating Teams online meetings, POST to https://graph.microsoft.com/v1.0/users/{organizerUserId}/onlineMeetings with subject, startDateTime, and endDateTime. This creates a Teams meeting owned by the specified user — the user must be licensed for Teams and the app must have OnlineMeetings.ReadWrite.All permission. The response includes joinWebUrl. Note that this creates a Teams meeting, not a Skype meeting — this is correct behavior for Microsoft's current platform. If you specifically need Skype consumer functionality, that is not available via API in 2026.

1// supabase/functions/microsoft-graph/index.ts
2import { serve } from 'https://deno.land/std@0.168.0/http/server.ts';
3
4const corsHeaders = {
5  'Access-Control-Allow-Origin': '*',
6  'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
7};
8
9async function getMicrosoftToken(tenantId: string, clientId: string, clientSecret: string): Promise<string> {
10  const res = await fetch(
11    `https://login.microsoftonline.com/${tenantId}/oauth2/v2.0/token`,
12    {
13      method: 'POST',
14      headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
15      body: new URLSearchParams({
16        grant_type: 'client_credentials',
17        client_id: clientId,
18        client_secret: clientSecret,
19        scope: 'https://graph.microsoft.com/.default',
20      }),
21    }
22  );
23  if (!res.ok) throw new Error(`Microsoft auth error: ${await res.text()}`);
24  const data = await res.json();
25  return data.access_token;
26}
27
28serve(async (req) => {
29  if (req.method === 'OPTIONS') return new Response('ok', { headers: corsHeaders });
30
31  try {
32    const clientId = Deno.env.get('MICROSOFT_CLIENT_ID')!;
33    const clientSecret = Deno.env.get('MICROSOFT_CLIENT_SECRET')!;
34    const tenantId = Deno.env.get('MICROSOFT_TENANT_ID')!;
35    const { action, userId, subject, startDateTime, endDateTime } = await req.json();
36
37    const token = await getMicrosoftToken(tenantId, clientId, clientSecret);
38    const headers = { 'Authorization': `Bearer ${token}`, 'Content-Type': 'application/json' };
39
40    if (action === 'presence') {
41      const res = await fetch(`https://graph.microsoft.com/v1.0/users/${userId}/presence`, { headers });
42      const data = await res.json();
43      return new Response(JSON.stringify(data), { headers: { ...corsHeaders, 'Content-Type': 'application/json' } });
44    }
45
46    if (action === 'create_meeting') {
47      const res = await fetch(`https://graph.microsoft.com/v1.0/users/${userId}/onlineMeetings`, {
48        method: 'POST',
49        headers,
50        body: JSON.stringify({ subject, startDateTime, endDateTime }),
51      });
52      const data = await res.json();
53      if (!res.ok) throw new Error(`Meeting error: ${JSON.stringify(data)}`);
54      return new Response(
55        JSON.stringify({ joinWebUrl: data.joinWebUrl, meetingId: data.id }),
56        { headers: { ...corsHeaders, 'Content-Type': 'application/json' } }
57      );
58    }
59
60    throw new Error('Invalid action');
61  } catch (error) {
62    return new Response(
63      JSON.stringify({ error: error.message }),
64      { status: 500, headers: { ...corsHeaders, 'Content-Type': 'application/json' } }
65    );
66  }
67});

Use Lovable's chat to build the frontend components that use the microsoft-graph Edge Function. For presence checking, create a user lookup component that accepts an email address or Azure AD user ID, calls the Edge Function with action='presence', and displays the availability status with an appropriate color indicator. For meeting creation, build a form that accepts meeting subject and time, calls the Edge Function with action='create_meeting' and an organizer user ID, and displays the Teams join URL. Store the joinWebUrl and meeting ID in your Supabase meetings table. Note that user IDs in Microsoft Graph can be either the Azure AD Object ID (UUID) or the user's UPN (email@domain.com). Using the UPN is more user-friendly and works well for organizational users. For the organizer user ID in meeting creation, you may want to use a dedicated 'room' or 'bot' account's Azure AD ID rather than a personal user account to keep meetings separate from individual calendars.