S
Supabase•2w ago
Floppy Disk

Best practises for supabase edge functions?

Hi, I have following file tree in my supabase edge functions project: 
 supabase/functions/
  ├── aggregation/
  │   └── index.ts    # Fetches and aggregates project/survey data with responses
  ├── new-response-notification/
  │   └── index.ts    # Webhook handler that sends email notifications for new responses
  ├── invite-user-to-org/
  │   └── index.ts    # Adds/invites users to organisations with permission checks
  ├── invite-user-to-project/
  │   └── index.ts    # Adds/invites users to specific projects with role validation
  ├── _utils/
  │   ├── .env        # Environment variables for edge functions
  │   ├── supabase_types.ts # Database type definitions (duplicate, see types/ folder)
  │   ├── _shared/
  │   │   └── cors.ts # CORS headers configuration for API responses
  │   ├── email/
  │   │   ├── elasticEmail.ts             # SMTP client setup and email sending via ElasticMail
  │   │   ├── emailTemplate.tsx           # React Email component for styled notification emails
  │   │   ├── emailTemplateRaw.ts         # Raw HTML/text email template generator functions
  │   │   ├── getProjectData.ts           # Fetches response/project data from DB via RPC
  │   │   └── mail.tsx                    # Email template generator wrapper using React Email
  │   ├── supabase/
  │   │   └── index.ts                    # Supabase client factories (service, anon, user-scoped)
  │   └── types/
  │       ├── types.ts                    # Custom TypeScript types (EmailProps, User)
  │       └── supabase_types.ts           # Database schema types from Supabase CLI
  └── import_map.json                      # Deno import mappings for dependencies and path aliases
 supabase/functions/
  ├── aggregation/
  │   └── index.ts    # Fetches and aggregates project/survey data with responses
  ├── new-response-notification/
  │   └── index.ts    # Webhook handler that sends email notifications for new responses
  ├── invite-user-to-org/
  │   └── index.ts    # Adds/invites users to organisations with permission checks
  ├── invite-user-to-project/
  │   └── index.ts    # Adds/invites users to specific projects with role validation
  ├── _utils/
  │   ├── .env        # Environment variables for edge functions
  │   ├── supabase_types.ts # Database type definitions (duplicate, see types/ folder)
  │   ├── _shared/
  │   │   └── cors.ts # CORS headers configuration for API responses
  │   ├── email/
  │   │   ├── elasticEmail.ts             # SMTP client setup and email sending via ElasticMail
  │   │   ├── emailTemplate.tsx           # React Email component for styled notification emails
  │   │   ├── emailTemplateRaw.ts         # Raw HTML/text email template generator functions
  │   │   ├── getProjectData.ts           # Fetches response/project data from DB via RPC
  │   │   └── mail.tsx                    # Email template generator wrapper using React Email
  │   ├── supabase/
  │   │   └── index.ts                    # Supabase client factories (service, anon, user-scoped)
  │   └── types/
  │       ├── types.ts                    # Custom TypeScript types (EmailProps, User)
  │       └── supabase_types.ts           # Database schema types from Supabase CLI
  └── import_map.json                      # Deno import mappings for dependencies and path aliases
And I wonder if it's the preferred way to manage edge functions? What are some protips I could use? In the dashboard I can't see my util files what would be very handy because it's pain to work with edge functions from VSC (at least for me) so I guess I'm doing something wrong
3 Replies
ihm40
ihm40•2w ago
Similar to my other thread there is not preferred way, try make edge functions compact and try make use of util files for code that is repeated often.
ihm40
ihm40•2w ago
in the ui there is this
No description
ihm40
ihm40•2w ago
Where you can add a file to edge functions if you want to manage them form the UI though there is no shared interface between edge functions like a shared folder when using vs code so i suspect you would have to copy code over to each edge function at which point using vs code is easier.

Did you find this page helpful?