Storybookでコンポーネントの分岐がある場合について

Question

質問内容

Storybookを用いてコンポーネントを管理したいのですが、以下のような分岐があるコンポーネントをStorybook側で表示するとエラーになります。

export const ButtonModalClose = () => {
  const { modalState, changeModalState } = useContext(ModalContext);
  return (
    <>
      {modalState.isPossibleClose ? (
        <div
          onClick={() => {
            changeModalState("", "", false);
          }}
        >
          閉じる
        </div>
      ) : (
        <div></div>
      )}
    </>
  );
};

Cannot read properties of undefined (reading 'isPossibleClose')

isPossibleCloseのでエラーになっていると思うのですが、StorybookでisPossibleCloseに対するpropsを渡すことはできるのでしょうか？
もしくはreturn内でこのような分岐は避けて、分岐はコンポーネントの外に出すべきでしょうか？

初歩的な質問で申し訳ございませんが、ご回答をお願いします。

Answer 1

https://storybook.js.org/docs/react/writing-stories/decorators#context-for-mocking
こちらでいかがでしょうか〜