How to Build a Privacy Tools with Lovable

1Build a privacy compliance toolkit. Create these Supabase tables:
2
3- privacy_policies: id, version (text, e.g. '2024-01'), content (text, full policy markdown), summary_of_changes (text), effective_date (date), created_at, is_current (bool default false)
4
5- consent_records: id, user_id (FK auth.users), policy_version (text), accepted_at (timestamptz), ip_address (text, for audit), user_agent (text, for audit), UNIQUE(user_id, policy_version)
6
7- consent_preferences: id, user_id (FK auth.users UNIQUE), analytics_consent (bool default false), marketing_consent (bool default false), functional_consent (bool default true), last_updated_at
8
9- deletion_requests: id, user_id, email (text, stored separately since user will be deleted), requested_at, status (pending|processing|completed|failed), completed_at, error_message
10
11RLS:
12- privacy_policies: public SELECT for is_current = true; admin INSERT/UPDATE
13- consent_records: user_id = auth.uid() for SELECT/INSERT; service_role for DELETE
14- consent_preferences: user_id = auth.uid() for SELECT/UPDATE
15- deletion_requests: user_id = auth.uid() for INSERT and SELECT; service_role for updates
16
17Create a view current_privacy_policy that returns the single row WHERE is_current = true.

1Build two consent components:
2
31. Consent Banner at src/components/privacy/ConsentBanner.tsx:
4   - Display at the bottom of the screen as a fixed sticky bar
5   - Fetch the current privacy policy version from current_privacy_policy view
6   - Check consent_records: if no row exists for current user + current version, show the banner
7   - Banner content: 'We updated our privacy policy. Please review and accept to continue.' with a link to the full policy
8   - Buttons: 'Accept All' and 'Customize'
9   - 'Accept All' inserts into consent_records with current version and sets all consent_preferences to true
10   - 'Customize' opens the preference center Dialog
11   - Once accepted, hide the banner using local state (don't show again until next policy version)
12
132. Consent Preference Center Dialog at src/components/privacy/ConsentPreferences.tsx:
14   - Three switches with labels and descriptions:
15     - Functional (required, Switch disabled and always on): 'Required for the app to function'
16     - Analytics (optional, Switch): 'Help us improve by tracking feature usage anonymously'
17     - Marketing (optional, Switch): 'Receive product updates and promotional emails'
18   - 'Save Preferences' Button: upserts consent_preferences and inserts/upserts consent_records for current policy version
19   - Show last updated date below the switches
20   - Link to privacy policy page

1// supabase/functions/export-user-data/index.ts
2import { serve } from 'https://deno.land/std@0.168.0/http/server.ts'
3import { createClient } from 'https://esm.sh/@supabase/supabase-js@2'
4
5const corsHeaders = {
6  'Access-Control-Allow-Origin': '*',
7  'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
8}
9
10serve(async (req: Request) => {
11  if (req.method === 'OPTIONS') return new Response('ok', { headers: corsHeaders })
12
13  const authHeader = req.headers.get('Authorization')
14  if (!authHeader) return new Response(JSON.stringify({ error: 'Unauthorized' }), { status: 401, headers: corsHeaders })
15
16  const userClient = createClient(Deno.env.get('SUPABASE_URL') ?? '', Deno.env.get('SUPABASE_ANON_KEY') ?? '', {
17    global: { headers: { Authorization: authHeader } },
18  })
19  const serviceClient = createClient(Deno.env.get('SUPABASE_URL') ?? '', Deno.env.get('SUPABASE_SERVICE_ROLE_KEY') ?? '')
20
21  const { data: { user }, error: authError } = await userClient.auth.getUser()
22  if (authError || !user) return new Response(JSON.stringify({ error: 'Invalid session' }), { status: 401, headers: corsHeaders })
23
24  const userId = user.id
25
26  const [consentRecords, consentPreferences, deletionRequests] = await Promise.all([
27    serviceClient.from('consent_records').select('*').eq('user_id', userId),
28    serviceClient.from('consent_preferences').select('*').eq('user_id', userId).single(),
29    serviceClient.from('deletion_requests').select('*').eq('user_id', userId),
30  ])
31
32  // Add queries for all other app-specific user tables here
33  const exportData = {
34    export_date: new Date().toISOString(),
35    user: { id: userId, email: user.email, created_at: user.created_at },
36    consent_records: consentRecords.data ?? [],
37    consent_preferences: consentPreferences.data ?? null,
38    deletion_requests: deletionRequests.data ?? [],
39    // Add other tables here: profiles, posts, orders, etc.
40  }
41
42  return new Response(JSON.stringify(exportData, null, 2), {
43    headers: { ...corsHeaders, 'Content-Type': 'application/json', 'Content-Disposition': `attachment; filename="data-export-${userId.slice(0, 8)}.json"` },
44  })
45})

1Build two features:
2
31. Account deletion Edge Function at supabase/functions/delete-user-data/index.ts:
4   - Authenticate the user the same way as the export function
5   - Insert a deletion_requests row with status='processing'
6   - Using the service_role client, delete all user data in this order:
7     a. Delete from all app-specific tables by user_id (consent_records, consent_preferences, all other user tables)
8     b. Delete any Supabase Storage objects owned by the user: list all objects with user_id in name, delete them
9     c. Call supabase.auth.admin.deleteUser(userId) to delete the auth user
10   - Update deletion_requests row: status='completed', completed_at=now()
11   - If any step fails, set status='failed' and error_message, do NOT proceed with auth deletion
12   - Return { success: true } on completion
13
142. Privacy Dashboard page at src/pages/PrivacyDashboard.tsx:
15   - Tabs: 'My Consent', 'My Data', 'Delete Account'
16   - My Consent tab: show all consent_records as a timeline, consent_preferences switches (edit in place)
17   - My Data tab: show counts per table (e.g. 'Profile: 1 record', 'Orders: 12 records'), 'Download My Data' Button that calls export-user-data Edge Function
18   - Delete Account tab: danger zone with red styling. Steps: 'This is permanent and cannot be undone', a checkbox 'I understand this is permanent', a text Input requiring the user to type their email, 'Delete My Account' Button (destructive). On confirm: calls delete-user-data Edge Function and redirects to a farewell page.