From 52c42a797577eebfca0ccf7aae6c868b659492a6 Mon Sep 17 00:00:00 2001
From: Andrew Musgrave <andrew.musgrave@shopify.com>
Date: Thu, 30 May 2019 10:38:33 -0400
Subject: [PATCH 1/2] Simplify withinContentContext

---
 src/components/Banner/Banner.tsx                    |  2 +-
 src/components/Banner/tests/Banner.test.tsx         |  6 +-----
 src/components/Card/Card.tsx                        |  6 +-----
 src/components/Card/tests/Card.test.tsx             | 10 +++++++---
 src/components/Modal/Modal.tsx                      |  6 +-----
 src/components/Modal/tests/Modal.test.tsx           | 10 +++++++---
 src/components/Navigation/Navigation.tsx            |  2 +-
 src/components/Navigation/tests/Navigation.test.tsx |  2 +-
 src/components/WithinContentContext/context.tsx     | 10 ++++------
 9 files changed, 24 insertions(+), 30 deletions(-)

diff --git a/src/components/Banner/Banner.tsx b/src/components/Banner/Banner.tsx
index e169b7f7929..c487b085efd 100644
--- a/src/components/Banner/Banner.tsx
+++ b/src/components/Banner/Banner.tsx
@@ -48,7 +48,7 @@ export default class Banner extends React.PureComponent<Props, never> {
   render() {
     return (
       <WithinContentContext.Consumer>
-        {({withinContentContainer}) => {
+        {(withinContentContainer) => {
           const {
             icon,
             action,
diff --git a/src/components/Banner/tests/Banner.test.tsx b/src/components/Banner/tests/Banner.test.tsx
index 71798000a36..ed70570ff4f 100644
--- a/src/components/Banner/tests/Banner.test.tsx
+++ b/src/components/Banner/tests/Banner.test.tsx
@@ -96,12 +96,8 @@ describe('<Banner />', () => {
     expect(unstyledLink.prop('rel')).toBe('noopener noreferrer');
   });
 
-  const mockContext = {
-    withinContentContainer: true,
-  };
-
   const bannerWithContentContext = mountWithAppProvider(
-    <WithinContentContext.Provider value={mockContext}>
+    <WithinContentContext.Provider value>
       <Banner
         action={{
           content: 'Primary action',
diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx
index dabf971bd83..2f90f2abbcb 100644
--- a/src/components/Card/Card.tsx
+++ b/src/components/Card/Card.tsx
@@ -66,12 +66,8 @@ export default class Card extends React.PureComponent<Props, never> {
         </div>
       ) : null;
 
-    const context = {
-      withinContentContainer: true,
-    };
-
     return (
-      <WithinContentContext.Provider value={context}>
+      <WithinContentContext.Provider value>
         <div className={className}>
           {headerMarkup}
           {content}
diff --git a/src/components/Card/tests/Card.test.tsx b/src/components/Card/tests/Card.test.tsx
index 25709e61b1e..95d8cbcc573 100644
--- a/src/components/Card/tests/Card.test.tsx
+++ b/src/components/Card/tests/Card.test.tsx
@@ -9,15 +9,19 @@ import {Section} from '../components';
 
 describe('<Card />', () => {
   it('has a child with prop withinContentContainer set to true', () => {
-    function TestComponent(_: WithinContentContextType) {
+    function TestComponent(_: {
+      withinContentContainer: WithinContentContextType;
+    }) {
       return null;
     }
 
     const component = mountWithAppProvider(
       <Card>
         <WithinContentContext.Consumer>
-          {(props) => {
-            return <TestComponent {...props} />;
+          {(withinContentContext) => {
+            return (
+              <TestComponent withinContentContainer={withinContentContext} />
+            );
           }}
         </WithinContentContext.Consumer>
       </Card>,
diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx
index 836fe94c562..1029ea3388b 100644
--- a/src/components/Modal/Modal.tsx
+++ b/src/components/Modal/Modal.tsx
@@ -301,12 +301,8 @@ export class Modal extends React.Component<CombinedProps, State> {
 
     const animated = !instant;
 
-    const context = {
-      withinContentContainer: true,
-    };
-
     return (
-      <WithinContentContext.Provider value={context}>
+      <WithinContentContext.Provider value>
         <Portal idPrefix="modal">
           <TransitionGroup appear={animated} enter={animated} exit={animated}>
             {dialog}
diff --git a/src/components/Modal/tests/Modal.test.tsx b/src/components/Modal/tests/Modal.test.tsx
index 3c9db093a24..610f42ac358 100644
--- a/src/components/Modal/tests/Modal.test.tsx
+++ b/src/components/Modal/tests/Modal.test.tsx
@@ -25,15 +25,19 @@ describe('<Modal>', () => {
   });
 
   it('has a child with contentContext', () => {
-    function TestComponent(_: WithinContentContextType) {
+    function TestComponent(_: {
+      withinContentContainer: WithinContentContextType;
+    }) {
       return null;
     }
 
     const component = mountWithAppProvider(
       <Modal onClose={jest.fn()} open>
         <WithinContentContext.Consumer>
-          {(props) => {
-            return <TestComponent {...props} />;
+          {(withinContentContext) => {
+            return (
+              <TestComponent withinContentContainer={withinContentContext} />
+            );
           }}
         </WithinContentContext.Consumer>
       </Modal>,
diff --git a/src/components/Navigation/Navigation.tsx b/src/components/Navigation/Navigation.tsx
index bb56b5499e0..565ea29ec8f 100644
--- a/src/components/Navigation/Navigation.tsx
+++ b/src/components/Navigation/Navigation.tsx
@@ -55,7 +55,7 @@ export default class Navigation extends React.Component<Props, never> {
 
     return (
       <NavigationContext.Provider value={context}>
-        <WithinContentContext.Provider value={{withinContentContainer: true}}>
+        <WithinContentContext.Provider value>
           <nav className={styles.Navigation}>
             {contextControlMarkup}
             <div className={styles.UserMenu}>{userMenu}</div>
diff --git a/src/components/Navigation/tests/Navigation.test.tsx b/src/components/Navigation/tests/Navigation.test.tsx
index 43b71ebedae..07ec3824be5 100644
--- a/src/components/Navigation/tests/Navigation.test.tsx
+++ b/src/components/Navigation/tests/Navigation.test.tsx
@@ -41,7 +41,7 @@ describe('<Navigation />', () => {
       const Child: React.SFC<{}> = (_props) => {
         return (
           <WithinContentContext.Consumer>
-            {({withinContentContainer}) =>
+            {(withinContentContainer) =>
               withinContentContainer ? <div /> : null
             }
           </WithinContentContext.Consumer>
diff --git a/src/components/WithinContentContext/context.tsx b/src/components/WithinContentContext/context.tsx
index f946e2e02ad..f065435f953 100644
--- a/src/components/WithinContentContext/context.tsx
+++ b/src/components/WithinContentContext/context.tsx
@@ -1,11 +1,9 @@
 import React from 'react';
 
-export interface WithinContentContextType {
-  withinContentContainer: boolean;
-}
+export type WithinContentContextType = boolean;
 
-const WithinContentContext = React.createContext<WithinContentContextType>({
-  withinContentContainer: false,
-});
+const WithinContentContext = React.createContext<WithinContentContextType>(
+  false,
+);
 
 export default WithinContentContext;

From 2b22627a04fd508731a5a15dae3edbf648c1b29c Mon Sep 17 00:00:00 2001
From: Andrew Musgrave <andrew.musgrave@shopify.com>
Date: Thu, 30 May 2019 10:55:04 -0400
Subject: [PATCH 2/2] changelog & simplify type

---
 UNRELEASED-V4.md                                | 1 +
 src/components/Card/tests/Card.test.tsx         | 8 ++------
 src/components/Modal/tests/Modal.test.tsx       | 8 ++------
 src/components/WithinContentContext/context.tsx | 6 +-----
 src/components/WithinContentContext/index.ts    | 1 -
 5 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/UNRELEASED-V4.md b/UNRELEASED-V4.md
index 641d4572c70..19b187142d4 100644
--- a/UNRELEASED-V4.md
+++ b/UNRELEASED-V4.md
@@ -34,6 +34,7 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f
 
 ### Code quality
 
+- Simplified `WithinContentContainer` context type ([#1602](https://github.com/Shopify/polaris-react/pull/1602))
 - Remove `withRef` and `withContext` from `DropZone.FileUpload` ([#1491](https://github.com/Shopify/polaris-react/pull/1491))
 - Updated `OptionList` to no longer use `componentWillReceiveProps`([#1557](https://github.com/Shopify/polaris-react/pull/1557))
 - Updated all our context files to export react context rather than a provider and consumer ([#1459](https://github.com/Shopify/polaris-react/pull/1459))
diff --git a/src/components/Card/tests/Card.test.tsx b/src/components/Card/tests/Card.test.tsx
index 95d8cbcc573..b3b4f03d54f 100644
--- a/src/components/Card/tests/Card.test.tsx
+++ b/src/components/Card/tests/Card.test.tsx
@@ -2,16 +2,12 @@ import React from 'react';
 import {mountWithAppProvider} from 'test-utilities';
 import {Card, Badge, Button} from 'components';
 
-import WithinContentContext, {
-  WithinContentContextType,
-} from '../../WithinContentContext';
+import WithinContentContext from '../../WithinContentContext';
 import {Section} from '../components';
 
 describe('<Card />', () => {
   it('has a child with prop withinContentContainer set to true', () => {
-    function TestComponent(_: {
-      withinContentContainer: WithinContentContextType;
-    }) {
+    function TestComponent(_: {withinContentContainer: any}) {
       return null;
     }
 
diff --git a/src/components/Modal/tests/Modal.test.tsx b/src/components/Modal/tests/Modal.test.tsx
index 610f42ac358..1f562c3d663 100644
--- a/src/components/Modal/tests/Modal.test.tsx
+++ b/src/components/Modal/tests/Modal.test.tsx
@@ -6,9 +6,7 @@ import {Badge, Spinner, Portal, Scrollable} from 'components';
 import {Footer, Dialog} from '../components';
 import Modal from '../Modal';
 
-import WithinContentContext, {
-  WithinContentContextType,
-} from '../../WithinContentContext';
+import WithinContentContext from '../../WithinContentContext';
 
 jest.mock('../../../utilities/app-bridge-transformers', () => ({
   ...require.requireActual('../../../utilities/app-bridge-transformers'),
@@ -25,9 +23,7 @@ describe('<Modal>', () => {
   });
 
   it('has a child with contentContext', () => {
-    function TestComponent(_: {
-      withinContentContainer: WithinContentContextType;
-    }) {
+    function TestComponent(_: {withinContentContainer: any}) {
       return null;
     }
 
diff --git a/src/components/WithinContentContext/context.tsx b/src/components/WithinContentContext/context.tsx
index f065435f953..771510e97ba 100644
--- a/src/components/WithinContentContext/context.tsx
+++ b/src/components/WithinContentContext/context.tsx
@@ -1,9 +1,5 @@
 import React from 'react';
 
-export type WithinContentContextType = boolean;
-
-const WithinContentContext = React.createContext<WithinContentContextType>(
-  false,
-);
+const WithinContentContext = React.createContext<boolean>(false);
 
 export default WithinContentContext;
diff --git a/src/components/WithinContentContext/index.ts b/src/components/WithinContentContext/index.ts
index e6605ee442c..825fa6fde14 100644
--- a/src/components/WithinContentContext/index.ts
+++ b/src/components/WithinContentContext/index.ts
@@ -1,4 +1,3 @@
 import WithinContentContext from './context';
 
-export {WithinContentContextType} from './context';
 export default WithinContentContext;