Use app router template

design-system/website/components/Navigation.tsx

@@ -4,7 +4,7 @@
 import { Fragment, type ReactNode } from 'react'
 import { jsx, useTheme } from '@keystone-ui/core'
 import Link from 'next/link'
-import { useRouter } from 'next/router'
+import { usePathname } from 'next/navigation'
 
 const Brand = () => {
   const { palette } = useTheme()
@@ -37,8 +37,8 @@ const Section = ({ label, children }: SectionProps) => {
 type NavItemProps = { href: string, children: ReactNode }
 const NavItem = ({ href, children }: NavItemProps) => {
   const { palette, radii, spacing } = useTheme()
-  const router = useRouter()
-  const isSelected = router.pathname === href
+  const pathname = usePathname()
+  const isSelected = pathname === href
   return (
     <li
       css={{

eslint.config.js

@@ -7,6 +7,7 @@ module.exports = tseslint.config(
   {
     ignores: [
       '**/.keystone/',
+      '**/.next/',
       '**/dist/',
       '**/node_modules/',
       '**/syntax-error.js',

examples/auth/app/(admin)/.admin/index.tsx

@@ -0,0 +1,21 @@
+/* eslint-disable */
+import * as view0 from "@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/id-field-view"
+import * as view1 from "@keystone-6/core/fields/types/text/views"
+import * as view2 from "@keystone-6/core/fields/types/password/views"
+import * as view3 from "@keystone-6/core/fields/types/checkbox/views"
+import * as view4 from "@keystone-6/core/fields/types/timestamp/views"
+import * as view5 from "@keystone-6/core/fields/types/relationship/views"
+import * as view6 from "@keystone-6/core/fields/types/integer/views"
+import * as view7 from "@keystone-6/core/fields/types/select/views"
+import * as view8 from "@keystone-6/core/fields/types/json/views"
+
+const adminConfig = {}
+
+export const config = {
+  lazyMetadataQuery: {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"keystone","loc":{"start":22,"end":30}},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"adminMeta","loc":{"start":39,"end":48}},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"lists","loc":{"start":59,"end":64}},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"key","loc":{"start":77,"end":80}},"arguments":[],"directives":[],"loc":{"start":77,"end":80}},{"kind":"Field","name":{"kind":"Name","value":"isHidden","loc":{"start":91,"end":99}},"arguments":[],"directives":[],"loc":{"start":91,"end":99}},{"kind":"Field","name":{"kind":"Name","value":"fields","loc":{"start":110,"end":116}},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"path","loc":{"start":131,"end":135}},"arguments":[],"directives":[],"loc":{"start":131,"end":135}},{"kind":"Field","name":{"kind":"Name","value":"createView","loc":{"start":148,"end":158}},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"fieldMode","loc":{"start":175,"end":184}},"arguments":[],"directives":[],"loc":{"start":175,"end":184}}],"loc":{"start":159,"end":198}},"loc":{"start":148,"end":198}}],"loc":{"start":117,"end":210}},"loc":{"start":110,"end":210}}],"loc":{"start":65,"end":220}},"loc":{"start":59,"end":220}}],"loc":{"start":49,"end":228}},"loc":{"start":39,"end":228}}],"loc":{"start":31,"end":234}},"loc":{"start":22,"end":234}},{"kind":"Field","name":{"kind":"Name","value":"authenticatedItem"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"User"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}}]}}]}}]}}]},
+  fieldViews: [view0,view1,view2,view3,view4,view5,view6,view7,view8],
+  adminMetaHash: '1c8ah28',
+  adminConfig,
+  apiPath: '/api/graphql',
+  adminPath: '',
+};

examples/auth/app/(admin)/[listKey]/[id]/page.tsx

@@ -0,0 +1,4 @@
+'use client'
+import { ItemPage } from '@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/pages/ItemPage'
+
+export default ItemPage

examples/auth/app/(admin)/[listKey]/create/page.tsx

@@ -0,0 +1,4 @@
+'use client'
+import { CreateItemPage } from '@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/pages/CreateItemPage'
+
+export default CreateItemPage

examples/auth/app/(admin)/[listKey]/page.tsx

@@ -0,0 +1,4 @@
+'use client'
+import { ListPage } from '@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/pages/ListPage'
+
+export default ListPage

examples/auth/app/(admin)/init/page.tsx

@@ -0,0 +1,7 @@
+'use client'
+/* eslint-disable */
+import { getInitPage } from '@keystone-6/auth/pages/InitPage'
+
+const fieldPaths = ["name","password"]
+
+export default getInitPage({"listKey":"User","fieldPaths":["name","password"],"enableWelcome":true})

examples/auth/app/(admin)/layout.tsx

@@ -0,0 +1,16 @@
+'use client'
+import { Layout } from '@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/pages/App'
+import { config } from './.admin'
+
+
+export default function AdminLayout ({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <Layout config={config as any}>
+      {children}
+    </Layout>
+  )
+}

examples/auth/app/(admin)/no-access/page.tsx

@@ -0,0 +1,4 @@
+'use client'
+import { getNoAccessPage } from '@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/pages/NoAccessPage'
+
+export default getNoAccessPage({ sessionsEnabled: true })

examples/auth/app/(admin)/page.tsx

@@ -0,0 +1,2 @@
+'use client'
+export { HomePage as default } from '@keystone-6/core/___internal-do-not-use-will-break-in-patch/admin-ui/pages/HomePage'

examples/auth/app/(admin)/signin/page.tsx

@@ -0,0 +1,5 @@
+'use client'
+/* eslint-disable */
+import { getSigninPage } from '@keystone-6/auth/pages/SigninPage'
+
+export default getSigninPage({"identityField":"name","secretField":"password","mutationName":"authenticateUserWithPassword","successTypename":"UserAuthenticationWithPasswordSuccess","failureTypename":"UserAuthenticationWithPasswordFailure"})

examples/auth/app/layout.tsx

@@ -0,0 +1,11 @@
+export default function RootLayout ({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  )
+}

examples/auth/keystone.ts

@@ -71,5 +71,5 @@ export default withAuth<TypeInfo<Session>>(
       // the session secret is used to encrypt cookie data
       secret: sessionSecret,
     }),
-  })
+  }) as any
 )

examples/auth/next.config.mjs

@@ -0,0 +1,10 @@
+// you don't need this if you're building something outside of the Keystone repo
+
+export default {
+  eslint: {
+    ignoreDuringBuilds: true,
+  },
+  typescript: {
+    ignoreBuildErrors: true,
+  },
+}

examples/auth/package.json

@@ -12,7 +12,8 @@
   "dependencies": {
     "@keystone-6/auth": "workspace:^",
     "@keystone-6/core": "workspace:^",
-    "@prisma/client": "^5.0.0"
+    "@prisma/client": "^5.0.0",
+    "next": "^14.2.0"
   },
   "devDependencies": {
     "prisma": "^5.0.0",