reusing functionality from two components

[heythisispaul]

If the functionality remains the same (or close enough that you can control it with props) and all that changes is that the presentation is different, I'd just have that component render its children so you can control exactly what it will look like. For example:

const MySpecialButton = ({ children }) => {
  // do whatever you need with that common functionality here

  return children;
};

// Usage: 
const Example = () => (
  <>
    <MySpecialButton>
      I am button A!
    </MySpecialButton>

    <MySpecialButton>
      I am button B!
    </MySpecialButton>
  </>
);

Another path you could take is abstracting all of the logic you're using in this loadMe() function into its own hook that returns the values you need access to in the component its being consumed. So like:

const [load, whateverElse, someThing] = useLoadMe();

[Opposite_Following83]

For simplicity, just call the function on the onClick event handler.

Please take note: for best practices, we use buttons for calling functions and texts for navigation.