feat!: Deprecate the Modal component (#956)

BREAKING CHANGE: The Modal component has been removed. The USWDS Modal will be added when reaching parity with USWDS 2.11.x
trussworks · May 12, 2021 · 7ae4e30 · 7ae4e30
1 parent c063047
commit 7ae4e30
Show file tree

Hide file tree

Showing 19 changed files with 9 additions and 708 deletions.
diff --git a/docs/adding_new_components.md b/docs/adding_new_components.md
@@ -68,7 +68,7 @@ There is a significant difference between thinking about the component props in
 ### Common Components in `react-uswds`
 
 - Components that apply uswds styles to a standard HTMLElement - `Button`, `Table`
-- Components that encapsulate user interaction flows - `Accordion`, `Modal`
+- Components that encapsulate user interaction flows - `Accordion`
 - Components for a common gov tech use case - `Search`, `SocialLinks`
 - Components that render children - `Card`, `Header`, `Footer`
 - Components related to forms, especially form inputs - `DateInput`, `TextInput` `Checkbox`, `Label`
diff --git a/example/package.json b/example/package.json
@@ -10,9 +10,7 @@
     "formik": "^2.2.6",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-redux": "^7.2.4",
     "react-router-dom": "^5.2.0",
-    "redux": "^4.0.5",
     "yup": "^0.32.9"
   },
   "scripts": {
@@ -43,7 +41,6 @@
     "@types/node": "^14.14.31",
     "@types/react": "^17.0.4",
     "@types/react-dom": "^17.0.3",
-    "@types/react-redux": "^7.1.16",
     "@types/react-router-dom": "^5.1.7",
     "@types/yup": "^0.29.11",
     "customize-cra": "^1.0.0",

diff --git a/example/src/App.test.tsx b/example/src/App.test.tsx
@@ -5,5 +5,5 @@ import App from './App';
 // TODO Add additional app testing
 test('renders the app without error', () => {
   const { getByText } = render(<App />)
-  expect(getByText('Modals')).toBeInTheDocument()
+  expect(getByText('Examples')).toBeInTheDocument()
 })
diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -20,7 +20,6 @@ import {
 
 import HomePage from './pages/Home'
 import ExamplePage from './pages/Example'
-import ModalsPage from './pages/Modals'
 import FormsPage from './pages/Forms'
 import IconsPage from './pages/Icons'
 import { Routes } from './routes'
@@ -29,7 +28,7 @@ import './App.css'
 
 const App = () => {
   const [mobileNavOpen, setMobileNavOpen] = useState(false)
-  const { HOME_PAGE, EXAMPLES_PAGE, MODALS_PAGE, FORMS_PAGE, ICONS_PAGE } = Routes
+  const { HOME_PAGE, EXAMPLES_PAGE, FORMS_PAGE, ICONS_PAGE } = Routes
 
   const toggleMobileNav = (): void => {
     setMobileNavOpen((prevOpen) => !prevOpen)
@@ -42,9 +41,6 @@ const App = () => {
     <NavLink to={EXAMPLES_PAGE} activeClassName="usa-current">
       Examples
     </NavLink>,
-    <NavLink to={MODALS_PAGE} activeClassName="usa-current">
-      Modals
-    </NavLink>,
     <NavLink to={ICONS_PAGE} activeClassName="usa-current">
       Icons
     </NavLink>,
@@ -81,9 +77,6 @@ const App = () => {
             <Route path={EXAMPLES_PAGE}>
               <ExamplePage />
             </Route>
-            <Route path={MODALS_PAGE}>
-              <ModalsPage />
-            </Route>
             <Route path={ICONS_PAGE}>
               <IconsPage />
             </Route>

diff --git a/example/src/index.tsx b/example/src/index.tsx
@@ -3,19 +3,11 @@ import ReactDOM from 'react-dom'
 import './index.css'
 import App from './App'
 import * as serviceWorker from './serviceWorker'
-import { createStore } from 'redux'
-import { Provider } from 'react-redux'
-
-import { rootReducer } from './redux/reducers'
-
-const store = createStore(rootReducer)
 
 ReactDOM.render(
-  <Provider store={store}>
     <React.StrictMode>
       <App />
-    </React.StrictMode>
-  </Provider>,
+    </React.StrictMode>,
   document.getElementById('root')
 )
 

diff --git a/example/src/pages/Example.tsx b/example/src/pages/Example.tsx
@@ -20,11 +20,11 @@ const ExamplePage = (): React.ReactElement => (
       </li>
       <li>
         <USWDSLink
-          to="/modals"
+          to="/icons"
           asCustom={Link}
           variant="external"
           target="_blank">
-          Modals
+          Icons
         </USWDSLink>
       </li>
     </ul>

diff --git a/example/src/pages/Modals.tsx b/example/src/pages/Modals.tsx
diff --git a/example/src/redux/actions.test.ts b/example/src/redux/actions.test.ts
diff --git a/example/src/redux/actions.tsx b/example/src/redux/actions.tsx
diff --git a/example/src/redux/reducer.test.ts b/example/src/redux/reducer.test.ts
diff --git a/example/src/redux/reducers.ts b/example/src/redux/reducers.ts
diff --git a/example/src/redux/types.ts b/example/src/redux/types.ts
diff --git a/example/src/routes.js b/example/src/routes.js
@@ -2,7 +2,6 @@ const Routes = {
   HOME_PAGE: '/',
   EXAMPLES_PAGE: '/examples',
   FORMS_PAGE: '/forms',
-  MODALS_PAGE: '/modals',
   ICONS_PAGE: '/icons',
 }