chat-js + view: updated new page to work properly with group creation / selection

pkg/arvo/app/chat-view.hoon

@@ -264,6 +264,9 @@
   ++  create-metadata
     |=  [group-path=path app-path=path]
     ^-  (list card)
+    ~&  group-path+group-path
+    ~&  app-path+app-path
+    ~&  is-managed+(is-managed app-path)
     =/  =metadata
       %*  .  *metadata
           date-created  now.bol
@@ -346,7 +349,7 @@
     |=  =path
     ^-  ?
     ?>  ?=(^ path)
-    !=(path '~')
+    !=(i.path '~')
   --
 ::
 ++  diff-chat-update

pkg/interface/chat/src/js/api.js

@@ -128,23 +128,27 @@ class UrbitApi {
     return this.action("chat-view", "json", data);
   }
 
-  chatViewCreate(path, security, members, allowHistory) {
+  chatViewCreate(appPath, groupPath, security, members, allowHistory) {
    return this.chatViewAction({
       create: {
-        path, security, members,
+        'app-path': appPath,
+        'group-path': groupPath,
+        security,
+        members,
         'allow-history': allowHistory
       }
     });
   }
 
   chatViewDelete(path) {
-    this.chatViewAction({ delete: { path } });
+    this.chatViewAction({ delete: { 'app-path': path } });
   }
 
   chatViewJoin(ship, path, askHistory) {
     this.chatViewAction({
       join: {
-        ship, path,
+        ship, 
+        'app-path': path,
         'ask-history': askHistory
       }
     });

pkg/interface/chat/src/js/components/new.js

@@ -20,7 +20,6 @@ export class NewScreen extends Component {
       createGroup: true
     };
 
-    this.idName = React.createRef();
     this.idChange = this.idChange.bind(this);
     this.securityChange = this.securityChange.bind(this);
     this.allowHistoryChange = this.allowHistoryChange.bind(this);
@@ -46,20 +45,10 @@ export class NewScreen extends Component {
   }
 
   setInvite(value) {
-    if (value.groups.length > 0) {
+    this.setState({
-      let idName = value.groups[0].split('/')[2];
+      groups: value.groups,
-      this.idName.current.value = idName;
+      ships: value.ships
-      this.setState({
+    });
-        idName,
-        groups: value.groups,
-        ships: value.ships
-      });
-    } else {
-      this.setState({
-        groups: value.groups,
-        ships: value.ships
-      });
-    }
   }
 
   securityChange(event) {
@@ -149,17 +138,25 @@ export class NewScreen extends Component {
       // if we want a "proper group" that can be managed from the contacts UI,
       // we make a path of the form /~zod/cool-group
       // if not, we make a path of the form /~/~zod/free-chat
-      let chatPath = `/~${window.ship}${station}`;
+      let appPath = `/~${window.ship}${station}`;
       if (!state.createGroup && state.groups.length === 0) {
-        chatPath = `/~${chatPath}`;
+        appPath = `/~${appPath}`;
+      }
+      let groupPath = appPath;
+      if (state.groups.length > 0) {
+        groupPath = state.groups[0];
       }
       let submit = props.api.chatView.create(
-          chatPath, state.security, aud, state.allowHistory
+        appPath,
-        );
+        groupPath,
-        submit.then(() => {
+        state.security,
-          props.api.setSpinner(false);
+        aud,
-          props.history.push(`/~chat/room${chatPath}`);
+        state.allowHistory
-        })
+      );
+      submit.then(() => {
+        props.api.setSpinner(false);
+        props.history.push(`/~chat/room${appPath}`);
+      })
     });
   }
 
@@ -183,9 +180,6 @@ export class NewScreen extends Component {
     let idClasses =
       "f7 ba b--gray3 b--gray2-d bg-gray0-d white-d pa3 db w-100 " +
       "focus-b--black focus-b--white-d ";
-    if (state.groups.length > 0) {
-      idClasses = idClasses + " o-40";
-    }
 
     let idErrElem = (<span />);
     if (state.idError) {
@@ -237,8 +231,6 @@ export class NewScreen extends Component {
               resize: "none"
             }}
             onChange={this.idChange}
-            ref={this.idName}
-            disabled={(state.groups.length > 0) ? "disabled" : false}
           />
           {idErrElem}
           <p className="f8 mt4 lh-copy db">

pkg/interface/chat/src/js/subscription.js

@@ -34,6 +34,10 @@ export class Subscription {
       this.handleEvent.bind(this),
       this.handleError.bind(this),
       this.handleQuitAndResubscribe.bind(this));
+    api.bind('/app-name/chat', 'PUT', api.authTokens.ship, 'metadata-store',
+      this.handleEvent.bind(this),
+      this.handleError.bind(this),
+      this.handleQuitAndResubscribe.bind(this));
   }
 
   handleEvent(diff) {