diff --git a/examples/trpc/src/app/_components/create-post.tsx b/examples/trpc/src/app/_components/create-post.tsx index df7088c7..6e82b390 100644 --- a/examples/trpc/src/app/_components/create-post.tsx +++ b/examples/trpc/src/app/_components/create-post.tsx @@ -1,19 +1,18 @@ -"use client"; +'use client'; -import { useRouter } from "next/navigation"; -import { useState } from "react"; +import { useRouter } from 'next/navigation'; +import { useState } from 'react'; -import { api } from "~/trpc/react"; -import styles from "../index.module.css"; +import { api } from '~/trpc/react'; export function CreatePost() { const router = useRouter(); - const [name, setName] = useState(""); + const [name, setName] = useState(''); const createPost = api.post.create.useMutation({ onSuccess: () => { router.refresh(); - setName(""); + setName(''); }, }); @@ -23,21 +22,10 @@ export function CreatePost() { e.preventDefault(); createPost.mutate({ name }); }} - className={styles.form} > - setName(e.target.value)} - className={styles.input} - /> - - {createPost.isLoading ? "Submitting..." : "Submit"} + setName(e.target.value)} /> + + {createPost.isLoading ? 'Submitting...' : 'Submit'} ); diff --git a/examples/trpc/src/app/page.tsx b/examples/trpc/src/app/page.tsx index c8eea7f2..cc2b4f83 100644 --- a/examples/trpc/src/app/page.tsx +++ b/examples/trpc/src/app/page.tsx @@ -1,50 +1,16 @@ -import Link from "next/link"; +import Link from 'next/link'; -import { CreatePost } from "~/app/_components/create-post"; -import { api } from "~/trpc/server"; -import styles from "./index.module.css"; +import { CreatePost } from '~/app/_components/create-post'; +import { api } from '~/trpc/server'; export default async function Home() { - const hello = await api.post.hello.query({ text: "from tRPC" }); + const hello = await api.post.hello.query({ text: 'from tRPC' }); return ( - - - - Create T3 App - - - - First Steps → - - Just the basics - Everything you need to know to set up your - database and authentication. - - - - Documentation → - - Learn more about Create T3 App, the libraries it uses, and how to - deploy it. - - - - - - {hello ? hello.greeting : "Loading tRPC query..."} - - + + {hello ? hello.greeting : 'Loading tRPC query...'} - - + ); } @@ -53,14 +19,8 @@ async function CrudShowcase() { const latestPost = await api.post.getLatest.query(); return ( - - {latestPost ? ( - - Your most recent post: {latestPost.name} - - ) : ( - You have no posts yet. - )} + + {latestPost ? Your most recent post: {latestPost.name} : You have no posts yet.}
- {hello ? hello.greeting : "Loading tRPC query..."} -
{hello ? hello.greeting : 'Loading tRPC query...'}
- Your most recent post: {latestPost.name} -
You have no posts yet.
Your most recent post: {latestPost.name}