90 lines · 2.2 KBRaw
.gitignore | 3 +++
.trail.yaml | 4 ++++
README.md | 3 +++
e2e/checkout.spec.ts | 6 ++++++
package.json | 8 ++++++++
src/components/CheckoutButton.tsx | 11 +++++++++++
src/theme.ts | 4 ++++
7 files changed, 39 insertions(+)
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..7a1510d
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+logs/
+runs/
+reports/
diff --git a/.trail.yaml b/.trail.yaml
new file mode 100644
index 0000000..3721f56
--- /dev/null
+++ b/.trail.yaml
@@ -0,0 +1,4 @@
+store: supabase://trail/main
+repo: web-app
+harnesses: [claude, codex]
+artifacts: ["logs/"]
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..f655e2c
--- /dev/null
+++ b/README.md
@@ -0,0 +1,3 @@
+# web-app
+
+The Acme storefront. Next.js, TypeScript.
diff --git a/e2e/checkout.spec.ts b/e2e/checkout.spec.ts
new file mode 100644
index 0000000..ca3c4bf
--- /dev/null
+++ b/e2e/checkout.spec.ts
@@ -0,0 +1,6 @@
+test("checkout", async ({ page }) => {
+ await page.goto("/cart");
+ await page.click("text=Place order");
+ await page.waitForTimeout(500);
+ await expect(page.locator("h1")).toHaveText("Thanks for your order");
+});
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..3bd51c0
--- /dev/null
+++ b/package.json
@@ -0,0 +1,8 @@
+{
+ "name": "web-app",
+ "private": true,
+ "scripts": {
+ "dev": "next dev",
+ "test:e2e": "playwright test"
+ }
+}
diff --git a/src/components/CheckoutButton.tsx b/src/components/CheckoutButton.tsx
new file mode 100644
index 0000000..33138b5
--- /dev/null
+++ b/src/components/CheckoutButton.tsx
@@ -0,0 +1,11 @@
+export function CheckoutButton({ cart }: { cart: Cart }) {
+ const [loading, setLoading] = useState(false);
+
+ async function submit() {
+ setLoading(true);
+ await placeOrder(cart);
+ setLoading(false);
+ }
+
+ return <button onClick={submit}>{loading ? <Spinner /> : "Place order"}</button>;
+}
diff --git a/src/theme.ts b/src/theme.ts
new file mode 100644
index 0000000..6823096
--- /dev/null
+++ b/src/theme.ts
@@ -0,0 +1,4 @@
+export const theme = {
+ bg: "#ffffff",
+ text: "#111111",
+};