various: post-review adjustments for #2583

This commit introduces some refactoring of localStorage logic, copy
changes and a rearrangement of the launch welcome message to the top
of the screen.

pkg/interface/chat/src/js/components/lib/welcome.js

@@ -7,7 +7,14 @@ export class Welcome extends Component {
     this.state = {
       show: true
     }
+    this.disableWelcome = this.disableWelcome.bind(this);
   }
+
+  disableWelcome() {
+    this.setState({ show: false });
+    localStorage.setItem("urbit-chat:wasWelcomed", JSON.stringify(true));
+  }
+
   render() {
     let wasWelcomed = localStorage.getItem("urbit-chat:wasWelcomed");
     if (wasWelcomed === null) {
@@ -21,14 +28,11 @@ export class Welcome extends Component {
 
     return ((!wasWelcomed && this.state.show) && (inbox.length !== 0)) ? (
       <div className="ma4 pa2 ba bg-gray5 b--gray4 bg-gray0-d b--gray1-d white-d">
-      <p className="f9 lh-copy">Chats are basic, instant, linear modes of conversation. Many chats can be bundled under one group.</p>
-      <p className="f9 pt2 dib fw6 pointer"
-      onClick={(() => {
-        localStorage.setItem("urbit-chat:wasWelcomed", JSON.stringify(true));
-        this.setState({show: false})
-      })}>
-        Close this message
-      </p>
+        <p className="f9 lh-copy">Chats are instant, linear modes of conversation. Many chats can be bundled under one group.</p>
+        <p className="f9 pt2 dib fw6 pointer"
+          onClick={(() => this.disableWelcome())}>
+          Close this message
+        </p>
       </div>
     ) : <div/>
   }

pkg/interface/groups/src/js/components/lib/welcome.js

@@ -7,7 +7,14 @@ export class Welcome extends Component {
     this.state = {
       show: true
     }
+    this.disableWelcome = this.disableWelcome.bind(this);
   }
+
+  disableWelcome() {
+    this.setState({ show: false });
+    localStorage.setItem("urbit-groups:wasWelcomed", JSON.stringify(true));
+  }
+
   render() {
     let wasWelcomed = localStorage.getItem("urbit-groups:wasWelcomed");
     if (wasWelcomed === null) {
@@ -21,12 +28,9 @@ export class Welcome extends Component {
 
     return ((!wasWelcomed && this.state.show) && (contacts.length !== 0)) ? (
       <div className="ma4 pa2 ba bg-gray5 b--gray4 bg-gray0-d b--gray2-d white-d">
-        <p className="f9 lh-copy">Groups are private spaces you inhabit with other ships. Modules can be shared with members of a group.</p>
+        <p className="f9 lh-copy">Each Group is a list of other Urbit IDs that share some set of modules: chats, links and notebooks.</p>
         <p className="f9 pt2 dib fw6 pointer"
-          onClick={(() => {
-            localStorage.setItem("urbit-groups:wasWelcomed", JSON.stringify(true));
-            this.setState({ show: false })
-          })}>
+          onClick={(() => this.disableWelcome())}>
           Close this message
       </p>
       </div>

pkg/interface/launch/src/js/components/home.js

@@ -41,8 +41,8 @@ export default class Home extends Component {
         <div className={"v-mid pa2 dtc-m dtc-l dtc-xl " +
         "flex justify-between flex-wrap"}
         style={{maxWidth: "40rem"}}>
+          <Welcome />
           {tileElems}
-          <Welcome/>
         </div>
       </div>
     );

pkg/interface/launch/src/js/components/welcome.js

@@ -6,6 +6,12 @@ export class Welcome extends Component {
     this.state = {
       show: true
     }
+    this.disableWelcome = this.disableWelcome.bind(this);
+  }
+
+  disableWelcome() {
+    window.api.action("launch", "json", "disable welcome message");
+    this.setState({ show: false });
   }
 
   render() {
@@ -13,16 +19,18 @@ export class Welcome extends Component {
     return (firstTime && this.state.show)
     ? (
       <div className={"fl ma2 bg-white bg-gray0-d white-d overflow-hidden " +
-      "ba b--black b--gray1-d pa2 w-100 mw6 lh-copy"}>
-      <p className="f9">You've just come into possession of a virtual computer you own completely. You can run it on a laptop, you can run it on a server, but it doesn't really matter.</p>
-      <p className="f9 pt2">With the key you used to access this space, you can never lose this computer. You can never lose what's on this computer.</p>
-      <p className="f9 pt2">To begin, you should probably pop into a chat and verify there are signs of life in this new place. If you were invited by a friend, you probably already have access to a few.</p>
-      <p className="f9 pt2">If you don't, feel free to <a className="no-underline bb b--black b--gray1-d" href="/~chat/join/~/~dopzod/urbit-help">join our lobby.</a></p>
-      <p className="dib f9 pt2 bb b--black b--gray1-d pointer"
-      onClick={(() => {
-        window.api.action("launch", "json", "disable welcome message");
-        this.setState({show: false});
-      })}>Close this note</p>
+      "ba b--black b--gray1-d pa2 w-100 lh-copy"}>
+        <p className="f9">Welcome. This virtual computer belongs to you completely. The Urbit ID you used to boot it is yours as well.</p>
+        <p className="f9 pt2">Since your ID and OS belong to you, it’s up to you to keep them safe. Be sure your ID is somewhere you won’t lose it and you keep your OS on a machine you trust.</p>
+        <p className="f9 pt2">Urbit OS is designed to keep your data secure and hard to lose. But the system is still young — so don’t put anything critical in here just yet.</p>
+        <p className="f9 pt2">To begin exploring, you should probably pop into a chat and verify there are signs of life in this new place. If you were invited by a friend, you probably already have access to a few groups.</p>
+        <p className="f9 pt2">If you don't know where to go, feel free to <a className="no-underline bb b--black b--gray1-d dib" href="/~chat/join/~/~dopzod/urbit-help">join our lobby.</a>
+        </p>
+        <p className="f9 pt2">Have fun!</p>
+        <p className="dib f9 pt2 bb b--black b--gray1-d pointer"
+          onClick={(() => {this.disableWelcome()})}>
+          Close this note
+        </p>
       </div>
     )
     : ( <div/>)

pkg/interface/link/src/js/components/lib/welcome.js

@@ -7,7 +7,14 @@ export class Welcome extends Component {
     this.state = {
       show: true
     }
+    this.disableWelcome = this.disableWelcome.bind(this);
   }
+
+  disableWelcome() {
+    this.setState({ show: false });
+    localStorage.setItem("urbit-link:wasWelcomed", JSON.stringify(true));
+  }
+
   render() {
     let wasWelcomed = localStorage.getItem("urbit-link:wasWelcomed");
     if (wasWelcomed === null) {
@@ -21,12 +28,9 @@ export class Welcome extends Component {
 
     return ((!wasWelcomed && this.state.show) && (associations.length !== 0)) ? (
       <div className="ma4 pa2 ba bg-gray5 b--gray4 bg-gray0-d b--gray1-d white-d">
-        <p className="f9 lh-copy">For now, collections only hold links. In the future, they'll be able to organize and display rich varieties of content.</p>
+        <p className="f9 lh-copy">Links are for collecting and discussing outside content. Each post is a URL and a comment thread.</p>
         <p className="f9 pt2 dib fw6 pointer"
-          onClick={(() => {
-            localStorage.setItem("urbit-link:wasWelcomed", JSON.stringify(true));
-            this.setState({ show: false })
-          })}>
+          onClick={(() => this.disableWelcome())}>
           Close this message
       </p>
       </div>

pkg/interface/publish/src/js/components/lib/welcome.js

@@ -7,7 +7,14 @@ export class Welcome extends Component {
     this.state = {
       show: true
     }
+    this.disableWelcome = this.disableWelcome.bind(this);
   }
+
+  disableWelcome() {
+    this.setState({ show: false });
+    localStorage.setItem("urbit-publish:wasWelcomed", JSON.stringify(true));
+  }
+
   render() {
     let wasWelcomed = localStorage.getItem("urbit-publish:wasWelcomed");
     if (wasWelcomed === null) {
@@ -21,12 +28,9 @@ export class Welcome extends Component {
 
     return ((!wasWelcomed && this.state.show) && (notebooks.length !== 0)) ? (
       <div className="ma4 pa2 ba bg-gray5 b--gray4 bg-gray0-d b--gray2-d white-d">
-        <p className="f9 lh-copy">Notebooks are best used for longer-form writing and text editing. Notes accept Markdown for formatting.</p>
+        <p className="f9 lh-copy">Notebooks are for longer-form writing and discussion. Each Notebook is a collection of Markdown-formatted notes with optional comments.</p>
         <p className="f9 pt2 dib fw6 pointer"
-          onClick={(() => {
-            localStorage.setItem("urbit-publish:wasWelcomed", JSON.stringify(true));
-            this.setState({ show: false })
-          })}>
+          onClick={(() => this.disableWelcome())}>
           Close this message
       </p>
       </div>