export default arrow function cannot be imported

The problem is that even though you are exporting the component as default you are giving it a name which is not defined

You can either do

export default (details) => {

}

const renderDetails = (details) => {

}
export default renderDetails;

One more thing, when you are trying to render components, make sure that their name starts with a Uppercase character.

try that way.

functions.jsx

export function renderDetails(details) => {
    // function logic removed for brevity
}

then import like,

import { renderDetails } from './functions';

P.S. ./ is for if both files a re in same namespace/folder.

Related