Add React editor project

app/account/activate/[id]/[token]/editor/page.tsx

@@ -0,0 +1,7 @@
+import PageEditor from '@/components/page-editor';
+
+// Editor for /account/activate/[id]/[token]. Sitting under the route it edits means the preview
+// resolves the same params the public page gets.
+export default function EditorPage() {
+  return <PageEditor routeKey="/account/activate/[id]/[token]" />;
+}

app/account/activate/[id]/[token]/page.json

@@ -0,0 +1,43 @@
+{
+  "root": {
+    "props": {
+      "title": "Activate your account",
+      "description": "Finish setting up your account.",
+      "ogImage": ""
+    }
+  },
+  "content": [
+    {
+      "type": "header",
+      "props": {
+        "id": "header"
+      },
+      "synced": true
+    },
+    {
+      "type": "account-activate",
+      "props": {
+        "id": "account-activate",
+        "flow": "activate",
+        "title": "Activate your account",
+        "description": "Choose a password to finish setting up your account.",
+        "submitLabel": "Activate account",
+        "successMessage": "",
+        "links": []
+      }
+    },
+    {
+      "type": "footer",
+      "props": {
+        "id": "footer"
+      },
+      "synced": true
+    },
+    {
+      "type": "store-assistant",
+      "props": {
+        "id": "store-assistant"
+      }
+    }
+  ]
+}

app/account/activate/[id]/[token]/page.tsx

@@ -0,0 +1,9 @@
+import PageRender from '@/components/page-render';
+import { pageMetadata } from '@/lib/page-metadata';
+import page from './page.json';
+
+export const metadata = pageMetadata(page);
+
+export default function Page() {
+  return <PageRender page={page} />;
+}

app/account/editor/page.tsx

@@ -0,0 +1,7 @@
+import PageEditor from '@/components/page-editor';
+
+// Editor for /account. Sitting under the route it edits means the preview
+// resolves the same params the public page gets.
+export default function EditorPage() {
+  return <PageEditor routeKey="/account" />;
+}

app/account/login/editor/page.tsx

@@ -0,0 +1,7 @@
+import PageEditor from '@/components/page-editor';
+
+// Editor for /account/login. Sitting under the route it edits means the preview
+// resolves the same params the public page gets.
+export default function EditorPage() {
+  return <PageEditor routeKey="/account/login" />;
+}

app/account/login/page.json

@@ -0,0 +1,52 @@
+{
+  "root": {
+    "props": {
+      "title": "Sign in",
+      "description": "Sign in to your Shop account.",
+      "ogImage": ""
+    }
+  },
+  "content": [
+    {
+      "type": "header",
+      "props": {
+        "id": "header"
+      },
+      "synced": true
+    },
+    {
+      "type": "account-login",
+      "props": {
+        "id": "account-login",
+        "flow": "login",
+        "title": "Sign in",
+        "description": "",
+        "submitLabel": "Sign in",
+        "successMessage": "",
+        "links": [
+          {
+            "label": "Create an account",
+            "url": "/account/register"
+          },
+          {
+            "label": "Forgot your password?",
+            "url": "/account/recover"
+          }
+        ]
+      }
+    },
+    {
+      "type": "footer",
+      "props": {
+        "id": "footer"
+      },
+      "synced": true
+    },
+    {
+      "type": "store-assistant",
+      "props": {
+        "id": "store-assistant"
+      }
+    }
+  ]
+}

app/account/login/page.tsx

@@ -0,0 +1,9 @@
+import PageRender from '@/components/page-render';
+import { pageMetadata } from '@/lib/page-metadata';
+import page from './page.json';
+
+export const metadata = pageMetadata(page, { path: '/account/login' });
+
+export default function Page() {
+  return <PageRender page={page} />;
+}

app/account/page.json

@@ -0,0 +1,41 @@
+{
+  "root": {
+    "props": {
+      "title": "Order history",
+      "description": "Your recent orders.",
+      "ogImage": ""
+    }
+  },
+  "content": [
+    {
+      "type": "header",
+      "props": {
+        "id": "header"
+      },
+      "synced": true
+    },
+    {
+      "type": "account-orders",
+      "props": {
+        "id": "account-orders",
+        "title": "Order history",
+        "signedOutMessage": "Sign in to see your orders.",
+        "emptyMessage": "You haven't placed any orders yet.",
+        "limit": 20
+      }
+    },
+    {
+      "type": "footer",
+      "props": {
+        "id": "footer"
+      },
+      "synced": true
+    },
+    {
+      "type": "store-assistant",
+      "props": {
+        "id": "store-assistant"
+      }
+    }
+  ]
+}

app/account/page.tsx

@@ -0,0 +1,16 @@
+import { redirect } from 'next/navigation';
+import PageRender from '@/components/page-render';
+import { pageMetadata } from '@/lib/page-metadata';
+import { getSessionToken } from '@/services/shopify/session';
+import page from './page.json';
+
+export const metadata = pageMetadata(page, { path: '/account' });
+
+export default async function Page() {
+  // The order-history block re-reads the session through /api/account/orders,
+  // but bouncing signed-out visitors here avoids rendering the page at all.
+  const token = await getSessionToken();
+  if (!token) redirect('/account/login');
+
+  return <PageRender page={page} />;
+}

app/account/recover/editor/page.tsx

@@ -0,0 +1,7 @@
+import PageEditor from '@/components/page-editor';
+
+// Editor for /account/recover. Sitting under the route it edits means the preview
+// resolves the same params the public page gets.
+export default function EditorPage() {
+  return <PageEditor routeKey="/account/recover" />;
+}

app/account/recover/page.json

@@ -0,0 +1,48 @@
+{
+  "root": {
+    "props": {
+      "title": "Reset password",
+      "description": "Request a password reset link.",
+      "ogImage": ""
+    }
+  },
+  "content": [
+    {
+      "type": "header",
+      "props": {
+        "id": "header"
+      },
+      "synced": true
+    },
+    {
+      "type": "account-recover",
+      "props": {
+        "id": "account-recover",
+        "flow": "recover",
+        "title": "Reset password",
+        "description": "Enter your email and we'll send you a link to set a new password.",
+        "submitLabel": "Send reset link",
+        "successMessage": "If that email has an account, a reset link is on its way.",
+        "links": [
+          {
+            "label": "Back to sign in",
+            "url": "/account/login"
+          }
+        ]
+      }
+    },
+    {
+      "type": "footer",
+      "props": {
+        "id": "footer"
+      },
+      "synced": true
+    },
+    {
+      "type": "store-assistant",
+      "props": {
+        "id": "store-assistant"
+      }
+    }
+  ]
+}

app/account/recover/page.tsx

@@ -0,0 +1,9 @@
+import PageRender from '@/components/page-render';
+import { pageMetadata } from '@/lib/page-metadata';
+import page from './page.json';
+
+export const metadata = pageMetadata(page, { path: '/account/recover' });
+
+export default function Page() {
+  return <PageRender page={page} />;
+}

app/account/register/editor/page.tsx

@@ -0,0 +1,7 @@
+import PageEditor from '@/components/page-editor';
+
+// Editor for /account/register. Sitting under the route it edits means the preview
+// resolves the same params the public page gets.
+export default function EditorPage() {
+  return <PageEditor routeKey="/account/register" />;
+}

app/account/register/page.json

@@ -0,0 +1,48 @@
+{
+  "root": {
+    "props": {
+      "title": "Create account",
+      "description": "Create a Shop account.",
+      "ogImage": ""
+    }
+  },
+  "content": [
+    {
+      "type": "header",
+      "props": {
+        "id": "header"
+      },
+      "synced": true
+    },
+    {
+      "type": "account-register",
+      "props": {
+        "id": "account-register",
+        "flow": "register",
+        "title": "Create account",
+        "description": "",
+        "submitLabel": "Create account",
+        "successMessage": "",
+        "links": [
+          {
+            "label": "Already have an account? Sign in",
+            "url": "/account/login"
+          }
+        ]
+      }
+    },
+    {
+      "type": "footer",
+      "props": {
+        "id": "footer"
+      },
+      "synced": true
+    },
+    {
+      "type": "store-assistant",
+      "props": {
+        "id": "store-assistant"
+      }
+    }
+  ]
+}

app/account/register/page.tsx

@@ -0,0 +1,9 @@
+import PageRender from '@/components/page-render';
+import { pageMetadata } from '@/lib/page-metadata';
+import page from './page.json';
+
+export const metadata = pageMetadata(page, { path: '/account/register' });
+
+export default function Page() {
+  return <PageRender page={page} />;
+}

app/account/reset/[id]/[token]/editor/page.tsx

@@ -0,0 +1,7 @@
+import PageEditor from '@/components/page-editor';
+
+// Editor for /account/reset/[id]/[token]. Sitting under the route it edits means the preview
+// resolves the same params the public page gets.
+export default function EditorPage() {
+  return <PageEditor routeKey="/account/reset/[id]/[token]" />;
+}

app/account/reset/[id]/[token]/page.json

@@ -0,0 +1,43 @@
+{
+  "root": {
+    "props": {
+      "title": "Set a new password",
+      "description": "Choose a new password.",
+      "ogImage": ""
+    }
+  },
+  "content": [
+    {
+      "type": "header",
+      "props": {
+        "id": "header"
+      },
+      "synced": true
+    },
+    {
+      "type": "account-reset",
+      "props": {
+        "id": "account-reset",
+        "flow": "reset",
+        "title": "Set a new password",
+        "description": "",
+        "submitLabel": "Save password",
+        "successMessage": "",
+        "links": []
+      }
+    },
+    {
+      "type": "footer",
+      "props": {
+        "id": "footer"
+      },
+      "synced": true
+    },
+    {
+      "type": "store-assistant",
+      "props": {
+        "id": "store-assistant"
+      }
+    }
+  ]
+}

app/account/reset/[id]/[token]/page.tsx

@@ -0,0 +1,9 @@
+import PageRender from '@/components/page-render';
+import { pageMetadata } from '@/lib/page-metadata';
+import page from './page.json';
+
+export const metadata = pageMetadata(page);
+
+export default function Page() {
+  return <PageRender page={page} />;
+}