Connect ShareModal to Redux.

Author: lindapaiste

client/modules/IDE/components/ShareModal.jsx

@@ -1,11 +1,19 @@
-import PropTypes from 'prop-types';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
+import { useSelector } from 'react-redux';
 import CopyableInput from './CopyableInput';
 // import getConfig from '../../../utils/getConfig';
 
-const ShareModal = ({ projectId, ownerUsername, projectName }) => {
+const ShareModal = () => {
   const { t } = useTranslation();
+
+  // TODO: store these as nested properties instead of top-level
+  const projectId = useSelector((state) => state.ide.shareModalProjectId);
+  const projectName = useSelector((state) => state.ide.shareModalProjectName);
+  const ownerUsername = useSelector(
+    (state) => state.ide.shareModalProjectUsername
+  );
+
   const hostname = window.location.origin;
   // const previewUrl = getConfig('PREVIEW_URL');
   return (
@@ -35,10 +43,4 @@ const ShareModal = ({ projectId, ownerUsername, projectName }) => {
   );
 };
 
-ShareModal.propTypes = {
-  projectId: PropTypes.string.isRequired,
-  ownerUsername: PropTypes.string.isRequired,
-  projectName: PropTypes.string.isRequired
-};
-
 export default ShareModal;

client/modules/IDE/pages/IDEView.jsx

@@ -406,11 +406,7 @@ class IDEView extends React.Component {
             ariaLabel={this.props.t('IDEView.ShareARIA')}
             closeOverlay={this.props.closeShareModal}
           >
-            <ShareModal
-              projectId={this.props.ide.shareModalProjectId}
-              projectName={this.props.ide.shareModalProjectName}
-              ownerUsername={this.props.ide.shareModalProjectUsername}
-            />
+            <ShareModal />
           </Overlay>
         )}
         {this.props.ide.keyboardShortcutVisible && (
@@ -459,9 +455,6 @@ IDEView.propTypes = {
     errorType: PropTypes.string,
     keyboardShortcutVisible: PropTypes.bool.isRequired,
     shareModalVisible: PropTypes.bool.isRequired,
-    shareModalProjectId: PropTypes.string.isRequired,
-    shareModalProjectName: PropTypes.string.isRequired,
-    shareModalProjectUsername: PropTypes.string.isRequired,
     previousPath: PropTypes.string.isRequired,
     previewIsRefreshing: PropTypes.bool.isRequired,
     isPlaying: PropTypes.bool.isRequired,