diff --git a/web/calendar/filter-panel.react.js b/web/calendar/filter-panel.react.js
--- a/web/calendar/filter-panel.react.js
+++ b/web/calendar/filter-panel.react.js
@@ -204,9 +204,7 @@
   }
 
   onClickSettings = (threadID: string) => {
-    this.props.setModal(
-      <ThreadSettingsModal threadID={threadID} onClose={this.clearModal} />,
-    );
+    this.props.setModal(<ThreadSettingsModal threadID={threadID} />);
   };
 
   onChangeQuery = (event: SyntheticEvent<HTMLInputElement>) => {
diff --git a/web/modals/threads/thread-settings-modal.react.js b/web/modals/threads/thread-settings-modal.react.js
--- a/web/modals/threads/thread-settings-modal.react.js
+++ b/web/modals/threads/thread-settings-modal.react.js
@@ -36,6 +36,7 @@
 } from 'lib/utils/action-utils';
 import { firstLine } from 'lib/utils/string-utils';
 
+import { ModalContext } from '../../modals/modal-provider.react';
 import { useSelector } from '../../redux/redux-utils';
 import css from '../../style.css';
 import Modal from '../modal.react';
@@ -71,7 +72,6 @@
 
 type BaseProps = {
   +threadID: string,
-  +onClose: () => void,
 };
 type Props = {
   ...BaseProps,
@@ -87,6 +87,7 @@
   +changeThreadSettings: (
     update: UpdateThreadRequest,
   ) => Promise<ChangeThreadSettingsPayload>,
+  +clearModal: () => void,
 };
 type State = {
   +queuedChanges: ThreadChanges,
@@ -377,7 +378,11 @@
     }
 
     return (
-      <Modal name="Thread settings" onClose={this.props.onClose} size="large">
+      <Modal
+        name="Thread settings"
+        onClose={this.props.clearModal}
+        size="large"
+      >
         <ul className={css['tab-panel']}>{tabs}</ul>
         <div className={css['modal-body']}>
           <form method="POST">
@@ -481,7 +486,7 @@
         threadID: this.props.threadInfo.id,
         changes: this.state.queuedChanges,
       });
-      this.props.onClose();
+      this.props.clearModal();
       return response;
     } catch (e) {
       this.setState(
@@ -515,7 +520,7 @@
         this.props.threadInfo.id,
         this.state.accountPassword,
       );
-      this.props.onClose();
+      this.props.clearModal();
       return response;
     } catch (e) {
       const errorMessage =
@@ -564,9 +569,12 @@
     const threadInfo: ?ThreadInfo = useSelector(
       state => threadInfoSelector(state)[props.threadID],
     );
+    const modalContext = React.useContext(ModalContext);
+    invariant(modalContext, 'ModalContext not found');
+
     if (!threadInfo) {
       return (
-        <Modal onClose={props.onClose} name="Invalid thread">
+        <Modal onClose={modalContext.clearModal} name="Invalid thread">
           <div className={css['modal-body']}>
             <p>You no longer have permission to view this thread</p>
           </div>
@@ -584,6 +592,7 @@
         deleteThread={callDeleteThread}
         changeThreadSettings={callChangeThreadSettings}
         dispatchActionPromise={dispatchActionPromise}
+        clearModal={modalContext.clearModal}
       />
     );
   },