chat-js: fix ui regression for new and join (always create /~/ groups)

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

@@ -18,20 +18,29 @@ export class JoinScreen extends Component {
   }
 
   componentDidMount() {
-    if (this.props.autoJoin !== "undefined/undefined") {
-      let station = this.props.autoJoin.split('/');
-      let ship = station[0];
-      station.splice(0, 1);
-      station = '/' + station.join('/');
+    const { props } = this;
+    if (props.autoJoin !== "/undefined/undefined" &&
+        props.autoJoin !== "/~/undefined/undefined") {
+      let station = props.autoJoin.split('/');
+      let sig = props.autoJoin.includes("/~/");
 
-      if (station.length < 2 || !urbitOb.isValidPatp(ship)) {
+      let ship = !!sig ? station[2] : station[1];
+      station = station.join('/');
+      if (
+        station.length < 2 ||
+        (!!sig && station.length < 3) ||
+        !urbitOb.isValidPatp(ship)
+      ) {
         this.setState({
           error: true,
         });
         return;
       }
-      this.props.api.chatView.join(ship, station, true);
-      this.props.history.push('/~chat');
+      this.setState({
+        station
+      }, () => {
+        props.api.chatView.join(ship, station, true);
+      });
     }
   }
 
@@ -55,20 +64,23 @@ export class JoinScreen extends Component {
     }
 
     let station = text.split('/');
-    let ship = station[0];
-    station.splice(0, 1);
-    station = '/' + station.join('/');
+    let sig = state.station.includes("/~/");
+    let ship = !!sig ? station[2] : station[1];
 
-    if (station.length < 2 || !urbitOb.isValidPatp(ship)) {
+    station = station.join('/');
+
+    if (
+      station.length < 2 ||
+      (!!sig && station.length < 3) ||
+      !urbitOb.isValidPatp(ship)
+    ) {
       this.setState({
         error: true,
       });
       return;
     }
 
-    // TODO: askHistory setting
     props.api.chatView.join(ship, station, true);
-    this.props.history.push('/~chat');
   }
 
   stationChange(event) {
@@ -78,15 +90,15 @@ export class JoinScreen extends Component {
   }
 
   render() {
-    const { props } = this;
+    const { props, state } = this;
 
     let joinClasses = "db f9 green2 ba pa2 b--green2 bg-gray0-d pointer";
-    if ((!this.state.station) || (this.state.station === "/")) {
+    if ((!state.station) || (state.station === "/")) {
       joinClasses = 'db f9 gray2 ba pa2 b--gray3 bg-gray0-d pointer';
     }
 
     let errElem = (<span />);
-    if (this.state.error) {
+    if (state.error) {
       errElem = (
         <span className="f9 inter red2 db">
           Chat must have a valid name.

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

@@ -151,12 +151,13 @@ export class NewScreen extends Component {
       // 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}`;
-      if (!state.createGroup || state.groups.length === 0) {
-        chatPath = '/~' + chatPath;
+      if (!state.createGroup || state.groups.length > 0) {
+        chatPath = `/~${chatPath}`;
       }
       props.api.chatView.create(
         chatPath, state.security, aud, state.allowHistory
       );
+      props.history.push(`/~chat/room${chatPath}`);
     });
   }
 

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

@@ -115,16 +115,24 @@ export class Root extends Component {
             path="/~chat/join/(~)?/:ship?/:station?"
             render={props => {
               let station =
-                props.match.params.ship
-                + "/" +
-                props.match.params.station;
+                `/${props.match.params.ship}/${props.match.params.station}`;
+              let sig = props.match.url.includes("/~/");
+              if (sig) {
+                station = '/~' + station;
+              }
+
+
               return (
                 <Skeleton
                   sidebarHideOnMobile={true}
                   sidebar={renderChannelSidebar(props)}
                   sidebarShown={state.sidebarShown}
                 >
-                  <JoinScreen api={api} inbox={state.inbox} autoJoin={station} {...props} />
+                  <JoinScreen
+                    api={api}
+                    inbox={state.inbox}
+                    autoJoin={station}
+                    {...props} />
                 </Skeleton>
               );
             }}
@@ -133,7 +141,8 @@ export class Root extends Component {
             exact
             path="/~chat/(popout)?/room/(~)?/:ship/:station+"
             render={props => {
-              let station = `/${props.match.params.ship}/${props.match.params.station}`;
+              let station =
+                `/${props.match.params.ship}/${props.match.params.station}`;
               let sig = props.match.url.includes("/~/");
               if (sig) {
                 station = '/~' + station;