groups: add startup content

pkg/interface/groups/src/js/components/lib/group-sidebar.js

@@ -4,6 +4,7 @@ import { Route, Link } from 'react-router-dom';
 import { GroupItem } from '/components/lib/group-item';
 import { Sigil } from '/components/lib/icons/sigil';
 import { SidebarInvite } from '/components/lib/sidebar-invite';
+import { Welcome } from '/components/lib/welcome';
 import { cite } from '/lib/util';
 
 export class GroupSidebar extends Component {
@@ -93,6 +94,7 @@ export class GroupSidebar extends Component {
           <Link to="/~groups/new" className="dib">
             <p className="f9 pt4 pl4 green2 bn">Create Group</p>
           </Link>
+          <Welcome contacts={props.contacts}/>
           <h2 className="f9 pt4 pr4 pb2 pl4 gray2 c-default">Your Identity</h2>
           {rootIdentity}
           {inviteItems}

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

@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+
+
+export class Welcome extends Component {
+  constructor() {
+    super();
+    this.state = {
+      show: true
+    }
+  }
+  render() {
+    let wasWelcomed = localStorage.getItem("urbit-groups:wasWelcomed");
+    if (wasWelcomed === null) {
+      localStorage.setItem("urbit-groups:wasWelcomed", JSON.stringify(false));
+      return wasWelcomed = false;
+    } else {
+      wasWelcomed = JSON.parse(wasWelcomed);
+    }
+
+    let contacts = !!this.props.contacts ? this.props.contacts : {};
+
+    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 pt2 dib fw6 pointer"
+          onClick={(() => {
+            localStorage.setItem("urbit-groups:wasWelcomed", JSON.stringify(true));
+            this.setState({ show: false })
+          })}>
+          Close this message
+      </p>
+      </div>
+    ) : <div />
+  }
+}
+
+export default Welcome