diff --git a/js/react/conversation/Message.md b/js/react/conversation/Message.md
index a2a1fa6b9..3129936b6 100644
--- a/js/react/conversation/Message.md
+++ b/js/react/conversation/Message.md
@@ -1,6 +1,6 @@
 
 ```jsx
-<util.MessageParents theme={util.theme}>
+<util.ConversationContext theme={util.theme}>
   <Message />
-</util.MessageParents>
+</util.ConversationContext>
 ```
diff --git a/js/react/util/BackboneWrapper.md b/js/react/util/BackboneWrapper.md
index f20c42e80..11cd869a3 100644
--- a/js/react/util/BackboneWrapper.md
+++ b/js/react/util/BackboneWrapper.md
@@ -1,4 +1,4 @@
-Rendering a real `Whisper.MessageView` using `<util.MessageParents />` and
+Rendering a real `Whisper.MessageView` using `<util.ConversationContextProvider />` and
 `<util.BackboneWrapper />`.
 
 ```jsx
@@ -11,10 +11,10 @@ const View = Whisper.MessageView;
 const options = {
   model,
 };
-<util.MessageParents theme={util.theme}>
+<util.ConversationContext theme={util.theme}>
   <util.BackboneWrapper
     View={View}
     options={options}
   />
-</util.MessageParents>
+</util.ConversationContext>
 ```
diff --git a/js/react/util/BackboneWrapper.tsx b/js/react/util/BackboneWrapper.tsx
index 5471dda20..6194d76e6 100644
--- a/js/react/util/BackboneWrapper.tsx
+++ b/js/react/util/BackboneWrapper.tsx
@@ -22,24 +22,28 @@ interface BackboneViewConstructor {
  * while we slowly replace the internals of a given Backbone view with React.
  */
 export class BackboneWrapper extends React.Component<Props, {}> {
-  protected el: Element | null;
-  protected view: BackboneView | null;
-  protected setEl: (element: HTMLDivElement | null) => void;
+  protected el: Element | null = null;
+  protected view: BackboneView | null = null;
 
-  constructor(props: Props) {
-    super(props);
+  public componentWillUnmount() {
+    this.teardown();
+  }
 
-    this.el = null;
-    this.view = null;
+  public shouldComponentUpdate() {
+    // we're handling all updates manually
+    return false;
+  }
+
+  public render() {
+    return <div ref={this.setEl} />;
+  }
 
-    this.setEl = (element: HTMLDivElement | null) => {
-      this.el = element;
-      this.setup();
-    };
-    this.setup = this.setup.bind(this);
+  protected setEl = (element: HTMLDivElement | null) => {
+    this.el = element;
+    this.setup();
   }
 
-  public setup() {
+  protected setup = () => {
     const { el } = this;
     const { View, options } = this.props;
 
@@ -54,7 +58,7 @@ export class BackboneWrapper extends React.Component<Props, {}> {
     el.appendChild(this.view.el);
   }
 
-  public teardown() {
+  protected teardown() {
     if (!this.view) {
       return;
     }
@@ -62,17 +66,4 @@ export class BackboneWrapper extends React.Component<Props, {}> {
     this.view.remove();
     this.view = null;
   }
-
-  public componentWillUnmount() {
-    this.teardown();
-  }
-
-  public shouldComponentUpdate() {
-    // we're handling all updates manually
-    return false;
-  }
-
-  public render() {
-    return <div ref={this.setEl} />;
-  }
 }
diff --git a/js/react/util/ConversationContext.md b/js/react/util/ConversationContext.md
new file mode 100644
index 000000000..6a314e44e
--- /dev/null
+++ b/js/react/util/ConversationContext.md
@@ -0,0 +1,8 @@
+
+The simplest example of using the `<ConversationContext />` component:
+
+```jsx
+<util.ConversationContext theme={util.theme}>
+  <div>Just a plain bit of text</div>
+</util.ConversationContext>
+```
diff --git a/js/react/util/MessageParents.tsx b/js/react/util/ConversationContext.tsx
similarity index 91%
rename from js/react/util/MessageParents.tsx
rename to js/react/util/ConversationContext.tsx
index 4cdf2545a..9c3651840 100644
--- a/js/react/util/MessageParents.tsx
+++ b/js/react/util/ConversationContext.tsx
@@ -12,7 +12,7 @@ interface Props {
  * Provides the parent elements necessary to allow the main Signal Desktop stylesheet to
  * apply (with no changes) to messages in this context.
  */
-export class MessageParents extends React.Component<Props, {}> {
+export class ConversationContext extends React.Component<Props, {}> {
   public render() {
     const { theme } = this.props;
 
diff --git a/js/react/util/MessageParents.md b/js/react/util/MessageParents.md
deleted file mode 100644
index 8436b5fa3..000000000
--- a/js/react/util/MessageParents.md
+++ /dev/null
@@ -1,8 +0,0 @@
-
-The simplest example of using the `<MessagesParents />` component:
-
-```jsx
-<util.MessageParents theme={util.theme}>
-  <div>Just a plain bit of text</div>
-</util.MessageParents>
-```
diff --git a/js/react/util/index.ts b/js/react/util/index.ts
index b1446fc4f..e8a8ba550 100644
--- a/js/react/util/index.ts
+++ b/js/react/util/index.ts
@@ -8,7 +8,7 @@ import ReactDOM from 'react-dom';
 // Helper components used in the styleguide, exposed at 'util' in the global scope via the
 //   context option in react-styleguidist.
 
-export { MessageParents } from './MessageParents';
+export { ConversationContext } from './ConversationContext';
 export { BackboneWrapper } from './BackboneWrapper';
 
 // Here we can make things inside Webpack available to Backbone views like preload.js.