Error: Event handlers cannot be passed to Client Component props.

button onClick={} 하려는데

Error: Event handlers cannot be passed to Client Component props. 
  <button onClick={function} children=...>

컴포넌트 상단에 "use Clients" 추가하라 하래서 했는데도 해결이 되지 않아서 Server component / Client component로 분할해서 작성했다. Server와 Client 컴포넌트는 동일한 컴포넌트 트리상에서 결합될 수 있다!!

e.g.,
login/ > actions.ts, LoginForm.tsx

• https://nextjs.org/docs/app/building-your-application/rendering#composing-client-and-server-components

문제가 생긴 이유를 찾아보니 Server 컴포넌트를 Client 컴포넌트안에 중첩시켜서 ... ! Server 컴포넌트는 Client 컴포넌트 내에서 import할 수 없다

• https://stackoverflow.com/questions/74471642/nextjs-13-button-onclick-event-handlers-cannot-be-passed-to-client-componen

• https://velog.io/@rachaen/Next.js-Next.js-Event-handlers-cannot-be-passed-to-client-component-%EC%98%A4%EB%A5%98-%ED%95%B4%EA%B2%B0-%EB%B0%8F-use-client%EC%97%90-%EB%8C%80%ED%95%98%EC%97%AC