spa: componentise spinner, migrate all global css

2024-09-21 07:28:30 +03:00 · 2020-04-30 22:54:03 -04:00 · 2020-04-30 22:54:03 -04:00 · 27406fe029
commit 27406fe029
parent f3367c4592
17 changed files with 20 additions and 18 deletions
--- a/pkg/arvo/app/chat/index.html
+++ b/pkg/arvo/app/chat/index.html
@ -9,7 +9,6 @@
      <meta name="apple-touch-fullscreen" content="yes" />
      <meta name="apple-mobile-web-app-status-bar-style" content="default" />
      <link rel="apple-touch-icon" href="/~chat/img/touch_icon.png">
-    <link rel="stylesheet" href="/~chat/css/index.css" />
    <link rel="icon" type="image/png" href="/~launch/img/Favicon.png">
    <link rel="manifest"
      href='data:application/manifest+json,{
--- a/pkg/arvo/app/launch/index.hoon
+++ b/pkg/arvo/app/launch/index.hoon
@ -6,7 +6,6 @@
    ;meta
      =name     "viewport"
      =content  "width=device-width, initial-scale=1, shrink-to-fit=no";
-      ;link(rel "stylesheet", href "/~launch/css/index.css");
      ;link(rel "icon", type "image/png", href "/~launch/img/Favicon.png");
  ==
  ;body
--- a/pkg/arvo/app/soto/index.html
+++ b/pkg/arvo/app/soto/index.html
@ -5,14 +5,13 @@
    <meta charset="utf-8" />
    <meta name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
-      <link rel="stylesheet" href="/~dojo/css/index.css" />
      <link rel="icon" type="image/png" href="/~launch/img/Favicon.png">
  </head>
-  <body class="w-100 h-100">
-      <div id="root" class="w-100 h-100">
+  <body>
+      <div id="root">
      </div>
    <script src="/~/channel/channel.js"></script>
    <script src="/~modulo/session.js"></script>
-    <script src="/~dojo/js/index.js"></script>
+    <script src="/~launch/js/index.js"></script>
  </body>
 </html>
--- a/pkg/interface/config/webpack.dev.js
+++ b/pkg/interface/config/webpack.dev.js
@ -6,7 +6,7 @@ const urbitrc = require('./urbitrc');
 module.exports = {
  mode: 'development',
  entry: {
-     app: './src/index.js'
+    app: './src/index.js'
  },
  module: {
    rules: [
@ -18,7 +18,8 @@ module.exports = {
            presets: ['@babel/preset-env', '@babel/preset-react'],
            plugins: [
              '@babel/plugin-proposal-object-rest-spread',
-              '@babel/plugin-proposal-optional-chaining'
+              '@babel/plugin-proposal-optional-chaining',
+              '@babel/plugin-proposal-class-properties'
            ]
          }
        },
--- a/pkg/interface/package.json
+++ b/pkg/interface/package.json
@ -28,6 +28,7 @@
  },
  "devDependencies": {
    "@babel/core": "^7.9.0",
+    "@babel/plugin-proposal-class-properties": "^7.8.3",
    "@babel/plugin-proposal-object-rest-spread": "^7.9.5",
    "@babel/plugin-proposal-optional-chaining": "^7.9.0",
    "@babel/preset-env": "^7.9.5",
--- a/pkg/interface/src/App.js
+++ b/pkg/interface/src/App.js
@ -1,6 +1,8 @@
 import * as React from 'react';
 import { BrowserRouter as Router, Route, Link, withRouter } from 'react-router-dom';
 import styled, { ThemeProvider, createGlobalStyle } from 'styled-components';
+import './css/indigo-static.css';
+import './css/fonts.css';
 import { light } from '@tlon/indigo-react';

 import ChatApp from './apps/chat/ChatApp';
--- a/pkg/interface/src/apps/chat/api.js
+++ b/pkg/interface/src/apps/chat/api.js
@ -36,7 +36,6 @@ class UrbitApi {
  }

  bind(path, method, ship = this.authTokens.ship, app, success, fail, quit) {
-    console.log(this.channel);
    this.bindPaths = _.uniq([...this.bindPaths, path]);

    window.subscriptionId = this.channel.subscribe(ship, app, path,
--- a/pkg/interface/src/apps/chat/components/join.js
+++ b/pkg/interface/src/apps/chat/components/join.js
@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
-import { Spinner } from './lib/icons/icon-spinner';
+import { Spinner } from '../../../components/Spinner';
 import urbitOb from 'urbit-ob';

 export class JoinScreen extends Component {
--- a/pkg/interface/src/apps/chat/components/lib/invite-element.js
+++ b/pkg/interface/src/apps/chat/components/lib/invite-element.js
@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { InviteSearch } from '../../../../components/InviteSearch';
-import { Spinner } from './icons/icon-spinner';
+import { Spinner } from '../../../../components/Spinner';

 export class InviteElement extends Component {
  constructor(props) {
--- a/pkg/interface/src/apps/chat/components/new-dm.js
+++ b/pkg/interface/src/apps/chat/components/new-dm.js
@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { Spinner } from './lib/icons/icon-spinner';
+import { Spinner } from '../../../components/Spinner';
 import { Link } from 'react-router-dom';
 import urbitOb from 'urbit-ob';

--- a/pkg/interface/src/apps/chat/components/new.js
+++ b/pkg/interface/src/apps/chat/components/new.js
@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { InviteSearch } from '../../../components/InviteSearch';
-import { Spinner } from './lib/icons/icon-spinner';
+import { Spinner } from '../../../components/Spinner';
 import { Link } from 'react-router-dom';
 import { deSig } from '../../../lib/util';
 import urbitOb from 'urbit-ob';
--- a/pkg/interface/src/apps/chat/components/settings.js
+++ b/pkg/interface/src/apps/chat/components/settings.js
@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { deSig, uxToHex, writeText } from '../../../lib/util';
 import { Link } from 'react-router-dom';

-import { Spinner } from './lib/icons/icon-spinner';
+import { Spinner } from '../../../components/Spinner';
 import { ChatTabBar } from './lib/chat-tabbar';
 import { InviteSearch } from '../../../components/InviteSearch';
 import SidebarSwitcher from './lib/icons/icon-sidebar-switch';
--- a/pkg/interface/src/components/GroupFilter.js
+++ b/pkg/interface/src/components/GroupFilter.js
@ -211,7 +211,7 @@ onClick={() => this.addGroup(group)}
        onClick={() => this.toggleOpen()}
        ref={el => this.toggleButton = el}
        >
-        <p className="dib f9 pointer pv1 ph2 mw5 truncate v-mid">{currentGroup}</p>
+        <p className="inter dib f9 pointer pv1 ph2 mw5 truncate v-mid">{currentGroup}</p>
        </div>
        <div className={dropdownClass}
          style={{ maxHeight: '24rem', width: 285 }}
--- a/pkg/interface/src/apps/chat/components/lib/icons/icon-spinner.js
+++ b/pkg/interface/src/apps/chat/components/lib/icons/icon-spinner.js
--- a/pkg/interface/src/components/StatusBar.js
+++ b/pkg/interface/src/components/StatusBar.js
@ -6,8 +6,10 @@ import { Sigil } from '../lib/sigil';

 const getLocationName = (basePath) => {
  if (basePath === '~chat')
-return 'Chat';
-  // if (path === '~chat') return 'Publish';
+    return 'Chat';
+  if (basePath === '~dojo')
+    return 'Dojo';
+  // if (basePath === '~publish') return 'Publish';
 };

 const StatusBar = (props) => {
@ -32,7 +34,7 @@ const StatusBar = (props) => {
      style={{ height: 45 }}
    >
      <div className="fl lh-copy absolute left-0 pl4" style={{ top: 8 }}>
-      <a href="/~groups/me" className="dib v-top">
+      <a href="/~groups/me" className="dib v-top" style={{ lineHeight: 0, paddingTop: 6 }}>
          <Sigil
            ship={'~' + window.ship}
            classes="v-mid mix-blend-diff"
--- a/pkg/interface/src/oldApps/launch/src/css/fonts.css
+++ b/pkg/interface/src/oldApps/launch/src/css/fonts.css
--- a/pkg/interface/src/oldApps/launch/src/css/indigo-static.css
+++ b/pkg/interface/src/oldApps/launch/src/css/indigo-static.css