add ui server

.babelrc

@@ -2,9 +2,9 @@
   "presets": ["@babel/react", "@babel/flow"],
   "plugins": [
     "react-hot-loader/babel",
-  	["@babel/plugin-proposal-decorators", { "decoratorsBeforeExport": true }],
+    ["@babel/plugin-proposal-decorators", { "decoratorsBeforeExport": true }],
-  	"@babel/plugin-transform-flow-strip-types",
+    "@babel/plugin-transform-flow-strip-types",
-  	"@babel/plugin-proposal-class-properties",
+    "@babel/plugin-proposal-class-properties",
-  	"babel-plugin-add-module-exports"
+    "babel-plugin-add-module-exports"
   ]
 }

package.json

@@ -23,20 +23,21 @@
     "compile:electron": "webpack --progress --config webpack.electron.config.js",
     "compile:web": "webpack --progress --config webpack.web.config.js",
     "compile": "yarn compile:electron && yarn compile:web",
-    "build": "yarn compile && electron-builder build",
-    "build:dir": "yarn build -- --dir -c.compression=store -c.mac.identity=null",
     "dev:electron": "webpack-dev-server --hot --progress --config webpack.electron.config.js",
     "dev:web": "webpack-dev-server --hot --progress --config webpack.web.config.js",
     "dev:internal-apis": "LBRY_API_URL='http://localhost:8080' yarn dev:electron",
+    "run:electron": "electron ./dist/electron/main.js",
+    "run:web": "yarn compile:web && node ./dist/web/server.js",
+    "pack": "electron-builder --dir",
+    "dist": "electron-builder",
+    "build": "yarn compile && electron-builder build",
+    "build:dir": "yarn build -- --dir -c.compression=store -c.mac.identity=null",
     "lint": "eslint 'src/**/*.{js,jsx}' --fix && flow",
     "format": "prettier 'src/**/*.{js,jsx,scss,json}' --write",
     "flow-defs": "flow-typed install",
     "precommit": "lint-staged",
     "preinstall": "yarn cache clean lbry-redux && yarn cache clean lbryinc",
-    "postinstall": "electron-builder install-app-deps && node build/downloadDaemon.js",
+    "postinstall": "electron-builder install-app-deps && node build/downloadDaemon.js"
-    "run:electron": "electron ./dist/electron/main.js",
-    "pack": "electron-builder --dir",
-    "dist": "electron-builder"
   },
   "dependencies": {
     "@babel/polyfill": "^7.2.5",

src/platforms/web/server.js

@@ -0,0 +1,8 @@
+const express = require('express');
+const path = require('path');
+const app = express();
+const port = 1337;
+
+app.use(express.static(__dirname));
+
+app.listen(port, () => console.log(`UI server listening at localhost://${port}`));

src/renderer/app.js

@@ -1,62 +0,0 @@
-/* eslint-disable no-redeclare */
-import store from 'store';
-import Path from 'path';
-// @if TARGET='app'
-import y18n from 'y18n';
-import { remote } from 'electron';
-import isDev from 'electron-is-dev';
-// @endif
-// @if TARGET='web'
-import { y18n } from 'web/stubs';
-// @endif
-
-// @if TARGET='app'
-const env = process.env.NODE_ENV || 'production';
-const i18n = y18n({
-  directory: Path.join(remote.app.getAppPath(), '/../static/locales').replace(/\\/g, '\\\\'),
-  updateFiles: false,
-  locale: 'en',
-});
-// @endif
-// @if TARGET='web'
-const env = process.env.NODE_ENV || 'development';
-const i18n = y18n({
-  updateFiles: false,
-  locale: 'en',
-});
-// @endif
-
-const logs = [];
-const app = {
-  env,
-  store,
-  i18n,
-  logs,
-  log(message) {
-    logs.push(message);
-  },
-};
-
-// @if TARGET='app'
-// Workaround for https://github.com/electron-userland/electron-webpack/issues/52
-if (!isDev) {
-  window.staticResourcesPath = Path.join(remote.app.getAppPath(), '../static').replace(
-    /\\/g,
-    '\\\\'
-  );
-} else {
-  window.staticResourcesPath = '';
-}
-// @endif
-
-// eslint-disable-next-line no-underscore-dangle
-global.__ = i18n.__;
-// eslint-disable-next-line no-underscore-dangle
-global.__n = i18n.__n;
-global.app = app;
-
-// Lbryinc needs access to the redux store for dispatching auth-releated actions
-global.store = app.store;
-
-export default app;
-/* eslint-enable no-redeclare */

src/renderer/web/index.js

@@ -1,2 +0,0 @@
-import '../index';
-import './publish';

src/renderer/web/stubs.js

@@ -1,29 +0,0 @@
-const callable = () => {
-  throw Error('Need to fix this stub');
-};
-const returningCallable = value => () => value;
-
-export const remote = {
-  dialog: {
-    showOpenDialog: callable,
-  },
-  getCurrentWindow: callable,
-  app: {
-    getAppPath: callable,
-  },
-  BrowserWindow: {
-    getFocusedWindow: callable,
-  },
-  Menu: {
-    getApplicationMenu: callable,
-  },
-  require: callable,
-};
-
-export const y18n = () => ({
-  getLocale: returningCallable('en'),
-  __: value => value,
-  __n: value => value,
-});
-
-export const isDev = false;

src/ui/component/app/view.jsx

@@ -113,9 +113,7 @@ class App extends React.PureComponent<Props> {
         <Header />
         <main className="page">
           {enhancedLayout && <Yrbl className="yrbl--enhanced" />}
-          {/* @if TARGET='app' */}
           <SideBar />
-          {/* @endif */}
           <div className="content" id="content">
             <Router />
             <ModalRouter />

src/ui/component/dateTime/view.jsx

@@ -44,6 +44,10 @@ class DateTime extends React.PureComponent<Props> {
     const { date, formatOptions, timeAgo } = this.props;
     const show = this.props.show || DateTime.SHOW_BOTH;
     const locale = i18n.getLocale();
+    const locales = ['en-US'];
+    if (locale) {
+      locales.push(locale);
+    }
 
     if (timeAgo) {
       return date ? <span>{moment(date).from(moment())}</span> : <span />;
@@ -53,7 +57,7 @@ class DateTime extends React.PureComponent<Props> {
       <span>
         {date &&
           (show === DateTime.SHOW_BOTH || show === DateTime.SHOW_DATE) &&
-          date.toLocaleDateString([locale, 'en-US'], formatOptions)}
+          date.toLocaleDateString(locales, formatOptions)}
         {show === DateTime.SHOW_BOTH && ' '}
         {date &&
           (show === DateTime.SHOW_BOTH || show === DateTime.SHOW_TIME) &&

src/ui/component/fileViewer/internal/player.jsx

@@ -4,8 +4,8 @@ import * as React from 'react';
 // @if TARGET='app'
 import { remote } from 'electron';
 import fs from 'fs';
-import path from 'path';
 // @endif
+import path from 'path';
 import player from 'render-media';
 import FileRender from 'component/fileRender';
 import LoadingScreen from 'component/common/loading-screen';

src/ui/component/header/view.jsx

@@ -80,7 +80,6 @@ const Header = (props: Props) => {
 
       <WunderBar />
 
-      {/* @if TARGET='app' */}
       <div className="header__navigation">
         <Button
           className="header__navigation-item header__navigation-item--menu"
@@ -98,6 +97,8 @@ const Header = (props: Props) => {
           onClick={() => navigate('/publish')}
         />
 
+        {/* @if TARGET='app' */}
+
         {showUpgradeButton && (
           <Button
             className="header__navigation-item header__navigation-item--right-action"
@@ -107,8 +108,8 @@ const Header = (props: Props) => {
             onClick={downloadUpgradeRequested}
           />
         )}
+        {/* @endif */}
       </div>
-      {/* @endif */}
     </header>
   );
 };

src/ui/component/splash/view.jsx

@@ -92,18 +92,9 @@ export default class SplashScreen extends React.PureComponent<Props, State> {
   }
 
   updateStatus() {
-    // @if TARGET='app'
     Lbry.status().then(status => {
       this.updateStatusCallback(status);
     });
-    // @endif
-    // @if TARGET='web'
-    Lbry.status().then(status => {
-      Lbry.account_list().then(accountList => {
-        this.updateStatusCallback(status, accountList);
-      });
-    });
-    // @endif
   }
 
   updateStatusCallback(status: Status, accountList: any) {
@@ -123,19 +114,11 @@ export default class SplashScreen extends React.PureComponent<Props, State> {
     const { wallet, blockchain_headers: blockchainHeaders } = status;
 
     // If the wallet is locked, stop doing anything and make the user input their password
-    // @if TARGET='app'
     if (wallet && wallet.is_locked) {
       // Clear the error timeout, it might sit on this step for a while until someone enters their password
       if (this.timeout) {
         clearTimeout(this.timeout);
       }
-      // @endif
-      // @if TARGET='web'
-      if (account_list && account_list.encrypted) {
-        this.setState({
-          isRunning: true,
-        });
-    // @endif
 
       // Make sure there isn't another active modal (like INCOMPATIBLE_DAEMON)
       if (launchedModal === false && !modal) {

src/ui/component/wunderbar/internal/autocomplete.jsx

@@ -15,9 +15,9 @@ https://github.com/reactjs/react-autocomplete/issues/239
 */
 /* eslint-disable */
 
-const React = require('react');
+import React from 'react';
-const { findDOMNode } = require('react-dom');
+import { findDOMNode } from 'react-dom';
-const scrollIntoView = require('dom-scroll-into-view');
+import scrollIntoView from 'dom-scroll-into-view';
 
 const IMPERATIVE_API = [
   'blur',

src/ui/i18n/index.js

@@ -10,7 +10,7 @@ const i18n = y18n({
 // @if TARGET='web'
 const i18n = {
   setLocale: () => {},
-  getLocale: () => {},
+  getLocale: () => null,
   __: x => x,
   __n: x => x,
 };

src/ui/test.jsx

@@ -1 +0,0 @@
-export default () => <h1>Hello world</h1>;

webpack.base.config.js

@@ -1,7 +1,6 @@
 const path = require('path');
 const merge = require('webpack-merge');
 const { DefinePlugin, ProvidePlugin } = require('webpack');
-const nodeExternals = require('webpack-node-externals');
 
 const UI_ROOT = path.resolve(__dirname, 'src/ui/');
 const STATIC_ROOT = path.resolve(__dirname, 'static/');
@@ -33,7 +32,7 @@ const baseConfig = {
         use: {
           loader: 'file-loader',
           options: {
-            outputPath: 'ui/imgs',
+            outputPath: 'ui/img',
             name: '[name].[ext]',
           },
         },

webpack.electron.config.js

@@ -37,11 +37,6 @@ const mainConfig = {
       },
     ],
   },
-  resolve: {
-    alias: {
-      // 'src/electron': path.resolve(__dirname, 'src/platforms/electron');
-    },
-  },
   plugins: [
     new CopyWebpackPlugin([
       {
@@ -91,11 +86,6 @@ const renderConfig = {
       },
     ],
   },
-  resolve: {
-    alias: {
-      // 'src/electron': path.resolve(__dirname, 'src/platforms/electron');
-    },
-  },
   plugins: [
     new CopyWebpackPlugin([
       {

webpack.web.config.js

@@ -5,6 +5,7 @@ const CopyWebpackPlugin = require('copy-webpack-plugin');
 
 const STATIC_ROOT = path.resolve(__dirname, 'static/');
 const DIST_ROOT = path.resolve(__dirname, 'dist/');
+const WEB_PLATFORM_ROOT = path.resolve(__dirname, 'src/platforms/web/');
 
 const webConfig = {
   target: 'web',
@@ -41,15 +42,14 @@ const webConfig = {
   },
   plugins: [
     new CopyWebpackPlugin([
-      {
-        from: `${STATIC_ROOT}/`,
-        to: `${DIST_ROOT}/web/static/`,
-        ignore: ['font/**/*', 'index.html', 'daemon/*'],
-      },
       {
         from: `${STATIC_ROOT}/index.html`,
         to: `${DIST_ROOT}/web/index.html`,
       },
+      {
+        from: `${WEB_PLATFORM_ROOT}/server.js`,
+        to: `${DIST_ROOT}/web/server.js`,
+      },
     ]),
   ],
 };