style: formatted and added example env

.vscode/settings.json

@@ -23,7 +23,10 @@
   "tailwindCSS.experimental.classRegex": [
     ["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
     ["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"],
-    ["\\b\\w+ClassName\\s*=\\s*[\"'`]([^\"'`]*)[\"'`]", "[\"'`]([^\"'`]*)[\"'`]" ]
+    [
+      "\\b\\w+ClassName\\s*=\\s*[\"'`]([^\"'`]*)[\"'`]",
+      "[\"'`]([^\"'`]*)[\"'`]"
+    ]
   ],
   "typescript.enablePromptUseWorkspaceTsdk": true,
   "typescript.tsdk": "node_modules/typescript/lib",

apps/public/lib/utils.ts

@@ -1,6 +1,6 @@
-import { clsx, type ClassValue } from "clsx"
+import { clsx, type ClassValue } from 'clsx';
-import { twMerge } from "tailwind-merge"
+import { twMerge } from 'tailwind-merge';
 
 export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
+  return twMerge(clsx(inputs));
 }

apps/public/tailwind.config.js

@@ -2,8 +2,8 @@ import { createPreset } from 'fumadocs-ui/tailwind-plugin';
 
 /** @type {import('tailwindcss').Config} */
 export default {
-    darkMode: ['class'],
+  darkMode: ['class'],
-    content: [
+  content: [
     './components/**/*.{ts,tsx}',
     './app/**/*.{ts,tsx}',
     './content/**/*.{md,mdx}',
@@ -11,88 +11,88 @@ export default {
     './node_modules/fumadocs-ui/dist/**/*.js',
   ],
   presets: [createPreset()],
-	plugins: [require("tailwindcss-animate")],
+  plugins: [require('tailwindcss-animate')],
-	corePlugins: {
+  corePlugins: {
-		container: false
+    container: false,
-	},
+  },
-	theme: {
+  theme: {
-    	extend: {
+    extend: {
-				screens: {
+      screens: {
-					article: '1530px',
+        article: '1530px',
-				},
+      },
-    		borderRadius: {
+      borderRadius: {
-    			lg: 'var(--radius)',
+        lg: 'var(--radius)',
-    			md: 'calc(var(--radius) - 2px)',
+        md: 'calc(var(--radius) - 2px)',
-    			sm: 'calc(var(--radius) - 4px)'
+        sm: 'calc(var(--radius) - 4px)',
-    		},
+      },
-    		colors: {
+      colors: {
-    			background: 'hsl(var(--background))',
+        background: 'hsl(var(--background))',
-    			'background-light': 'hsl(var(--background-light))',
+        'background-light': 'hsl(var(--background-light))',
-    			'background-dark': 'hsl(var(--background-dark))',
+        'background-dark': 'hsl(var(--background-dark))',
-    			foreground: 'hsl(var(--foreground))',
+        foreground: 'hsl(var(--foreground))',
-    			'foreground-dark': 'hsl(var(--foreground-dark))',
+        'foreground-dark': 'hsl(var(--foreground-dark))',
-    			'foreground-light': 'hsl(var(--foreground-light))',
+        'foreground-light': 'hsl(var(--foreground-light))',
-    			card: {
+        card: {
-    				DEFAULT: 'hsl(var(--card))',
+          DEFAULT: 'hsl(var(--card))',
-    				foreground: 'hsl(var(--card-foreground))'
+          foreground: 'hsl(var(--card-foreground))',
-    			},
+        },
-    			popover: {
+        popover: {
-    				DEFAULT: 'hsl(var(--popover))',
+          DEFAULT: 'hsl(var(--popover))',
-    				foreground: 'hsl(var(--popover-foreground))'
+          foreground: 'hsl(var(--popover-foreground))',
-    			},
+        },
-    			primary: {
+        primary: {
-    				DEFAULT: 'hsl(var(--primary))',
+          DEFAULT: 'hsl(var(--primary))',
-    				foreground: 'hsl(var(--primary-foreground))'
+          foreground: 'hsl(var(--primary-foreground))',
-    			},
+        },
-    			secondary: {
+        secondary: {
-    				DEFAULT: 'hsl(var(--secondary))',
+          DEFAULT: 'hsl(var(--secondary))',
-    				foreground: 'hsl(var(--secondary-foreground))'
+          foreground: 'hsl(var(--secondary-foreground))',
-    			},
+        },
-    			muted: {
+        muted: {
-    				DEFAULT: 'hsl(var(--muted))',
+          DEFAULT: 'hsl(var(--muted))',
-    				foreground: 'hsl(var(--muted-foreground))'
+          foreground: 'hsl(var(--muted-foreground))',
-    			},
+        },
-    			accent: {
+        accent: {
-    				DEFAULT: 'hsl(var(--accent))',
+          DEFAULT: 'hsl(var(--accent))',
-    				foreground: 'hsl(var(--accent-foreground))'
+          foreground: 'hsl(var(--accent-foreground))',
-    			},
+        },
-    			destructive: {
+        destructive: {
-    				DEFAULT: 'hsl(var(--destructive))',
+          DEFAULT: 'hsl(var(--destructive))',
-    				foreground: 'hsl(var(--destructive-foreground))'
+          foreground: 'hsl(var(--destructive-foreground))',
-    			},
+        },
-    			border: 'hsl(var(--border))',
+        border: 'hsl(var(--border))',
-    			input: 'hsl(var(--input))',
+        input: 'hsl(var(--input))',
-    			ring: 'hsl(var(--ring))',
+        ring: 'hsl(var(--ring))',
-    			chart: {
+        chart: {
-    				'1': 'hsl(var(--chart-1))',
+          1: 'hsl(var(--chart-1))',
-    				'2': 'hsl(var(--chart-2))',
+          2: 'hsl(var(--chart-2))',
-    				'3': 'hsl(var(--chart-3))',
+          3: 'hsl(var(--chart-3))',
-    				'4': 'hsl(var(--chart-4))',
+          4: 'hsl(var(--chart-4))',
-    				'5': 'hsl(var(--chart-5))'
+          5: 'hsl(var(--chart-5))',
-    			}
+        },
-    		},
+      },
-    		keyframes: {
+      keyframes: {
-    			'accordion-down': {
+        'accordion-down': {
-    				from: {
+          from: {
-    					height: '0'
+            height: '0',
-    				},
+          },
-    				to: {
+          to: {
-    					height: 'var(--radix-accordion-content-height)'
+            height: 'var(--radix-accordion-content-height)',
-    				}
+          },
-    			},
+        },
-    			'accordion-up': {
+        'accordion-up': {
-    				from: {
+          from: {
-    					height: 'var(--radix-accordion-content-height)'
+            height: 'var(--radix-accordion-content-height)',
-    				},
+          },
-    				to: {
+          to: {
-    					height: '0'
+            height: '0',
-    				}
+          },
-    			}
+        },
-    		},
+      },
-    		animation: {
+      animation: {
-    			'accordion-down': 'accordion-down 0.2s ease-out',
+        'accordion-down': 'accordion-down 0.2s ease-out',
-    			'accordion-up': 'accordion-up 0.2s ease-out'
+        'accordion-up': 'accordion-up 0.2s ease-out',
-    		}
+      },
-    	}
+    },
-    }
+  },
 };

packages/email/src/index.tsx

@@ -1,16 +1,16 @@
-import React from "react";
+import React from 'react';
-import { Resend } from "resend";
+import { Resend } from 'resend';
-import type { z } from "zod";
+import type { z } from 'zod';
 
-import { type TemplateKey, type Templates, templates } from "./emails";
+import { type TemplateKey, type Templates, templates } from './emails';
 
-const FROM = process.env.EMAIL_SENDER ?? "hello@openpanel.dev";
+const FROM = process.env.EMAIL_SENDER ?? 'hello@openpanel.dev';
 
 export async function sendEmail<T extends TemplateKey>(
   template: T,
   options: {
     to: string | string[];
-    data: z.infer<Templates[T]["schema"]>;
+    data: z.infer<Templates[T]['schema']>;
   },
 ) {
   const { to, data } = options;
@@ -18,7 +18,7 @@ export async function sendEmail<T extends TemplateKey>(
   const props = schema.safeParse(data);
 
   if (props.error) {
-    console.error("Failed to parse data", props.error);
+    console.error('Failed to parse data', props.error);
     return null;
   }
 
@@ -46,7 +46,7 @@ export async function sendEmail<T extends TemplateKey>(
 
     return res;
   } catch (error) {
-    console.error("Failed to send email", error);
+    console.error('Failed to send email', error);
     return null;
   }
 }

packages/integrations/tsconfig.json

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"],
+      "@/*": ["./src/*"]
     },
     "tsBuildInfoFile": "node_modules/.cache/tsbuildinfo.json"
   },

self-hosting/.env.template

@@ -13,3 +13,4 @@ DATABASE_URL_DIRECT="$DATABASE_URL_DIRECT"
 NEXT_PUBLIC_DASHBOARD_URL="$NEXT_PUBLIC_DASHBOARD_URL"
 NEXT_PUBLIC_API_URL="$NEXT_PUBLIC_API_URL"
 COOKIE_SECRET="$COOKIE_SECRET"
+EMAIL_SENDER=no-repy@openpanel.dev