Merge pull request #11 from gonta1026/feature/server

@/trpc/server を使ってapi側の2重コールをなくす

src/app/components/user.tsx

@@ -1,13 +1,18 @@
 'use client'
 
-import { useState } from 'react'
+import { type FC, useState } from 'react'
 
 import { api } from '@/trpc/react'
 import styles from '../index.module.css'
 import { errorHandler } from '@/lib/error/errorHandler'
-export function LatestUser() {
+import type { User } from '@prisma/client'
+
+type Props = {
+  latestUser: User
+}
+
+export const LatestUser: FC<Props> = ({ latestUser }) => {
   // const { data: latestUser } = api.user.first.useQuery()
-  const [latestUser] = api.user.first.useSuspenseQuery()
   const utils = api.useUtils()
   const [name, setName] = useState('')
   const [email, setEmail] = useState('')

src/app/page.tsx

@@ -1,14 +1,14 @@
 import Link from 'next/link'
 
 import { LatestUser } from '@/app/components/user'
-import { api } from '@/trpc/server'
 import styles from './index.module.css'
+import { api } from '@/trpc/server'
 export const metadata = {
   title: 'next template',
 }
 
 export default async function Home() {
-  const hello = await api.user.hello({ text: 'from tRPC' })
+  const latestUser = await api.user.first()
 
   return (
     <main className={styles.main}>
@@ -32,10 +32,10 @@ export default async function Home() {
           </Link>
         </div>
         <div className={styles.showcaseContainer}>
-          <p className={styles.showcaseText}>{hello ? hello.greeting : 'Loading tRPC query...'}</p>
+          {/* <p className={styles.showcaseText}>{hello ? hello.greeting : 'Loading tRPC query...'}</p> */}
         </div>
         <Link href={'/sample'}>to sample page</Link>
-        <LatestUser />
+        {latestUser && <LatestUser {...{ latestUser }} />}
       </div>
     </main>
   )