Client components are used for client-side interactivity. You can think of "use client" components as use interactivity components. Server components can import client components but they cannot render them. ColumnSearch should be converted to client component since it renders imported components. You have to add "use client" at the top of ColumnSearch component. Additionally you should wrap the ColumnSearch component within another client component e.g. ColumnSearchWrapper. That way when you import ColumnSearchWrapper within Filter, it will only reference the client component instead of rendering.

Here's the ColumnSearchWrapper example (without props):

'use client'
import { ColumnSearch } from './ColumnSearch'

export default function ColumnSearchWrapper() {
  return <ColumnSearch />
}

And then you add "use client" at the top of ColumnSearch. Additionally you cannot pass functions from server components to client components. Server components send data to the browser through serialization (using JSON). Can you send string or number with JSON - yes. Can you send function with JSON - not really. Hope it helped at least a little.