From ade7d2be8ef95147d403b7b9ae2739b845aaeef8 Mon Sep 17 00:00:00 2001
From: Linda Paiste <lindapaiste@gmail.com>
Date: Wed, 26 Jul 2023 12:45:18 -0500
Subject: [PATCH] Connect `ShareModal` to Redux.

---
 client/modules/IDE/components/ShareModal.jsx | 18 ++++++++++--------
 client/modules/IDE/pages/IDEView.jsx         |  9 +--------
 2 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/client/modules/IDE/components/ShareModal.jsx b/client/modules/IDE/components/ShareModal.jsx
index ff7b80b7a3..ec7f61fbe8 100644
--- a/client/modules/IDE/components/ShareModal.jsx
+++ b/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;
diff --git a/client/modules/IDE/pages/IDEView.jsx b/client/modules/IDE/pages/IDEView.jsx
index 685dc3fd5b..1034835082 100644
--- a/client/modules/IDE/pages/IDEView.jsx
+++ b/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,