how to reset modal component state on close?

interface Props {
  modalProps: ModalProps
  formProps: FormProps
  isFormLoading: boolean
}

export default function NotificationSettingsModal({ modalProps, formProps, isFormLoading }: Props) {
  const [isEnabled, setIsEnabled] = useState(false)

  return (
    <Modal {...modalProps} width={500} centered title='Notifications' closable={true} destroyOnClose>
      <Spin spinning={isFormLoading}>
        <Form {...formProps}>
          <Form.Item name='slack_notifier' valuePropName='checked'>
            <Checkbox onChange={(e) => setIsEnabled(e.target.checked)}>Enable Slack Notifications for this task</Checkbox>
          </Form.Item>
          {isEnabled && (
            <>
              <Divider />
              <Form.Item name='notify_client_slack_channel' valuePropName='checked'>
                <Checkbox>Notify client slack channel</Checkbox>
              </Form.Item>
            </>
          )}
        </Form>
      </Spin>
    </Modal>
  )
}

interface Props {
  modalProps: ModalProps
  formProps: FormProps
  isFormLoading: boolean
}

export default function NotificationSettingsModal({ modalProps, formProps, isFormLoading }: Props) {
  const [isEnabled, setIsEnabled] = useState(false)

  return (
    <Modal {...modalProps} width={500} centered title='Notifications' closable={true} destroyOnClose>
      <Spin spinning={isFormLoading}>
        <Form {...formProps}>
          <Form.Item name='slack_notifier' valuePropName='checked'>
            <Checkbox onChange={(e) => setIsEnabled(e.target.checked)}>Enable Slack Notifications for this task</Checkbox>
          </Form.Item>
          {isEnabled && (
            <>
              <Divider />
              <Form.Item name='notify_client_slack_channel' valuePropName='checked'>
                <Checkbox>Notify client slack channel</Checkbox>
              </Form.Item>
            </>
          )}
        </Form>
      </Spin>
    </Modal>
  )
}