react-simple-hook-modal

react-simple-hook-modal copied to clipboard

I have a stateful component living next to the react-simple-hook-modal. When I trigger the modal it reloads the stateful component. I'm not sure why this is happening. Any advice?

I've tried moving the stateful component outside of the ModalProvider but react-simple-hook-modal still reloads the stateful component, setting it to an empty state.

I don't understand why changing the CSS of the modal div (I assume that's how the package works but I really don't know) that's already on the screen would "reload" anything. 🤷🏽‍♂️

 <ModalProvider>
        <ComponentWithState /> //When the modal pops this is set to initial state
        <Modal
          id='my-modal'
          isOpen={isModalOpen}
          transition={ModalTransition.scale}
        >
          <FontAwesomeIcon
            alt='plus'
            icon={faTimesCircle}
            onClick={closeModal}
            className='absolute top-3 right-3 text-2xl text-gray-600 hover:text-gray-900 cursor-pointer'
          />
        Lorem ipsum
        </Modal>
      </ModalProvider>