docs: Use absolute imports in nextjs demo

Author: ntucker

examples/nextjs/app/[userId]/layout.tsx

@@ -1,5 +1,5 @@
 import Link from 'next/link';
-import UserSelection from '../../components/todo/UserSelection';
+import UserSelection from 'components/todo/UserSelection';
 
 export default function TodoLayout({
   children,

examples/nextjs/app/[userId]/page.tsx

@@ -1,5 +1,4 @@
-'use client';
-import TodoList from '../../components/todo/TodoList';
+import TodoList from 'components/todo/TodoList';
 
 export default function TodoPage({ params }: { params: { userId: number } }) {
   return (

examples/nextjs/app/crypto/page.tsx

@@ -1,8 +1,7 @@
-'use client';
 import Link from 'next/link';
 
-import AssetPrice from '../../components/AssetPrice';
-import styles from '../../styles/Home.module.css';
+import AssetPrice from 'components/AssetPrice';
+import styles from 'styles/Home.module.css';
 
 export default function Crypto() {
   return (

examples/nextjs/app/layout.tsx

@@ -2,7 +2,7 @@ import { AsyncBoundary } from '@data-client/react';
 import { DataProvider } from '@data-client/ssr/nextjs';
 import Image from 'next/image';
 
-import styles from '../styles/Home.module.css';
+import styles from 'styles/Home.module.css';
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (

examples/nextjs/components/AssetPrice.tsx

@@ -1,6 +1,7 @@
+'use client';
 import { useLive } from '@data-client/react';
 import { Formatted } from './Formatted';
-import { getTicker } from '../resources/Ticker';
+import { getTicker } from 'resources/Ticker';
 
 export default function AssetPrice({ symbol }: Props) {
   const productId = `${symbol}-USD`

examples/nextjs/components/todo/NewTodo.tsx

@@ -1,6 +1,6 @@
 import { useController } from '@data-client/react';
 import { memo, useCallback } from 'react';
-import { TodoResource } from '../../resources/TodoResource';
+import { TodoResource } from 'resources/TodoResource';
 import styles from './NewTodo.module.css'
 
 function NewTodo({ userId }: { userId?: number }) {

examples/nextjs/components/todo/TodoList.tsx

@@ -1,5 +1,6 @@
+'use client';
 import { useSuspense } from '@data-client/react';
-import { TodoResource } from '../../resources/TodoResource';
+import { TodoResource } from 'resources/TodoResource';
 
 import NewTodo from './NewTodo';
 import TodoListItem from './TodoListItem';

examples/nextjs/components/todo/TodoListItem.tsx

@@ -1,6 +1,6 @@
 import { useController } from '@data-client/react';
 import { memo } from 'react';
-import { TodoResource, Todo } from '../../resources/TodoResource';
+import { TodoResource, Todo } from 'resources/TodoResource';
 
 function TodoListItem({ todo }: { todo: Todo }) {
   const ctrl = useController();

examples/nextjs/components/todo/UserSelection.tsx

@@ -1,6 +1,6 @@
 'use client';
 import { useSuspense } from '@data-client/react';
-import { UserResource } from '../../resources/UserResource';
+import { UserResource } from 'resources/UserResource';
 import Link from 'next/link';
 import styles from './UserSelect.module.css';
 import clsx from 'clsx';

examples/nextjs/tsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "baseUrl": ".",
     "target": "es5",
     "lib": [
       "dom",