diff --git a/src/components/deleteGrid.jsx b/src/components/deleteGrid.jsx
index 35fcc719..bac41835 100644
--- a/src/components/deleteGrid.jsx
+++ b/src/components/deleteGrid.jsx
@@ -27,12 +27,22 @@ export default class DeleteGrid extends React.Component {
   }
 
   render() {
-    return(
-      <button className="btn btn-outline-danger btn-sm"
+    if(this.props.enabled == "enabled"){
+      return(
+        <button className="btn btn-danger btn-sm"
+                onClick={ this.handleClick }>
+          Delete Grid
+        </button>
+      );
+    }
+    else{
+      return(
+      <button className="btn btn-danger btn-sm" disabled={this.props.enabled}
               onClick={ this.handleClick }>
         Delete Grid
       </button>
     );
+    }
   }
 }
 
diff --git a/src/components/matrixSize.jsx b/src/components/matrixSize.jsx
index 25767e5d..264199b2 100644
--- a/src/components/matrixSize.jsx
+++ b/src/components/matrixSize.jsx
@@ -58,25 +58,50 @@ export default class MatrixSize extends React.Component {
   }
 
   render() {
-    return (
-    <div className="col-sm-10">
-      <div className="input-group input-group-sm">
-        <input
-            className="form-control" type="text"
-            placeholder="Enter new Row"
-            defaultValue={ this.state.numCols }
-            onChange={ this.onUpdateRow }
-        />
-        <input
-            className="form-control" type="text"
-            placeholder="Enter New Column"
-            defaultValue={ this.state.numCols }
-            onChange={ this.onUpdateCol }
-        />
+    if(this.props.gridId == "null"){
+      return (
+      <div className="col-sm-10">
+        <div className="input-group input-group-sm">
+          <input
+              className="form-control" type="text"
+              placeholder="Enter new Row"
+              defaultValue={ this.state.numCols }
+              onChange={ this.onUpdateRow }
+              disabled="disabled"
+          />
+          <input
+              className="form-control" type="text"
+              placeholder="Enter New Column"
+              defaultValue={ this.state.numCols }
+              onChange={ this.onUpdateCol }
+              disabled="disabled"
+          />
+        </div>
+        <button className="btn btn-primary btn-sm" disabled="disabled" onClick={ this.handleClick }>Update Grid</button>
       </div>
-      <button className="btn btn-primary btn-sm" onClick={ this.handleClick }>Update Grid</button>
-    </div>
-    );
+      );
+    }
+    else{
+      return (
+      <div className="col-sm-10">
+        <div className="input-group input-group-sm">
+          <input
+              className="form-control" type="text"
+              placeholder="Enter new Row"
+              defaultValue={ this.state.numCols }
+              onChange={ this.onUpdateRow }
+          />
+          <input
+              className="form-control" type="text"
+              placeholder="Enter New Column"
+              defaultValue={ this.state.numCols }
+              onChange={ this.onUpdateCol }
+          />
+        </div>
+        <button className="btn btn-primary btn-sm" onClick={ this.handleClick }>Update Grid</button>
+      </div>
+      );
+    }
   }
 }
 
diff --git a/src/components/randomize.jsx b/src/components/randomize.jsx
index d2f8a274..c65eb650 100644
--- a/src/components/randomize.jsx
+++ b/src/components/randomize.jsx
@@ -44,8 +44,15 @@ export default class Randomize extends React.Component {
   }
 
   render() {
-    return (
-      <button className="button" className="btn btn-outline-danger btn-sm" onClick={this.handleClick}>Randomize Colors</button>      
-    )
+    if(this.props.enabled == "enabled"){
+      return (
+        <button className="btn btn-danger btn-sm" onClick={this.handleClick}>Randomize Colors</button>
+      )
+    }
+    else{
+      return (
+        <button className="btn btn-danger btn-sm disabled" disabled={ this.props.enabled } onClick={this.handleClick}>Randomize Colors</button>
+      )
+    }
   }
 }
diff --git a/src/components/resetGridColor.jsx b/src/components/resetGridColor.jsx
index ad268c20..93cd20f6 100644
--- a/src/components/resetGridColor.jsx
+++ b/src/components/resetGridColor.jsx
@@ -22,8 +22,15 @@ export default class ResetGridColor extends React.Component {
  }
 
   render(){
-    return(
-      <button className={ "btn btn-outline-danger btn-sm " + styles.button } onClick={ this.handleClick }>Reset</button>
-    )
+    if(this.props.enabled == "enabled"){
+      return(
+        <button className={ "btn btn-danger btn-sm " + styles.button } onClick={ this.handleClick }>Reset</button>
+      )
+    }
+    else{
+      return(
+        <button className={ "btn btn-danger btn-sm " + styles.button } disabled={this.props.enabled} onClick={ this.handleClick }>Reset</button>
+      )
+    }
   }
 }
diff --git a/src/components/shareComponent.jsx b/src/components/shareComponent.jsx
index 9d5c002a..7e896edd 100644
--- a/src/components/shareComponent.jsx
+++ b/src/components/shareComponent.jsx
@@ -123,26 +123,36 @@ export default class ShareComponent extends React.Component {
   }
 
   render(){
-    return (
-      <div>
-        <button className="btn btn-primary btn-sm" onClick={ this.open }>Share Grid</button>
-
-        <Modal show={ this.state.showModal } onHide={ this.close }>
-          <Modal.Header closeButton>
-            <Modal.Title>Share this grid with other users</Modal.Title>
-          </Modal.Header>
-          <Modal.Body>
-            <input type="text" className="form-control" placeholder="Enter an email address" onChange={ this.onUpdate }/>
-            <p className={ styles.sharedWith }> { this.state.shareMessage }
-              <span className={ styles.userList }> { this.state.currentUsers.join(', ') }</span>
-            </p>
-          </Modal.Body>
-          <Modal.Footer>
-              <button className={ "btn btn-default " + styles.modalButton } onClick={ this.close }>Close</button>
-              <button className={ "btn btn-primary " + styles.modalButton } onClick={ this.handleShare }>Share</button>
-          </Modal.Footer>
-        </Modal>
-      </div>
-    );
+    if(this.props.enabled == "enabled"){
+      return (
+        <div>
+          <button className="btn btn-primary btn-sm" onClick={ this.open }>Share Grid</button>
+
+          <Modal show={ this.state.showModal } onHide={ this.close }>
+            <Modal.Header closeButton>
+              <Modal.Title>Share this grid with other users</Modal.Title>
+            </Modal.Header>
+            <Modal.Body>
+              <input type="text" className="form-control" placeholder="Enter an email address" onChange={ this.onUpdate }/>
+              <p className={ styles.sharedWith }> { this.state.shareMessage }
+                <span className={ styles.userList }> { this.state.currentUsers.join(', ') }</span>
+              </p>
+            </Modal.Body>
+            <Modal.Footer>
+                <button className={ "btn btn-default " + styles.modalButton } onClick={ this.close }>Close</button>
+                <button className={ "btn btn-primary " + styles.modalButton } onClick={ this.handleShare }>Share</button>
+            </Modal.Footer>
+          </Modal>
+        </div>
+      );
+    }
+    else{
+
+      return (
+        <div>
+          <button className="btn btn-primary btn-sm" disabled={this.props.enabled}>Share Grid</button>
+        </div>
+      );
+    }
   }
 }
diff --git a/src/components/sidebar.jsx b/src/components/sidebar.jsx
index cc74605a..4d080a90 100644
--- a/src/components/sidebar.jsx
+++ b/src/components/sidebar.jsx
@@ -10,6 +10,27 @@ import styles from '../main.scss';
 import 'bootstrap/dist/css/bootstrap.min.css';
 
 export default class SideBar extends React.Component {
+  constructor() {
+    super();
+    this.state = {enabled: "disabled" }
+  }
+
+  componentDidMount(){
+    if(this.props.gridId == "null"){
+      this.setState({enabled: "disabled"});
+    }
+    else{
+      this.setState({enabled: "enabled"})
+    }
+  }
+  componentWillReceiveProps(nextProps) {
+    if (nextProps.gridId == "null") {
+      this.setState({enabled: "disabled"});
+    }
+    else{
+      this.setState({enabled: "enabled"})
+    }
+  }
   render(){
     return(
       <div className={ styles.sidebarNav }>
@@ -19,7 +40,7 @@ export default class SideBar extends React.Component {
             <span className={ styles.sidebarHeader }>Grid Options</span>
           </div>
           <div className={ "row " + styles.optionSection }>
-            <MatrixSize gridId={ this.props.gridId } 
+            <MatrixSize gridId={ this.props.gridId }
                         updateGrid={ this.props.changeGrid }
             />
           </div> {/* row */}
@@ -32,24 +53,27 @@ export default class SideBar extends React.Component {
                 <Randomize gridId={this.props.gridId}
                            numCols={this.props.numCols}
                            numRows={this.props.numRows}
+                           enabled={this.state.enabled}
                 />
                 <ResetGridColor gridId={ this.props.gridId }
                                 numCols={ this.props.numCols }
                                 numRows={ this.props.numRows }
+                                enabled={ this.state.enabled }
                 />
-                <DeleteGrid gridId={ this.props.gridId } 
+                <DeleteGrid gridId={ this.props.gridId }
                             gridRemoval={ this.props.changeGrid }
+                            enabled={ this.state.enabled }
                 />
             </div>
           </div> {/* row .dangerZone */}
 
           <div className={ "row " + styles.options }>
-            <span className={ styles.sidebarHeader }>Sharing</span>
+            <span className={ styles.sidebarHeader } >Sharing</span>
           </div>
           <div className={ "row " + styles.optionSection }>
             <div className="col-sm-10">
-              <ShareComponent gridId={ this.props.gridId }/>
-            </div>  
+              <ShareComponent enabled={ this.state.enabled } gridId={ this.props.gridId }/>
+            </div>
           </div> {/* row */}
 
         </div> {/* .sidebarContent */}
@@ -58,4 +82,4 @@ export default class SideBar extends React.Component {
   }
 }
 
-{/* Source: https://github.com/BlackrockDigital/startbootstrap-simple-sidebar */}
\ No newline at end of file
+{/* Source: https://github.com/BlackrockDigital/startbootstrap-simple-sidebar */}