spa: stubbing global api, statusbar design fix

pkg/interface/src/components/GroupFilter.js

@@ -1,4 +1,5 @@
 import React, { Component } from 'react';
+import api from '../lib/api';
 
 export default class GroupFilter extends Component {
   constructor(props) {
@@ -24,7 +25,7 @@ export default class GroupFilter extends Component {
     const selected = localStorage.getItem('urbit-selectedGroups');
     if (selected) {
       this.setState({ selected: JSON.parse(selected) }, (() => {
-        window.api.setSelected(this.state.selected);
+        api.setSelected(this.state.selected);
       }));
     }
   }
@@ -197,7 +198,7 @@ onClick={() => this.addGroup(group)}
           'f9 gray2 bb bl br b--gray3 b--gray2-d bg-gray0-d ' +
           'white-d pa3 db w-100 inter bg-gray5 lh-solid tl'
         }
-style={{ width: 251 }}
+        style={{ width: 251 }}
         >
         {allSelected}
         </div>

pkg/interface/src/components/StatusBar.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { useLocation, Link } from 'react-router-dom';
 
 import GroupFilter from './GroupFilter';
-// import { Sigil } from "/components/lib/icons/sigil";
+import { Sigil } from '../lib/sigil';
 
 const getLocationName = (basePath) => {
   if (basePath === '~chat')
@@ -10,8 +10,6 @@ return 'Chat';
   // if (path === '~chat') return 'Publish';
 };
 
-const Sigil = () => (<div />);
-
 const StatusBar = (props) => {
   const location = useLocation();
   const basePath = location.pathname.split('/')[1];
@@ -33,10 +31,10 @@ const StatusBar = (props) => {
       }
       style={{ height: 45 }}
     >
-      <div className="fl lh-copy absolute left-0" style={{ top: 8 }}>
+      <div className="fl lh-copy absolute left-0 pl4" style={{ top: 8 }}>
       <a href="/~groups/me" className="dib v-top">
           <Sigil
-            ship={'~' + props.ship}
+            ship={'~' + window.ship}
             classes="v-mid mix-blend-diff"
             size={16}
             color={'#000000'}

pkg/interface/src/lib/api.js

@@ -0,0 +1,18 @@
+import store from '../apps/chat/store.js';
+
+class UrbitApi {
+  setSelected(selected) {
+    if (window.location.href.includes('~chat')) {
+      store.handleEvent({
+        data: {
+          local: {
+            selected: selected
+          }
+        }
+      });
+    }
+  }
+}
+
+const api = new UrbitApi();
+export default api;