Black Beltserver-componentslockPREMIUM

The Illegal Inline Action

A teammate adds an inline Server Action to an existing client component.

REACT_MODULE // 0x42

'use client';

import { useState } from 'react';

export default function LikeButton() {
  const [liked, setLiked] = useState(false);

  async function handleLike() {
    'use server';
    await fetch('/api/like', { method: 'POST' });
  }

  return <button onClick={() => setLiked(!liked)}>Like</button>;
}

Why does the Next.js compiler reject this file?

lock

This Drill is Locked

This is a premium drill. Continue on to the next free drill in the sequence.

CONTINUE DRILLarrow_forward