@devwithbobby/loops 0.1.1 → 0.1.2

package/example/src/App.tsx

@@ -1,185 +0,0 @@
-import { useAction } from "convex/react";
-import { api } from "../convex/_generated/api";
-import { useState } from "react";
-import "./index.css";
-
-export function App() {
-	const [email, setEmail] = useState("");
-	const [firstName, setFirstName] = useState("");
-	const [lastName, setLastName] = useState("");
-	const [message, setMessage] = useState<{ type: "success" | "error"; text: string } | null>(null);
-
-	const addContact = useAction(api.example.addContact);
-	const sendEvent = useAction(api.example.sendEvent);
-	const [isLoading, setIsLoading] = useState(false);
-
-	const handleAddContact = async (e: React.FormEvent) => {
-		e.preventDefault();
-		setIsLoading(true);
-		setMessage(null);
-
-		try {
-			await addContact({
-				email,
-				firstName: firstName || undefined,
-				lastName: lastName || undefined,
-			});
-			setMessage({ type: "success", text: "Contact added successfully!" });
-			setEmail("");
-			setFirstName("");
-			setLastName("");
-		} catch (error) {
-			setMessage({
-				type: "error",
-				text: error instanceof Error ? error.message : "Failed to add contact",
-			});
-		} finally {
-			setIsLoading(false);
-		}
-	};
-
-	const handleSendEvent = async () => {
-		if (!email) {
-			setMessage({ type: "error", text: "Please enter an email first" });
-			return;
-		}
-
-		setIsLoading(true);
-		setMessage(null);
-
-		try {
-			await sendEvent({
-				email,
-				eventName: "welcome",
-				eventProperties: {
-					firstName: firstName || undefined,
-					lastName: lastName || undefined,
-				},
-			});
-			setMessage({ type: "success", text: "Event sent successfully!" });
-		} catch (error) {
-			setMessage({
-				type: "error",
-				text: error instanceof Error ? error.message : "Failed to send event",
-			});
-		} finally {
-			setIsLoading(false);
-		}
-	};
-
-	return (
-		<div className="min-h-screen bg-gray-50 w-full flex items-center justify-center p-4">
-			<div className="container mx-auto max-w-md">
-				<div className="bg-white rounded-lg shadow border border-gray-200 p-8">
-					<div className="text-center mb-8">
-						<h1 className="text-3xl font-bold text-gray-900 mb-2">
-							Loops Component
-						</h1>
-						<p className="text-gray-600 text-sm">
-							Powered by Convex Components & Loops.so
-						</p>
-					</div>
-
-					<form onSubmit={handleAddContact} className="space-y-4 mb-6">
-						<div>
-							<label
-								htmlFor="email"
-								className="block text-sm font-medium text-gray-700 mb-1"
-							>
-								Email *
-							</label>
-							<input
-								id="email"
-								type="email"
-								required
-								value={email}
-								onChange={(e) => setEmail(e.target.value)}
-								className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-								placeholder="user@example.com"
-							/>
-						</div>
-
-						<div>
-							<label
-								htmlFor="firstName"
-								className="block text-sm font-medium text-gray-700 mb-1"
-							>
-								First Name
-							</label>
-							<input
-								id="firstName"
-								type="text"
-								value={firstName}
-								onChange={(e) => setFirstName(e.target.value)}
-								className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-								placeholder="John"
-							/>
-						</div>
-
-						<div>
-							<label
-								htmlFor="lastName"
-								className="block text-sm font-medium text-gray-700 mb-1"
-							>
-								Last Name
-							</label>
-							<input
-								id="lastName"
-								type="text"
-								value={lastName}
-								onChange={(e) => setLastName(e.target.value)}
-								className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-								placeholder="Doe"
-							/>
-						</div>
-
-						<button
-							type="submit"
-							disabled={isLoading}
-							className="w-full bg-blue-600 text-white font-medium px-6 py-2 rounded-md hover:bg-blue-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
-						>
-							{isLoading ? "Adding..." : "Add Contact"}
-						</button>
-					</form>
-
-					<div className="mb-6">
-						<button
-							type="button"
-							onClick={handleSendEvent}
-							disabled={isLoading || !email}
-							className="w-full bg-green-600 text-white font-medium px-6 py-2 rounded-md hover:bg-green-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
-						>
-							Send Welcome Event
-						</button>
-					</div>
-
-					{message && (
-						<div
-							className={`p-4 rounded-md mb-4 ${
-								message.type === "success"
-									? "bg-green-50 border border-green-200 text-green-800"
-									: "bg-red-50 border border-red-200 text-red-800"
-							}`}
-						>
-							{message.text}
-						</div>
-					)}
-
-					<div className="bg-blue-50 rounded-lg p-4 border border-blue-100">
-						<p className="text-sm text-gray-700 text-center">
-							<code className="text-blue-600 font-mono text-xs">
-								example/convex/example.ts
-							</code>
-							<br />
-							<span className="text-gray-500 text-xs">
-								Check out the code to see all available features
-							</span>
-						</p>
-					</div>
-				</div>
-			</div>
-		</div>
-	);
-}
-
-export default App;

package/example/src/frontend.tsx

@@ -1,39 +0,0 @@
-/**
- * This file is the entry point for the React app, it sets up the root
- * element and renders the App component to the DOM.
- *
- * It is included in `src/index.html`.
- */
-
-import { ConvexProvider, ConvexReactClient } from "convex/react";
-import { createRoot } from "react-dom/client";
-import { App } from "./App";
-
-const convexURL = process.env.CONVEX_URL;
-
-if (!convexURL) {
-	throw new Error("No convex URL provided!");
-}
-
-const convex = new ConvexReactClient(convexURL);
-
-function start() {
-	const rootElement = document.getElementById("root");
-
-	if (!rootElement) {
-		throw new Error("Could not find root");
-	}
-
-	const root = createRoot(rootElement);
-	root.render(
-		<ConvexProvider client={convex}>
-			<App />
-		</ConvexProvider>,
-	);
-}
-
-if (document.readyState === "loading") {
-	document.addEventListener("DOMContentLoaded", start);
-} else {
-	start();
-}

package/example/src/index.css

@@ -1,15 +0,0 @@
-@import "tailwindcss";
-
-@layer base {
-	:root {
-		@apply font-sans;
-	}
-
-	body {
-		@apply w-full min-h-screen m-0;
-	}
-
-	#root {
-		@apply w-full;
-	}
-}

package/example/src/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Loops Component Example</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="./frontend.tsx"></script>
-  </body>
-</html>

package/example/src/index.tsx

@@ -1,19 +0,0 @@
-import { serve } from "bun";
-import index from "./index.html";
-
-const server = serve({
-	routes: {
-		// Serve index.html for all unmatched routes.
-		"/*": index,
-	},
-
-	development: process.env.NODE_ENV !== "production" && {
-		// Enable browser hot reloading in development
-		hmr: true,
-
-		// Echo console logs from the browser to the server
-		console: true,
-	},
-});
-
-console.log(`🚀 Server running at ${server.url}`);

package/example/tsconfig.json

@@ -1,28 +0,0 @@
-{
-	"compilerOptions": {
-		"lib": ["ESNext", "DOM"],
-		"target": "ESNext",
-		"module": "Preserve",
-		"moduleDetection": "force",
-		"jsx": "react-jsx",
-		"allowJs": true,
-		"moduleResolution": "bundler",
-		"allowImportingTsExtensions": true,
-		"verbatimModuleSyntax": true,
-		"noEmit": true,
-		"strict": true,
-		"skipLibCheck": true,
-		"noFallthroughCasesInSwitch": true,
-		"noUncheckedIndexedAccess": true,
-		"noImplicitOverride": true,
-		"baseUrl": ".",
-		"paths": {
-			"@/*": ["./src/*"]
-		},
-		"noUnusedLocals": false,
-		"noUnusedParameters": false,
-		"noPropertyAccessFromIndexSignature": false
-	},
-
-	"exclude": ["dist", "node_modules"]
-}

package/renovate.json

@@ -1,32 +0,0 @@
-{
-	"$schema": "https://docs.renovatebot.com/renovate-schema.json",
-	"extends": ["config:best-practices"],
-	"schedule": ["* 0-4 * * 1"],
-	"timezone": "America/Los_Angeles",
-	"prConcurrentLimit": 1,
-	"packageRules": [
-		{
-			"groupName": "Convex packages",
-			"matchPackagePatterns": ["^convex"],
-			"automerge": false,
-			"description": "Keep Convex packages together but require manual review"
-		},
-		{
-			"groupName": "Routine updates",
-			"matchUpdateTypes": ["minor", "patch", "pin", "digest"],
-			"excludePackagePatterns": ["^convex"],
-			"automerge": true
-		},
-		{
-			"groupName": "Major updates",
-			"matchUpdateTypes": ["major"],
-			"excludePackagePatterns": ["^convex"],
-			"automerge": false
-		},
-		{
-			"matchDepTypes": ["devDependencies"],
-			"excludePackagePatterns": ["^convex"],
-			"automerge": true
-		}
-	]
-}

package/test/client/_generated/_ignore.ts

@@ -1 +0,0 @@
-// This is only here so convex-test can detect a _generated folder

package/test/client/index.test.ts

@@ -1,65 +0,0 @@
-import { describe, expect, test } from "bun:test";
-import { defineSchema } from "convex/server";
-import { Loops } from "../../src/client";
-import { components, initConvexTest } from "./setup.test.js";
-
-// The schema for the tests
-const schema = defineSchema({});
-
-describe("Loops thick client", () => {
-	test("should create Loops client", () => {
-		const loops = new Loops(components.loops, {
-			apiKey: "test-api-key",
-		});
-		expect(loops).toBeDefined();
-	});
-
-	test("should throw error if no API key provided", () => {
-		const originalEnv = process.env.LOOPS_API_KEY;
-		delete process.env.LOOPS_API_KEY;
-
-		expect(() => {
-			new Loops(components.loops);
-		}).toThrow("Loops API key is required");
-		
-		if (originalEnv) {
-			process.env.LOOPS_API_KEY = originalEnv;
-		}
-	});
-
-	test("should work with api() helper - generates actions", () => {
-		const loops = new Loops(components.loops, {
-			apiKey: "test-api-key",
-		});
-		const api = loops.api();
-
-		expect(api.addContact).toBeDefined();
-		expect(api.updateContact).toBeDefined();
-		expect(api.findContact).toBeDefined();
-		expect(api.batchCreateContacts).toBeDefined();
-		expect(api.unsubscribeContact).toBeDefined();
-		expect(api.resubscribeContact).toBeDefined();
-		expect(api.deleteContact).toBeDefined();
-		expect(api.sendTransactional).toBeDefined();
-		expect(api.sendEvent).toBeDefined();
-		expect(api.sendCampaign).toBeDefined();
-		expect(api.triggerLoop).toBeDefined();
-		expect(api.countContacts).toBeDefined();
-		expect(api.detectRecipientSpam).toBeDefined();
-		expect(api.detectActorSpam).toBeDefined();
-		expect(api.getEmailStats).toBeDefined();
-		expect(api.detectRapidFirePatterns).toBeDefined();
-		expect(api.checkRecipientRateLimit).toBeDefined();
-		expect(api.checkActorRateLimit).toBeDefined();
-		expect(api.checkGlobalRateLimit).toBeDefined();
-		expect(typeof api.addContact).toBe("function");
-		expect(typeof api.sendTransactional).toBe("function");
-		expect(typeof api.countContacts).toBe("function");
-		expect(typeof api.detectRecipientSpam).toBe("function");
-		expect(typeof api.checkRecipientRateLimit).toBe("function");
-	});
-
-	// Note: Integration tests that actually call the Loops API would require
-	// mocking the fetch calls or using a test API key. These tests verify
-	// the structure and basic functionality of the client.
-});

package/test/client/setup.test.ts

@@ -1,54 +0,0 @@
-import { test } from "bun:test";
-import { dirname, join } from "node:path";
-import { fileURLToPath } from "node:url";
-import {
-	componentsGeneric,
-	defineSchema,
-	type GenericSchema,
-	type SchemaDefinition,
-} from "convex/server";
-import { convexTest } from "convex-test";
-import type { LoopsComponentComponent } from "../../src/client/index.js";
-import componentSchema from "../../src/component/schema.js";
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const clientDir = join(__dirname, "../../test/client");
-const componentDir = join(__dirname, "../../src/component");
-
-// Auto-discover client test files
-const clientFiles = await Array.fromAsync(
-	new Bun.Glob("**/*.{ts,js}").scan({ cwd: clientDir }),
-);
-
-export const modules = Object.fromEntries(
-	clientFiles
-		.filter((f) => !f.includes(".test."))
-		.map((f) => [`./${f}`, () => import(join(clientDir, f))]),
-);
-
-// Auto-discover component files for registration
-const componentFiles = await Array.fromAsync(
-	new Bun.Glob("**/*.{ts,js}").scan({ cwd: componentDir }),
-);
-
-export const componentModules = Object.fromEntries(
-	componentFiles
-		.filter((f) => !f.includes(".test."))
-		.map((f) => [`./${f}`, () => import(join(componentDir, f))]),
-);
-
-export { componentSchema };
-
-export function initConvexTest<
-	Schema extends SchemaDefinition<GenericSchema, boolean>,
->(schema?: Schema) {
-	const t = convexTest(schema ?? defineSchema({}), modules);
-	t.registerComponent("loops", componentSchema, componentModules);
-	return t;
-}
-
-export const components = componentsGeneric() as unknown as {
-	loops: LoopsComponentComponent;
-};
-
-test("setup", () => {});

package/test/component/lib.test.ts

@@ -1,225 +0,0 @@
-import { describe, expect, test } from "bun:test";
-import { api, internal } from "../../src/component/_generated/api";
-import { convexTest } from "./setup.test.ts";
-
-describe("component lib", () => {
-	test("addContact stores contact in database", async () => {
-		const t = convexTest();
-		const result = await t.action(api.lib.addContact, {
-			apiKey: "test-api-key",
-			contact: {
-				email: "test@example.com",
-				firstName: "Test",
-				lastName: "User",
-			},
-		});
-
-		expect(result.success).toBe(true);
-		expect(result.id).toBeDefined();
-		const contacts = await t.db.query("contacts").collect();
-		expect(contacts.length).toBe(1);
-		expect(contacts[0].email).toBe("test@example.com");
-		expect(contacts[0].firstName).toBe("Test");
-		expect(contacts[0].lastName).toBe("User");
-	});
-
-	test("updateContact updates existing contact", async () => {
-		const t = convexTest();
-		await t.action(api.lib.addContact, {
-			apiKey: "test-api-key",
-			contact: {
-				email: "update@example.com",
-				firstName: "Original",
-			},
-		});
-
-		const result = await t.action(api.lib.updateContact, {
-			apiKey: "test-api-key",
-			email: "update@example.com",
-			firstName: "Updated",
-		});
-
-		expect(result.success).toBe(true);
-
-		const contact = await t.db
-			.query("contacts")
-			.withIndex("email", (q: any) => q.eq("email", "update@example.com"))
-			.unique();
-		expect(contact?.firstName).toBe("Updated");
-	});
-
-	test("deleteContact removes contact from database", async () => {
-		const t = convexTest();
-
-		await t.action(api.lib.addContact, {
-			apiKey: "test-api-key",
-			contact: {
-				email: "delete@example.com",
-			},
-		});
-
-		let contacts = await t.db.query("contacts").collect();
-		expect(contacts.length).toBe(1);
-
-		const result = await t.action(api.lib.deleteContact, {
-			apiKey: "test-api-key",
-			email: "delete@example.com",
-		});
-
-		expect(result.success).toBe(true);
-
-		contacts = await t.db.query("contacts").collect();
-		expect(contacts.length).toBe(0);
-	});
-
-	test("countContacts returns correct count", async () => {
-		const t = convexTest();
-		const now = Date.now();
-
-		await t.action(api.lib.addContact, {
-			apiKey: "test-api-key",
-			contact: {
-				email: "count1@example.com",
-			},
-		});
-		await t.action(api.lib.addContact, {
-			apiKey: "test-api-key",
-			contact: {
-				email: "count2@example.com",
-			},
-		});
-		await t.action(api.lib.addContact, {
-			apiKey: "test-api-key",
-			contact: {
-				email: "count3@example.com",
-				userGroup: "premium",
-			},
-		});
-
-		const totalCount = await t.query(api.lib.countContacts, {});
-		expect(totalCount).toBe(3);
-
-		const premiumCount = await t.query(api.lib.countContacts, {
-			userGroup: "premium",
-		});
-		expect(premiumCount).toBe(1);
-
-		const subscribedCount = await t.query(api.lib.countContacts, {
-			subscribed: true,
-		});
-		expect(subscribedCount).toBe(3);
-	});
-
-	test("checkRecipientRateLimit returns correct rate limit status", async () => {
-		const t = convexTest();
-
-		const now = Date.now();
-		
-		await t.mutation(internal.lib.logEmailOperation as any, {
-			operationType: "transactional",
-			email: "ratelimit@example.com",
-			timestamp: now - 1000,
-			success: true,
-		});
-		await t.mutation(internal.lib.logEmailOperation as any, {
-			operationType: "transactional",
-			email: "ratelimit@example.com",
-			timestamp: now - 2000,
-			success: true,
-		});
-
-		const check = await t.query(api.lib.checkRecipientRateLimit, {
-			email: "ratelimit@example.com",
-			timeWindowMs: 3600000,
-			maxEmails: 10,
-		});
-
-		expect(check.allowed).toBe(true);
-		expect(check.count).toBe(2);
-		expect(check.limit).toBe(10);
-	});
-
-	test("checkRecipientRateLimit detects when limit is exceeded", async () => {
-		const t = convexTest();
-		const now = Date.now();
-
-		for (let i = 0; i < 12; i++) {
-			await t.mutation(internal.lib.logEmailOperation as any, {
-				operationType: "transactional",
-				email: "exceeded@example.com",
-				timestamp: now - i * 1000,
-				success: true,
-			});
-		}
-
-		const check = await t.query(api.lib.checkRecipientRateLimit, {
-			email: "exceeded@example.com",
-			timeWindowMs: 3600000,
-			maxEmails: 10,
-		});
-
-		expect(check.allowed).toBe(false);
-		expect(check.count).toBeGreaterThan(10);
-		expect(check.retryAfter).toBeDefined();
-	});
-
-	test("getEmailStats returns correct statistics", async () => {
-		const t = convexTest();
-		const now = Date.now();
-
-		await t.mutation(internal.lib.logEmailOperation as any, {
-			operationType: "transactional",
-			email: "stats1@example.com",
-			timestamp: now - 1000,
-			success: true,
-		});
-		await t.mutation(internal.lib.logEmailOperation as any, {
-			operationType: "event",
-			email: "stats2@example.com",
-			eventName: "test-event",
-			timestamp: now - 2000,
-			success: true,
-		});
-		await t.mutation(internal.lib.logEmailOperation as any, {
-			operationType: "transactional",
-			email: "stats3@example.com",
-			timestamp: now - 3000,
-			success: false,
-		});
-
-		const stats = await t.query(api.lib.getEmailStats, {
-			timeWindowMs: 3600000,
-		});
-
-		expect(stats.totalOperations).toBe(3);
-		expect(stats.successfulOperations).toBe(2);
-		expect(stats.failedOperations).toBe(1);
-		expect((stats.operationsByType as any)["transactional"]).toBe(2);
-		expect((stats.operationsByType as any)["event"]).toBe(1);
-		expect(stats.uniqueRecipients).toBe(3);
-	});
-
-	test("detectRecipientSpam finds suspicious patterns", async () => {
-		const t = convexTest();
-		const now = Date.now();
-
-		for (let i = 0; i < 15; i++) {
-			await t.mutation(internal.lib.logEmailOperation as any, {
-				operationType: "transactional",
-				email: "spam@example.com",
-				timestamp: now - i * 1000,
-				success: true,
-			});
-		}
-
-		const spam = await t.query(api.lib.detectRecipientSpam, {
-			timeWindowMs: 3600000,
-			maxEmailsPerRecipient: 10,
-		});
-
-		expect(spam.length).toBeGreaterThan(0);
-		const spamEntry = spam.find((s) => s.email === "spam@example.com");
-		expect(spamEntry).toBeDefined();
-		expect(spamEntry!.count).toBeGreaterThan(10);
-	});
-});