garrensmith commented on a change in pull request #1292:
URL: https://github.com/apache/couchdb-fauxton/pull/1292#discussion_r482088210



##########
File path: app/addons/news/components.js
##########
@@ -9,17 +9,81 @@
 // WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 // License for the specific language governing permissions and limitations 
under
 // the License.
+import app from "../../app";
 
 import React from "react";
 
-const NewsPage = () => {
+const LoadNewsButton = ({ showNews, isChecked, toggleCookieSave }) => {
   return (
-    <div id="news-page" className="">
-      <iframe src="https://blog.couchdb.org"; width="100%" 
height="100%"></iframe>
+    <div>
+      <p>
+        When you click this button, you are requesting content and sharing 
your IP address with <a href="https://blog.couchdb.org/";>blog.couchdb.org</a> 
which is edited by the Apache CouchDB PMC and maintained by <a 
href="https://wordpress.com/";>wordpress.com</a>.
+      </p>
+      <p>
+        If you don’t want to share your IP address, do not click the button.
+      </p>
+      <button className="btn btn-primary" onClick={showNews}>Load News</button>
+      <label className="news-checkbox">
+        <input type="checkbox"
+          checked={isChecked}
+          onChange={toggleCookieSave}
+        />
+        Remember my choice
+      </label>
     </div>
   );
 };
 
+class NewsPage extends React.Component {
+  constructor (props) {
+    super(props);
+    this.showNews = this.showNews.bind(this);
+    this.toggleCookieSave = this.toggleCookieSave.bind(this);
+
+    const hasCookie = !!app.utils.localStorageGet('allow-IP-sharing');
+
+    this.state = {
+      showNews: hasCookie ? true : false,
+      hasCookie
+    };
+  }
+
+  showNews() {
+    this.setState({ showNews: true });
+  }
+
+  toggleCookieSave() {
+    if (!this.state.hasCookie) {
+      this.setState(() => {
+        return { hasCookie: true };
+      });
+      app.utils.localStorageSet('allow-IP-sharing', true);
+
+    } else {
+      this.setState(() => {
+        return { hasCookie: false };
+      });
+      app.utils.localStorageSet('allow-IP-sharing', false);
+    }
+  }
+
+  render() {
+    return (
+      <div id="news-page" className="">
+        {this.state.showNews ?

Review comment:
       Could you make this an if statement before the jsx code. Something like:
   
   ```
   let news = <LoadButton />;
   
   if (this.state.hasCookie) {
      news = <iframe/>
   }
   ```
   
   ```

##########
File path: app/addons/news/components.js
##########
@@ -9,17 +9,81 @@
 // WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 // License for the specific language governing permissions and limitations 
under
 // the License.
+import app from "../../app";
 
 import React from "react";
 
-const NewsPage = () => {
+const LoadNewsButton = ({ showNews, isChecked, toggleCookieSave }) => {
   return (
-    <div id="news-page" className="">
-      <iframe src="https://blog.couchdb.org"; width="100%" 
height="100%"></iframe>
+    <div>
+      <p>
+        When you click this button, you are requesting content and sharing 
your IP address with <a href="https://blog.couchdb.org/";>blog.couchdb.org</a> 
which is edited by the Apache CouchDB PMC and maintained by <a 
href="https://wordpress.com/";>wordpress.com</a>.
+      </p>
+      <p>
+        If you don’t want to share your IP address, do not click the button.
+      </p>
+      <button className="btn btn-primary" onClick={showNews}>Load News</button>
+      <label className="news-checkbox">
+        <input type="checkbox"
+          checked={isChecked}
+          onChange={toggleCookieSave}
+        />
+        Remember my choice
+      </label>
     </div>
   );
 };
 
+class NewsPage extends React.Component {
+  constructor (props) {
+    super(props);
+    this.showNews = this.showNews.bind(this);
+    this.toggleCookieSave = this.toggleCookieSave.bind(this);
+
+    const hasCookie = !!app.utils.localStorageGet('allow-IP-sharing');
+
+    this.state = {
+      showNews: hasCookie ? true : false,
+      hasCookie
+    };
+  }
+
+  showNews() {
+    this.setState({ showNews: true });
+  }
+
+  toggleCookieSave() {

Review comment:
       I think this function could just be:
   
   ```
            app.utils.localStorageSet('allow-IP-sharing', !this.state.showNews);
           this.setState({showNews: !this.state.showNews});
   ```

##########
File path: app/addons/news/components.js
##########
@@ -9,17 +9,81 @@
 // WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 // License for the specific language governing permissions and limitations 
under
 // the License.
+import app from "../../app";
 
 import React from "react";
 
-const NewsPage = () => {
+const LoadNewsButton = ({ showNews, isChecked, toggleCookieSave }) => {

Review comment:
       Can you rename `toggleCookieSave` to `toggleChange`

##########
File path: app/addons/news/components.js
##########
@@ -9,17 +9,81 @@
 // WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 // License for the specific language governing permissions and limitations 
under
 // the License.
+import app from "../../app";
 
 import React from "react";
 
-const NewsPage = () => {
+const LoadNewsButton = ({ showNews, isChecked, toggleCookieSave }) => {
   return (
-    <div id="news-page" className="">
-      <iframe src="https://blog.couchdb.org"; width="100%" 
height="100%"></iframe>
+    <div>
+      <p>
+        When you click this button, you are requesting content and sharing 
your IP address with <a href="https://blog.couchdb.org/";>blog.couchdb.org</a> 
which is edited by the Apache CouchDB PMC and maintained by <a 
href="https://wordpress.com/";>wordpress.com</a>.
+      </p>
+      <p>
+        If you don’t want to share your IP address, do not click the button.
+      </p>
+      <button className="btn btn-primary" onClick={showNews}>Load News</button>
+      <label className="news-checkbox">
+        <input type="checkbox"
+          checked={isChecked}
+          onChange={toggleCookieSave}
+        />
+        Remember my choice
+      </label>
     </div>
   );
 };
 
+class NewsPage extends React.Component {
+  constructor (props) {
+    super(props);
+    this.showNews = this.showNews.bind(this);
+    this.toggleCookieSave = this.toggleCookieSave.bind(this);
+
+    const hasCookie = !!app.utils.localStorageGet('allow-IP-sharing');

Review comment:
       Could we remove the hasCookie and just have a `showNews`. I can't quite 
see why we would need both?




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[email protected]


Reply via email to