Merge branch 'la-chat-sidebar' (#1885)

* la-chat-sidebar:
  chat-ui: fix image previews from url types
  chat-js: make clicking a url message open in a new tab
  chat-js: fix chat sorting and selection in sidebar

Signed-off-by: Jared Tobin <jared@tlon.io>

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

@@ -29,9 +29,27 @@ export class Message extends Component {
         </span>
       );
     } else if ('url' in letter) {
+      let imgMatch =
+        /(jpg|img|png|gif|tiff|jpeg|JPG|IMG|PNG|TIFF|GIF|webp|WEBP|webm|WEBM)$/
+        .exec(letter.url);
+      let contents = letter.url;
+      if (imgMatch) {
+        contents = (
+          <img
+            src={letter.url}
+            style={{
+              width: "50%",
+              maxWidth: "250px"
+            }}
+          ></img>
+        );
+      }
       return (
-        <a className="body-regular-400 v-top" href={letter.url}>
+        <a className="body-regular-400 v-top"
-          {letter.url}
+          href={letter.url}
+          target="_blank"
+          rel="noopener noreferrer">
+          {contents}
         </a>
       );
     } else if ('me' in letter) {

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

@@ -21,7 +21,7 @@ export class Sidebar extends Component {
 
   render() {
     const { props, state } = this;
-    let station = props.match.params.ship + props.match.params.station;
+    let station = `/${props.match.params.ship}/${props.match.params.station}`;
 
     let sidebarItems = Object.keys(props.inbox)
       .map((box) => {
@@ -42,7 +42,7 @@ export class Sidebar extends Component {
         };
       })
       .sort((a, b) => {
-        return b.wen - a.wen;
+        return b.when - a.when;
       })
       .map((obj) => {
         let unread = props.unreads[obj.box];