From 0f84d7739aeabd2d3bfe3397eac250935e39fee5 Mon Sep 17 00:00:00 2001
From: Ray Schamp <ray@scratch.mit.edu>
Date: Thu, 12 Apr 2018 18:17:31 -0400
Subject: [PATCH] Rename SaveButton to ProjectSaver and add docs

---
 src/components/menu-bar/menu-bar.jsx          |  6 +++---
 .../{save-button.jsx => project-saver.jsx}    | 20 ++++++++++++++++---
 2 files changed, 20 insertions(+), 6 deletions(-)
 rename src/containers/{save-button.jsx => project-saver.jsx} (73%)

diff --git a/src/components/menu-bar/menu-bar.jsx b/src/components/menu-bar/menu-bar.jsx
index 82cd319f5..f84f432f8 100644
--- a/src/components/menu-bar/menu-bar.jsx
+++ b/src/components/menu-bar/menu-bar.jsx
@@ -11,7 +11,7 @@ import LanguageSelector from '../../containers/language-selector.jsx';
 import LoadButton from '../../containers/load-button.jsx';
 import Menu from '../../containers/menu.jsx';
 import {MenuItem, MenuSection} from '../menu/menu.jsx';
-import SaveButton from '../../containers/save-button.jsx';
+import ProjectSaver from '../../containers/project-saver.jsx';
 
 import {openFeedbackForm} from '../../reducers/modals';
 import {
@@ -147,14 +147,14 @@ const MenuBar = props => (
                                     {renderFileInput()}
                                 </MenuItem>
                             )}</LoadButton>
-                            <SaveButton>{(saveProject, saveProps) => (
+                            <ProjectSaver>{(saveProject, saveProps) => (
                                 <MenuItem
                                     onClick={saveProject}
                                     {...saveProps}
                                 >
                                     Download to your computer
                                 </MenuItem>
-                            )}</SaveButton>
+                            )}</ProjectSaver>
                         </MenuSection>
                     </MenuBarMenu>
                 </div>
diff --git a/src/containers/save-button.jsx b/src/containers/project-saver.jsx
similarity index 73%
rename from src/containers/save-button.jsx
rename to src/containers/project-saver.jsx
index cb840ac33..4886ee639 100644
--- a/src/containers/save-button.jsx
+++ b/src/containers/project-saver.jsx
@@ -3,7 +3,21 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import {connect} from 'react-redux';
 
-class SaveButton extends React.Component {
+/**
+ * Project saver component passes a saveProject function to its child.
+ * It expects this child to be a function with the signature
+ *     function (saveProject, props) {}
+ * The component can then be used to attach project saving functionality
+ * to any other component:
+ *
+ * <ProjectSaver>{(saveProject, props) => (
+ *     <MyCoolComponent
+ *         onClick={saveProject}
+ *         {...props}
+ *     />
+ * )}</ProjectSaver>
+ */
+class ProjectSaver extends React.Component {
     constructor (props) {
         super(props);
         bindAll(this, [
@@ -41,7 +55,7 @@ class SaveButton extends React.Component {
     }
 }
 
-SaveButton.propTypes = {
+ProjectSaver.propTypes = {
     children: PropTypes.func,
     vm: PropTypes.shape({
         saveProjectSb3: PropTypes.func
@@ -55,4 +69,4 @@ const mapStateToProps = state => ({
 export default connect(
     mapStateToProps,
     () => ({}) // omit dispatch prop
-)(SaveButton);
+)(ProjectSaver);