import React from "react";

import { ActionButton, ActionButtonProps } from "./ActionButton";

/**
 * Binds an entry to the sheet's row button.
 *
 * `BottomSheetModalContent` renders `buttonComponent` per item and does not
 * know about entries, so the entry is closed over here instead.
 */
export const boundActionButton = (
  entry: ZappEntry | ZappFeed,
  component?: ZappUIComponent & { parent?: ZappUIComponent }
) => {
  const ActionButtonWithEntry = (props: ActionButtonProps) => (
    <ActionButton {...props} entry={entry as ZappEntry} component={component} />
  );

  ActionButtonWithEntry.displayName = "ActionButtonWithEntry";

  return ActionButtonWithEntry;
};

boundActionButton.displayName = "boundActionButton";