diff --git a/pkg/interface/publish/src/js/components/lib/settings.js b/pkg/interface/publish/src/js/components/lib/settings.js index 55e4a5cac..7ad17994b 100644 --- a/pkg/interface/publish/src/js/components/lib/settings.js +++ b/pkg/interface/publish/src/js/components/lib/settings.js @@ -2,8 +2,66 @@ import React, { Component } from 'react'; export class Settings extends Component { constructor(props){ - super(props) + super(props); + this.state = { + title: "", + description: "", + comments: false, + disabled: false + } this.deleteNotebook = this.deleteNotebook.bind(this); + this.changeTitle = this.changeTitle.bind(this); + this.changeDescription = this.changeDescription.bind(this); + this.changeComments = this.changeComments.bind(this); + } + + componentDidMount() { + const { props } = this; + if (props.notebook) { + this.setState({ + title: props.notebook.title, + description: props.notebook.about, + comments: props.notebook.comments + }) + } + } + + componentDidUpdate(prevProps) { + const { props } = this; + if (prevProps !== this.props) { + if (props.notebook) { + this.setState({ + title: props.notebook.title, + description: props.notebook.about, + comments: props.notebook.comments + }) + } + } + } + + changeTitle(event) { + this.setState({title: event.target.value}); + } + + changeDescription(event) { + this.setState({description: event.target.value}); + } + + changeComments() { + this.setState({comments: !this.state.comments}, (() => { + window.api.setSpinner(true); + window.api.action("publish", "publish-action", { + "edit-book": { + book: this.props.book, + title: this.props.notebook.title, + about: this.props.notebook.about, + coms: this.state.comments, + group: null + } + }).then(() => { + window.api.setSpinner(false); + }) + })); } deleteNotebook(){ @@ -12,27 +70,145 @@ export class Settings extends Component { book: this.props.book } } - window.api.action("publish", "publish-action", action); - this.props.history.push('/~publish'); + window.api.setSpinner(true); + window.api.action("publish", "publish-action", action).then(() => { + window.api.setSpinner(false); + this.props.history.push("/~publish"); + }); } render() { + let commentsSwitchClasses = (this.state.comments) + ? "relative checked bg-green2 br3 h1 toggle v-mid z-0" + : "relative bg-gray4 bg-gray1-d br3 h1 toggle v-mid z-0"; + + let copyShortcode =
+

Share

+

Share a shortcode to join this notebook

+
+ + { + navigator.clipboard.writeText(`${this.props.host}/${this.props.book}`); + this.refs.copy.innerText = "Copied" + }}> + Copy + +
+
+ if (this.props.host.slice(1) === window.ship) { return (
-

Delete Notebook

+ {copyShortcode} +

Delete Notebook

- Permanently delete this notebook. (All current members will no longer see this notebook) + Permanently delete this notebook. (All current members will no + longer see this notebook)

- +

Rename

+

Change the name of this notebook

+
+ + { + this.setState({disabled: true}); + window.api.setSpinner(true); + window.api + .action("publish", "publish-action", { + "edit-book": { + book: this.props.book, + title: this.state.title, + about: this.props.notebook.about, + coms: this.props.notebook.comments, + group: null + } + }) + .then(() => { + this.setState({disabled: false}) + this.refs.rename.innerText = "Saved"; + window.api.setSpinner(false); + }); + }}> + Save + +
+

Change description

+

Change the description of this notebook

+
+ + { + this.setState({ disabled: true }); + window.api.setSpinner(true); + window.api + .action("publish", "publish-action", { + "edit-book": { + book: this.props.book, + title: this.props.notebook.title, + about: this.state.description, + coms: this.props.notebook.comments, + group: null + } + }) + .then(() => { + this.setState({ disabled: false }); + this.refs.description.innerText = "Saved"; + window.api.setSpinner(false); + }); + }}> + Save + +
+
+ + Comments +

+ Subscribers may comment when enabled +

+
- - ) + ); } else { - return null; + return copyShortcode; } } } diff --git a/pkg/interface/publish/src/js/reducers/primary.js b/pkg/interface/publish/src/js/reducers/primary.js index 3dcaa80cf..6a05f6dc0 100644 --- a/pkg/interface/publish/src/js/reducers/primary.js +++ b/pkg/interface/publish/src/js/reducers/primary.js @@ -109,6 +109,7 @@ export class PrimaryReducer { let host = Object.keys(json)[0]; let book = Object.keys(json[host])[0]; if (state.notebooks[host] && state.notebooks[host][book]) { + state.notebooks[host][book]["comments"] = json[host][book]["comments"]; state.notebooks[host][book]["date-created"] = json[host][book]["date-created"]; state.notebooks[host][book]["num-notes"] = json[host][book]["num-notes"]; state.notebooks[host][book]["num-unread"] = json[host][book]["num-unread"];