Server Components: can I use useState or onClick in them?

No. Keep the page as a Server Component and extract only the interactive part into a small Client Component:

// app/LikeButton.tsx
'use client';
import { useState } from 'react';

export function LikeButton() {
  const [likes, setLikes] = useState(0);
  return <button onClick={() => setLikes(likes + 1)}>👍 {likes}</button>;
}

// app/page.tsx (Server Component, can fetch data directly)
import { LikeButton } from './LikeButton';

export default async function Page() {
  const post = await getPost();
  return <article><h1>{post.title}</h1><LikeButton /></article>;
}

Server Components can't use state, effects, or event handlers. Push 'use client' as far down the tree as possible so most of your UI stays server-rendered and ships no JS.

You can also pass Server Components *as children* into a Client Component (e.g. a client-side <Tabs> wrapping server-rendered panels). The children stay server-rendered even though the wrapper is interactive.