import { createCorsairClient } from 'corsair'

export const corsair = createCorsairClient({
  apiUrl: '/api/corsair',
})

import { CorsairProvider } from 'corsair/client'
import { corsair } from '@/lib/corsair'

export default function RootLayout({ children }) {
  return <CorsairProvider client={corsair}>{children}</CorsairProvider>
}

import { useCorsairQuery } from 'corsair/client'

export function Posts() {
  const { data, isLoading, error } = useCorsairQuery(
    'all posts published in the last 30 days with author names'
  )

  if (isLoading) return <div>Loading...</div>
  if (error) return <div>Error: {error.message}</div>

  return (
    <div>
      {data.map(post => (
        <article key={post.id}>
          <h2>{post.title}</h2>
          <p>By {post.author.name}</p>
        </article>
      ))}
    </div>
  )
}

import { useCorsairMutation } from 'corsair/client'

export function CreatePost() {
  const { mutate: createPost, isPending } =
    useCorsairMutation('create a new post')

  const handleSubmit = (e: FormEvent) => {
    e.preventDefault()
    const formData = new FormData(e.target)

    createPost({
      title: formData.get('title'),
      content: formData.get('content'),
      authorId: currentUserId,
    })
  }

  return (
    <form onSubmit={handleSubmit}>
      <input name="title" placeholder="Post title" />
      <textarea name="content" placeholder="Content" />
      <button disabled={isPending}>Create Post</button>
    </form>
  )
}

const { data: userPosts } = useCorsairQuery('all posts by user with id', {
  userId: '123',
})

const { mutate: updatePost } = useCorsairMutation('update post', {
  onSuccess: data => {
    console.log('Post updated:', data)
  },
  onError: error => {
    console.error('Failed to update:', error)
  },
})