From be5f80a04b074352d00eac8c528a04b3824b3db0 Mon Sep 17 00:00:00 2001
From: Nick Taylor <nick@iamdeveloper.com>
Date: Thu, 14 May 2020 16:58:29 -0400
Subject: [PATCH] Moved common-prop-types out of src/ folder (#7871)

---
 app/javascript/Snackbar/SnackbarItem.jsx                  | 2 +-
 app/javascript/articles/Article.jsx                       | 2 +-
 app/javascript/articles/PodcastArticle.jsx                | 2 +-
 app/javascript/articles/__stories__/articleDecorator.jsx  | 4 ++--
 app/javascript/articles/components/ArticleCoverImage.jsx  | 4 ++--
 app/javascript/articles/components/ContentTitle.jsx       | 2 +-
 app/javascript/articles/components/Meta.jsx               | 2 +-
 app/javascript/articles/components/ReactionsCount.jsx     | 2 +-
 app/javascript/articles/components/SaveButton.jsx         | 2 +-
 app/javascript/articles/components/SearchSnippet.jsx      | 2 +-
 app/javascript/articles/components/TagList.jsx            | 4 ++--
 app/javascript/articles/components/Video.jsx              | 4 ++--
 .../common-prop-types/article-prop-types.js               | 0
 .../common-prop-types/default-children-prop-types.js      | 0
 .../{src/components => }/common-prop-types/index.js       | 0
 .../common-prop-types/organization-prop-type.js           | 0
 .../common-prop-types/selected-tags-prop-types.js         | 0
 .../components => }/common-prop-types/tag-prop-types.js   | 0
 .../components => }/common-prop-types/user-prop-types.js  | 0
 app/javascript/crayons/Button/Button.jsx                  | 2 +-
 app/javascript/crayons/ButtonGroup/ButtonGroup.jsx        | 2 +-
 app/javascript/crayons/Dropdown/Dropdown.jsx              | 2 +-
 app/javascript/crayons/Modal/Modal.jsx                    | 2 +-
 .../crayons/formElements/FormField/FormField.jsx          | 2 +-
 app/javascript/crayons/storybook-utilities/Fieldset.jsx   | 2 +-
 app/javascript/leftSidebar/TagsFollowed.jsx               | 4 ++--
 app/javascript/listings/components/ClassifiedFilters.jsx  | 6 +++---
 .../listings/components/ClassifiedFiltersTags.jsx         | 2 +-
 app/javascript/listings/components/SelectedTags.jsx       | 2 +-
 app/javascript/organization/OrganizationPicker.jsx        | 4 ++--
 app/javascript/packs/homePageFeed.jsx                     | 2 +-
 app/javascript/podcasts/PodcastEpisode.jsx                | 2 +-
 app/javascript/podcasts/TodaysPodcasts.jsx                | 8 +++++---
 app/javascript/sidebar-widget/sidebarUser.jsx             | 2 +-
 .../src/components/__stories__/GlobalModalWrapper.jsx     | 2 +-
 35 files changed, 40 insertions(+), 38 deletions(-)
 rename app/javascript/{src/components => }/common-prop-types/article-prop-types.js (100%)
 rename app/javascript/{src/components => }/common-prop-types/default-children-prop-types.js (100%)
 rename app/javascript/{src/components => }/common-prop-types/index.js (100%)
 rename app/javascript/{src/components => }/common-prop-types/organization-prop-type.js (100%)
 rename app/javascript/{src/components => }/common-prop-types/selected-tags-prop-types.js (100%)
 rename app/javascript/{src/components => }/common-prop-types/tag-prop-types.js (100%)
 rename app/javascript/{src/components => }/common-prop-types/user-prop-types.js (100%)

diff --git a/app/javascript/Snackbar/SnackbarItem.jsx b/app/javascript/Snackbar/SnackbarItem.jsx
index 67e094a8e..ea6d49959 100644
--- a/app/javascript/Snackbar/SnackbarItem.jsx
+++ b/app/javascript/Snackbar/SnackbarItem.jsx
@@ -1,7 +1,7 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
 import { Button } from '@crayons';
-import { defaultChildrenPropTypes } from '../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../common-prop-types';
 
 export const snackbarItemProps = {
   children: defaultChildrenPropTypes.isRequired,
diff --git a/app/javascript/articles/Article.jsx b/app/javascript/articles/Article.jsx
index b2a6ed3ef..01449bb57 100644
--- a/app/javascript/articles/Article.jsx
+++ b/app/javascript/articles/Article.jsx
@@ -1,6 +1,6 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { articlePropTypes } from '../src/components/common-prop-types/article-prop-types';
+import { articlePropTypes } from '../common-prop-types/article-prop-types';
 import {
   ArticleCoverImage,
   CommentsCount,
diff --git a/app/javascript/articles/PodcastArticle.jsx b/app/javascript/articles/PodcastArticle.jsx
index c18af2bbc..06dda4342 100644
--- a/app/javascript/articles/PodcastArticle.jsx
+++ b/app/javascript/articles/PodcastArticle.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { articlePropTypes } from '../src/components/common-prop-types/article-prop-types';
+import { articlePropTypes } from '../common-prop-types/article-prop-types';
 
 export const PodcastArticle = ({ article }) => {
   return (
diff --git a/app/javascript/articles/__stories__/articleDecorator.jsx b/app/javascript/articles/__stories__/articleDecorator.jsx
index 64aa7c3d5..db7d8ff9c 100644
--- a/app/javascript/articles/__stories__/articleDecorator.jsx
+++ b/app/javascript/articles/__stories__/articleDecorator.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { defaultChildrenPropTypes } from '../../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../../common-prop-types';
 
 const ArticleWrapper = ({ children }) => (
   <div className="articles-list">{children}</div>
@@ -9,6 +9,6 @@ ArticleWrapper.propTypes = {
 };
 ArticleWrapper.displayName = 'ArticleWrapper';
 
-export const articleDecorator = getStory => (
+export const articleDecorator = (getStory) => (
   <ArticleWrapper>{getStory()}</ArticleWrapper>
 );
diff --git a/app/javascript/articles/components/ArticleCoverImage.jsx b/app/javascript/articles/components/ArticleCoverImage.jsx
index 5050c3ccf..34d919f5a 100644
--- a/app/javascript/articles/components/ArticleCoverImage.jsx
+++ b/app/javascript/articles/components/ArticleCoverImage.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { articlePropTypes } from '../../src/components/common-prop-types';
+import { articlePropTypes } from '../../common-prop-types';
 
 export const ArticleCoverImage = ({ article }) => {
   return (
@@ -9,7 +9,7 @@ export const ArticleCoverImage = ({ article }) => {
       title={article.title}
     >
       <div
-        style={{backgroundImage: `url(${article.main_image})`}}
+        style={{ backgroundImage: `url(${article.main_image})` }}
         className="crayons-story__cover__image"
         loading="lazy"
       />
diff --git a/app/javascript/articles/components/ContentTitle.jsx b/app/javascript/articles/components/ContentTitle.jsx
index ce1acde1c..f25fbc96c 100644
--- a/app/javascript/articles/components/ContentTitle.jsx
+++ b/app/javascript/articles/components/ContentTitle.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { articlePropTypes } from '../../src/components/common-prop-types';
+import { articlePropTypes } from '../../common-prop-types';
 
 export const ContentTitle = ({ article }) => (
   <h2 className="crayons-story__title">
diff --git a/app/javascript/articles/components/Meta.jsx b/app/javascript/articles/components/Meta.jsx
index 4634ae18d..66fb95dd0 100644
--- a/app/javascript/articles/components/Meta.jsx
+++ b/app/javascript/articles/components/Meta.jsx
@@ -2,7 +2,7 @@ import { h } from 'preact';
 import {
   articlePropTypes,
   organizationPropType,
-} from '../../src/components/common-prop-types';
+} from '../../common-prop-types';
 import { PublishDate } from './PublishDate';
 
 export const Meta = ({ article, organization }) => {
diff --git a/app/javascript/articles/components/ReactionsCount.jsx b/app/javascript/articles/components/ReactionsCount.jsx
index eb18d3773..80ab1db5a 100644
--- a/app/javascript/articles/components/ReactionsCount.jsx
+++ b/app/javascript/articles/components/ReactionsCount.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { articlePropTypes } from '../../src/components/common-prop-types';
+import { articlePropTypes } from '../../common-prop-types';
 import { Button } from '../../crayons/Button';
 
 export const ReactionsCount = ({ article }) => {
diff --git a/app/javascript/articles/components/SaveButton.jsx b/app/javascript/articles/components/SaveButton.jsx
index eb1f7b10b..d21d22473 100644
--- a/app/javascript/articles/components/SaveButton.jsx
+++ b/app/javascript/articles/components/SaveButton.jsx
@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 import PropTypes from 'prop-types';
-import { articlePropTypes } from '../../src/components/common-prop-types';
+import { articlePropTypes } from '../../common-prop-types';
 
 export class SaveButton extends Component {
   componentDidMount() {
diff --git a/app/javascript/articles/components/SearchSnippet.jsx b/app/javascript/articles/components/SearchSnippet.jsx
index 4542dee0f..a226a3581 100644
--- a/app/javascript/articles/components/SearchSnippet.jsx
+++ b/app/javascript/articles/components/SearchSnippet.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { articleSnippetResultPropTypes } from '../../src/components/common-prop-types';
+import { articleSnippetResultPropTypes } from '../../common-prop-types';
 
 export const SearchSnippet = ({ highlightText }) => {
   if (highlightText && highlightText.body_text.length > 0) {
diff --git a/app/javascript/articles/components/TagList.jsx b/app/javascript/articles/components/TagList.jsx
index f390b9041..ff9a1c719 100644
--- a/app/javascript/articles/components/TagList.jsx
+++ b/app/javascript/articles/components/TagList.jsx
@@ -1,9 +1,9 @@
 import { h } from 'preact';
-import { tagPropTypes } from '../../src/components/common-prop-types';
+import { tagPropTypes } from '../../common-prop-types';
 
 export const TagList = ({ tags = [] }) => (
   <div className="crayons-story__tags">
-    {tags.map(tag => (
+    {tags.map((tag) => (
       <a className="crayons-tag" href={`/t/${tag}`}>
         <span className="crayons-tag__prefix">#</span>
         {tag}
diff --git a/app/javascript/articles/components/Video.jsx b/app/javascript/articles/components/Video.jsx
index 80098dddd..944d937fa 100644
--- a/app/javascript/articles/components/Video.jsx
+++ b/app/javascript/articles/components/Video.jsx
@@ -1,7 +1,7 @@
 import { h } from 'preact';
-import { articlePropTypes } from '../../src/components/common-prop-types';
+import { articlePropTypes } from '../../common-prop-types';
 
-export const Video = ({article}) => {
+export const Video = ({ article }) => {
   return (
     <a
       href={article.path}
diff --git a/app/javascript/src/components/common-prop-types/article-prop-types.js b/app/javascript/common-prop-types/article-prop-types.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/article-prop-types.js
rename to app/javascript/common-prop-types/article-prop-types.js
diff --git a/app/javascript/src/components/common-prop-types/default-children-prop-types.js b/app/javascript/common-prop-types/default-children-prop-types.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/default-children-prop-types.js
rename to app/javascript/common-prop-types/default-children-prop-types.js
diff --git a/app/javascript/src/components/common-prop-types/index.js b/app/javascript/common-prop-types/index.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/index.js
rename to app/javascript/common-prop-types/index.js
diff --git a/app/javascript/src/components/common-prop-types/organization-prop-type.js b/app/javascript/common-prop-types/organization-prop-type.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/organization-prop-type.js
rename to app/javascript/common-prop-types/organization-prop-type.js
diff --git a/app/javascript/src/components/common-prop-types/selected-tags-prop-types.js b/app/javascript/common-prop-types/selected-tags-prop-types.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/selected-tags-prop-types.js
rename to app/javascript/common-prop-types/selected-tags-prop-types.js
diff --git a/app/javascript/src/components/common-prop-types/tag-prop-types.js b/app/javascript/common-prop-types/tag-prop-types.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/tag-prop-types.js
rename to app/javascript/common-prop-types/tag-prop-types.js
diff --git a/app/javascript/src/components/common-prop-types/user-prop-types.js b/app/javascript/common-prop-types/user-prop-types.js
similarity index 100%
rename from app/javascript/src/components/common-prop-types/user-prop-types.js
rename to app/javascript/common-prop-types/user-prop-types.js
diff --git a/app/javascript/crayons/Button/Button.jsx b/app/javascript/crayons/Button/Button.jsx
index c1e849835..db9d77c12 100644
--- a/app/javascript/crayons/Button/Button.jsx
+++ b/app/javascript/crayons/Button/Button.jsx
@@ -1,6 +1,6 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { defaultChildrenPropTypes } from '../../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../../common-prop-types';
 
 function getAdditionalClassNames({
   variant,
diff --git a/app/javascript/crayons/ButtonGroup/ButtonGroup.jsx b/app/javascript/crayons/ButtonGroup/ButtonGroup.jsx
index 32405544a..576c036f1 100644
--- a/app/javascript/crayons/ButtonGroup/ButtonGroup.jsx
+++ b/app/javascript/crayons/ButtonGroup/ButtonGroup.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { defaultChildrenPropTypes } from '../../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../../common-prop-types';
 
 export const ButtonGroup = ({ children }) => (
   <div className="crayons-btn-group">{children}</div>
diff --git a/app/javascript/crayons/Dropdown/Dropdown.jsx b/app/javascript/crayons/Dropdown/Dropdown.jsx
index 1c5292cc0..4a6c233ad 100644
--- a/app/javascript/crayons/Dropdown/Dropdown.jsx
+++ b/app/javascript/crayons/Dropdown/Dropdown.jsx
@@ -1,6 +1,6 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { defaultChildrenPropTypes } from '../../src/components/common-prop-types/default-children-prop-types';
+import { defaultChildrenPropTypes } from '../../common-prop-types/default-children-prop-types';
 
 export const Dropdown = ({ children, className }) => {
   return (
diff --git a/app/javascript/crayons/Modal/Modal.jsx b/app/javascript/crayons/Modal/Modal.jsx
index a8d6d1e25..60cf4a57b 100644
--- a/app/javascript/crayons/Modal/Modal.jsx
+++ b/app/javascript/crayons/Modal/Modal.jsx
@@ -1,7 +1,7 @@
 import { h, Component } from 'preact';
 import PropTypes from 'prop-types';
 import { Button } from '@crayons';
-import { defaultChildrenPropTypes } from '../../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../../common-prop-types';
 
 function getAdditionalClassNames({ size, className }) {
   let additionalClassNames = '';
diff --git a/app/javascript/crayons/formElements/FormField/FormField.jsx b/app/javascript/crayons/formElements/FormField/FormField.jsx
index 01d9d8ad9..5dc305ca8 100644
--- a/app/javascript/crayons/formElements/FormField/FormField.jsx
+++ b/app/javascript/crayons/formElements/FormField/FormField.jsx
@@ -1,6 +1,6 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { defaultChildrenPropTypes } from '../../../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../../../common-prop-types';
 
 // Only radio and checkboxes require an additional CSS class (variant class). Other form elements do not.
 
diff --git a/app/javascript/crayons/storybook-utilities/Fieldset.jsx b/app/javascript/crayons/storybook-utilities/Fieldset.jsx
index 27248fe8d..fab24eb82 100644
--- a/app/javascript/crayons/storybook-utilities/Fieldset.jsx
+++ b/app/javascript/crayons/storybook-utilities/Fieldset.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { defaultChildrenPropTypes } from '../../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../../common-prop-types';
 
 export const Fieldset = ({ children }) => (
   <fieldset style={{ border: 'none' }}>{children}</fieldset>
diff --git a/app/javascript/leftSidebar/TagsFollowed.jsx b/app/javascript/leftSidebar/TagsFollowed.jsx
index 1c9d85aa5..d8199aea2 100644
--- a/app/javascript/leftSidebar/TagsFollowed.jsx
+++ b/app/javascript/leftSidebar/TagsFollowed.jsx
@@ -1,12 +1,12 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { tagPropTypes } from '../src/components/common-prop-types';
+import { tagPropTypes } from '../common-prop-types';
 
 export const TagsFollowed = ({ tags = [] }) => {
   // TODO: Once we're using Preact X >, we can replace the containing <div /> with a Fragment, <></>
   return (
     <div id="followed-tags-wrapper">
-      {tags.map(tag => (
+      {tags.map((tag) => (
         <div
           key={tag.id}
           className="sidebar-nav-element"
diff --git a/app/javascript/listings/components/ClassifiedFilters.jsx b/app/javascript/listings/components/ClassifiedFilters.jsx
index f9cbbd570..8a7d3fc0f 100644
--- a/app/javascript/listings/components/ClassifiedFilters.jsx
+++ b/app/javascript/listings/components/ClassifiedFilters.jsx
@@ -1,8 +1,8 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import ClassifiedFiltersCategories from "./ClassifiedFiltersCategories";
-import ClassifiedFiltersTags from "./ClassifiedFiltersTags";
-import { tagPropTypes } from '../../src/components/common-prop-types';
+import ClassifiedFiltersCategories from './ClassifiedFiltersCategories';
+import ClassifiedFiltersTags from './ClassifiedFiltersTags';
+import { tagPropTypes } from '../../common-prop-types';
 
 const ClassifiedFilters = ({
   categories,
diff --git a/app/javascript/listings/components/ClassifiedFiltersTags.jsx b/app/javascript/listings/components/ClassifiedFiltersTags.jsx
index 4dc57a352..11b70b8e0 100644
--- a/app/javascript/listings/components/ClassifiedFiltersTags.jsx
+++ b/app/javascript/listings/components/ClassifiedFiltersTags.jsx
@@ -1,6 +1,6 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { tagPropTypes } from '../../src/components/common-prop-types';
+import { tagPropTypes } from '../../common-prop-types';
 import ClearQueryButton from './ClearQueryButton';
 import SelectedTags from './SelectedTags';
 
diff --git a/app/javascript/listings/components/SelectedTags.jsx b/app/javascript/listings/components/SelectedTags.jsx
index 961dc1bd6..e45109bb2 100644
--- a/app/javascript/listings/components/SelectedTags.jsx
+++ b/app/javascript/listings/components/SelectedTags.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { selectedTagsPropTypes } from '../../src/components/common-prop-types';
+import { selectedTagsPropTypes } from '../../common-prop-types';
 
 const SelectedTags = ({ tags, onClick, onKeyPress }) => {
   return (
diff --git a/app/javascript/organization/OrganizationPicker.jsx b/app/javascript/organization/OrganizationPicker.jsx
index 048f5dfca..a6b6e7d33 100644
--- a/app/javascript/organization/OrganizationPicker.jsx
+++ b/app/javascript/organization/OrganizationPicker.jsx
@@ -1,9 +1,9 @@
 import { h } from 'preact';
 import PropTypes from 'prop-types';
-import { organizationPropType } from '../src/components/common-prop-types';
+import { organizationPropType } from '../common-prop-types';
 
 const orgOptions = (organizations, organizationId) => {
-  const orgs = organizations.map(organization => {
+  const orgs = organizations.map((organization) => {
     if (organizationId === organization.id) {
       return (
         <option value={organization.id} selected>
diff --git a/app/javascript/packs/homePageFeed.jsx b/app/javascript/packs/homePageFeed.jsx
index e0620766c..2e9853e45 100644
--- a/app/javascript/packs/homePageFeed.jsx
+++ b/app/javascript/packs/homePageFeed.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { Article, LoadingArticle } from '../articles';
 import { Feed } from '../articles/Feed';
 import { TodaysPodcasts, PodcastEpisode } from '../podcasts';
-import { articlePropTypes } from '../src/components/common-prop-types';
+import { articlePropTypes } from '../common-prop-types';
 
 /**
  * Sends analytics about the featured article.
diff --git a/app/javascript/podcasts/PodcastEpisode.jsx b/app/javascript/podcasts/PodcastEpisode.jsx
index 31e8592d4..4754770f8 100644
--- a/app/javascript/podcasts/PodcastEpisode.jsx
+++ b/app/javascript/podcasts/PodcastEpisode.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { articlePropTypes } from '../src/components/common-prop-types';
+import { articlePropTypes } from '../common-prop-types';
 
 export const PodcastEpisode = ({ episode }) => {
   return (
diff --git a/app/javascript/podcasts/TodaysPodcasts.jsx b/app/javascript/podcasts/TodaysPodcasts.jsx
index 16ff5e9cc..9081482e0 100644
--- a/app/javascript/podcasts/TodaysPodcasts.jsx
+++ b/app/javascript/podcasts/TodaysPodcasts.jsx
@@ -1,10 +1,12 @@
 import { h } from 'preact';
-import { defaultChildrenPropTypes } from '../src/components/common-prop-types';
+import { defaultChildrenPropTypes } from '../common-prop-types';
 
 export const TodaysPodcasts = ({ children }) => (
   <div className="crayons-story">
-    <div class="crayons-story__body">
-      <h3 class="crayons-story__headline"><a href="/pod">Today&apos;s Podcasts</a></h3>
+    <div className="crayons-story__body">
+      <h3 className="crayons-story__headline">
+        <a href="/pod">Today&apos;s Podcasts</a>
+      </h3>
       {children}
     </div>
   </div>
diff --git a/app/javascript/sidebar-widget/sidebarUser.jsx b/app/javascript/sidebar-widget/sidebarUser.jsx
index 657a74588..b15a2c7c8 100644
--- a/app/javascript/sidebar-widget/sidebarUser.jsx
+++ b/app/javascript/sidebar-widget/sidebarUser.jsx
@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 import PropTypes from 'prop-types';
-import { userPropTypes } from '../src/components/common-prop-types';
+import { userPropTypes } from '../common-prop-types';
 
 class SidebarUser extends Component {
   constructor(props) {
diff --git a/app/javascript/src/components/__stories__/GlobalModalWrapper.jsx b/app/javascript/src/components/__stories__/GlobalModalWrapper.jsx
index 410a335df..b52170ff8 100644
--- a/app/javascript/src/components/__stories__/GlobalModalWrapper.jsx
+++ b/app/javascript/src/components/__stories__/GlobalModalWrapper.jsx
@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { defaultChildrenPropTypes } from '../common-prop-types';
+import { defaultChildrenPropTypes } from '../../../common-prop-types';
 
 const GlobalModalWrapper = ({ children }) => (
   <div className="global-modal">