Skip to content

Commit

Permalink
Merge branch 'desktop' into fix/4226-mixed-message-history
Browse files Browse the repository at this point in the history
  • Loading branch information
Vitaliy Vlasov committed Jun 22, 2018
2 parents ff248fd + 210fe71 commit 370cf13
Show file tree
Hide file tree
Showing 14 changed files with 411 additions and 146 deletions.
1 change: 1 addition & 0 deletions VERSION
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
0.0.1
73 changes: 0 additions & 73 deletions desktop/run-app.sh

This file was deleted.

60 changes: 60 additions & 0 deletions doc/desktop/DevEnvSetup.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
# Prerequisites:
lein, node.js v.8 , cmake, Qt 5.9.1 (with QtWebEngine components installed), Qt's qmake available in PATH

Note: add qmake to PATH via
`export PATH=<QT_PATH>/clang_64/bin:$PATH`

Caveats:
- if npm hangs at some step, check the version. If it's 5.6.0, try downgrading to 5.5.1 via `npm install -g npm@5.5.1`

# To install react-native-cli with desktop commands support:
1. git clone https://github.com/status-im/react-native-desktop.git
2. cd react-native-desktop/react-native-cli
3. npm update
4. npm install -g

# To setup re-natal dev builds of status-react for Desktop:
1. git clone https://github.com/status-im/status-react.git
2. cd status-react
3. git checkout desktop
4. npm install
5. lein deps
6. ./re-natal use-figwheel
7. ./re-natal enable-source-maps
8. In separate terminal tab: `npm start` (note: it starts react-native packager )
9. In separate terminal tab: node ./ubuntu-server.js
10. In separate terminal tab: lein figwheel-repl desktop (note: wait until sources compiled)
11. In separate terminal tab: react-native run-desktop

# Editor setup
Running `lein figwheel-repl desktop` will run a REPL on port 7888 by default. Some additional steps might be needed to connect to it.

## emacs-cider
In order to get REPL working, use the below elisp code:
```
(defun custom-cider-jack-in ()
(interactive)
(let ((status-desktop-params "with-profile +figwheel repl"))
(set-variable 'cider-lein-parameters status-desktop-params)
(message "setting 'cider-lein-parameters")
(cider-jack-in)))
(defun start-figwheel-cljs-repl ()
(interactive)
(set-buffer "*cider-repl status-react*")
(goto-char (point-max))
(insert "(do (use 'figwheel-api)
(start [:desktop])
(start-cljs-repl))")
(cider-repl-return))
```

`custom-cider-jack-in` sets the correct profile for leiningen, and can be run as soon as emacs is open.
run `start-figwheel-cljs-repl` once you already have a cider repl session from the jack-in

## vim-fireplace
For some reason there is no `.nrepl-port` file in project root, so `vim-fireplace` will not be able to connect automatically. You can either:
- run `:Connect` and answer a couple of interactive prompts
- create `.nrepl-port` file manually and add a single line containing `7888` (or whatever port REPL is running on)

After Figwheel has connected to the app, run `:Piggieback (figwheel-sidecar.repl-api/repl-env)` inside Vim, and you should be all set.
136 changes: 136 additions & 0 deletions doc/desktop/Troubleshooting.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,136 @@
These are some common issues you may run into while setting up React Native Qt.

## Initial setup issues

### `npm install` hangs
Downgrade to version 5.5.1: `npm install -g npm@5.5.1`.

### `re-natal` missing
Create a link:
`ln -sf node_modules/re-natal/index.js re-natal`


### `react-native run desktop` complaining about missing `qmldir`:
```Command failed: ./build.sh -e "node_modules/react-native-i18n/desktop;node_modules/react-native-config/desktop;node_modules/react-native-fs/desktop;node_modules/react-native-http-bridge/desktop;node_modules/react-native-webview-bridge/desktop;modules/react-native-status/desktop"
Error copying directory from "/path-to-status-react/node_modules/react-native/ReactQt/runtime/src/qmldir" to "/path-to-status-react/desktop/lib/React".
make[2]: *** [lib/CMakeFiles/copy-qmldir] Error 1
make[1]: *** [lib/CMakeFiles/copy-qmldir.dir/all] Error 2
make: *** [all] Error 2
```
Can be solved by re-running `npm install react-native` which put the `ReactQt/runtime/src/qmldir` file back.

### Missing web3 package issue

After last upgrade of react-native-desktop to the v.0.53.3 of original react-native appeared some incompatibility between `react-native` and `web3` packages on npm install. Initially it installed usually fine, but after `react-native desktop` command execution `web3` package is get removed from `node_modules`. Manual install of web3 by `npm install web3` installs `web3` package, but removes `react-native` package. Workaround or solution?

### Go problem
```
panic: runloop has just unexpectedly stopped
goroutine 50 [running]:
github.com/status-im/status-go/vendor/github.com/rjeczalik/notify.init.0.func1()
/path-to-status-react/desktop/modules/react-native-status/desktop/StatusGo/src/github.com/status-im/status-go/vendor/github.com/rjeczalik/notify/watcher_fsevents_cgo.go:69 +0x79
created by github.com/status-im/status-go/vendor/github.com/rjeczalik/notify.init.0
/path-to-status-react/desktop/modules/react-native-status/desktop/StatusGo/src/github.com/status-im/status-go/vendor/github.com/rjeczalik/notify/watcher_fsevents_cgo.go:65 +0x4e
events.js:183
throw er; // Unhandled 'error' event
```
Related to https://github.com/rjeczalik/notify/issues/139. Solution: re-run.

## App issues

### Eth node crashing
`node ./ubuntu_server.js` log:
```
DEBUG [status-im.utils.handlers:36] - Handling re-frame event: :signal-event {"type":"node.crashed","event":{"error":"node is already running"}}
DEBUG [status-im.ui.screens.events:350] - :event-str {"type":"node.crashed","event":{"error":"node is already running"}}
DEBUG [status-im.utils.instabug:8] - Signal event: {"type":"node.crashed","event":{"error":"node is already running"}}
DEBUG [status-im.ui.screens.events:362] - Event node.crashed not handled
```
Solution: prevent starting Ethereum local node when there is an instance already running.

### Reload JS - blank screen
Console log for `react-native run-desktop` shows error 533.
Solution: reload again. Still, might hang at `Signing you in...` step (due to node attempted to be restarted). Re-run Figwheel and `react-native run-desktop`

### ReactButton.qml non-existent property "elide" error upon startup
```
qrc:/qml/ReactButton.qml:33: Error: Cannot assign to non-existent property "elide"
"Component for qrc:/qml/ReactWebView.qml is not loaded"
QQmlComponent: Component is not ready
"Unable to construct item from component qrc:/qml/ReactWebView.qml"
"Can't create QML item for componenet qrc:/qml/ReactWebView.qml"
"RCTWebViewView" has no view for inspecting!
```
Reload JS does not help, restarting Figwheel/react-native might not as well. Restarting Metro bundler solved it for me.

### After login when several contacts are available: realm errors
1. `attempting to create an object of type 'chat'...`
2. `attempting to create an object of type 'transport'...`
3. Error text containing only the public key.
The realm stack trace follows.

### Error: spawn gnome-terminal ENOENT
In node server log:
```
ignoring exception: Error: read ECONNRESET
```
In react-native log:
```
./run-app.sh: line 72: 56660 Segmentation fault: 11 /path-to-status-react/desktop/bin/StatusIm $args
events.js:183
throw er; // Unhandled 'error' event
^
Error: spawn gnome-terminal ENOENT
at _errnoException (util.js:992:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:190:19)
at onErrorNT (internal/child_process.js:372:16)
at _combinedTickCallback (internal/process/next_tick.js:138:11)
at process._tickCallback (internal/process/next_tick.js:180:9)
```
or
```
StatusIm(7924,0x70000c1cd000) malloc: *** error for object 0x7f8b1539bd10: incorrect checksum for freed object - object was probably modified after being freed.
*** set a breakpoint in malloc_error_break to debug
./run-app.sh: line 72: 7924 Abort trap: 6 /path-to-status-react/desktop/bin/StatusIm $args
events.js:183
throw er; // Unhandled 'error' event
^
Error: spawn gnome-terminal ENOENT
at _errnoException (util.js:992:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:190:19)
at onErrorNT (internal/child_process.js:372:16)
at _combinedTickCallback (internal/process/next_tick.js:138:11)
at process._tickCallback (internal/process/next_tick.js:180:9)
```

### statusgo error during `react-native run-desktop`

```
Command failed: build(.)sh -e "node_modules/react-native-i18n/desktop;node_modules/react-native-config/desktop;node_modules/react-native-fs/desktop;node_modules/react-native-http-bridge/desktop;node_modules/react-native-webview-bridge/desktop;modules/react-native-status/desktop"
# github.com/status-im/status-go/vendor/github.com/ethereum/go-ethereum/crypto/bn256
../vendor/github.com/ethereum/go-ethereum/crypto/bn256/bn256_fast.go:26: syntax error: unexpected = in type declaration
../vendor/github.com/ethereum/go-ethereum/crypto/bn256/bn256_fast.go:30: syntax error: unexpected = in type declaration
# github.com/status-im/status-go/vendor/github.com/ethereum/go-ethereum/crypto/bn256
vendor/github.com/ethereum/go-ethereum/crypto/bn256/bn256_fast.go:26: syntax error: unexpected = in type declaration
vendor/github.com/ethereum/go-ethereum/crypto/bn256/bn256_fast.go:30: syntax error: unexpected = in type declaration
make[3]: *** [statusgo-library] Error 2
make[2]: *** [modules/react-native-status/desktop/StatusGo/src/github.com/status-im/src/StatusGo_ep-stamp/StatusGo_ep-configure] Error 2
make[1]: *** [modules/react-native-status/desktop/CMakeFiles/StatusGo_ep(.)dir/all] Error 2
make: *** [all] Error 2
```

### inotify errors

upon running `npm start` on linux, watchman may indicate: "The user limit on the total number of inotify watches was reached"

This can be fixed by running the below command. Note, changes will only be as valid as the current terminal session.

```
echo 999999 | sudo tee -a /proc/sys/fs/inotify/max_user_watches && echo 999999 | sudo tee -a
/proc/sys/fs/inotify/max_queued_events && echo 999999 | sudo tee -a /proc/sys/fs/inotify/max_user_instances &&
watchman shutdown-server && sudo sysctl -p
```

7 changes: 4 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -32,16 +32,17 @@
"events": "1.1.1",
"homoglyph-finder": "1.1.1",
"identicon.js": "github:status-im/identicon.js",
"instabug-reactnative": "2.8.1",
"instabug-reactnative": "2.12.0",
"level-filesystem": "1.2.0",
"metro": "^0.30.2",
"nfc-react-native": "github:status-im/nfc-react-native",
"process": "0.11.10",
"prop-types": "15.6.0",
"punycode": "1.4.1",
"querystring-es3": "0.2.1",
"re-natal": "git+https://github.com/status-im/re-natal.git#master",
"react": "^16.2.0",
"react-dom": "16.2.0",
"react": "16.3.1",
"react-dom": "16.3.1",
"react-native": "git+https://github.com/status-im/react-native-desktop.git",
"react-native-background-timer": "2.0.0",
"react-native-camera": "0.10.0",
Expand Down
10 changes: 5 additions & 5 deletions patches/metro+0.24.7.patch → patches/metro+0.30.2.patch
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
patch-package
--- a/node_modules/metro/src/JSTransformer/index.js
+++ b/node_modules/metro/src/JSTransformer/index.js
@@ -139,6 +139,8 @@ module.exports = class Transformer {
@@ -151,6 +151,8 @@ module.exports = class Transformer {
/^--heap[_-]growing[_-]percent=[0-9]+$/.test(arg) ||
/^--max[_-]old[_-]space[_-]size=[0-9]+$/.test(arg));

+ execArgv.push("--max-old-space-size=8192");
+

return new Worker(workerPath, {
computeWorkerKey,
const env = _extends({},
process.env, {
// Force color to print syntax highlighted code frames.
--- a/node_modules/metro/src/defaults.js
+++ b/node_modules/metro/src/defaults.js
@@ -47,7 +47,7 @@ exports.sourceExts = ['js', 'json'];
@@ -45,7 +45,7 @@ exports.sourceExts = ['js', 'json'];

exports.moduleSystem = require.resolve('./lib/polyfills/require.js');

Expand Down
19 changes: 18 additions & 1 deletion src/status_im/ui/components/colors.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -2,29 +2,46 @@
(:require [clojure.string :as string]))

(def white "#ffffff")
(def transparent "transparent")
(def white-light-transparent "rgba(255, 255, 255, 0.1)") ;; Used as icon background color for a dark foreground
(def white-transparent "rgba(255, 255, 255, 0.2)") ;; Used as icon color on dark background
(def white-lighter-transparent "rgba(255, 255, 255, 0.6)") ;; Used for input placeholder color
(def black "#000000") ;; Used as the default text color
(def black-transparent "#00000020") ;; Used as background color for rounded button on dark background
(def black-darker-transparent "#00000033") ;; Used as background color for containers like "Backup seed phrase"
(def gray "#939ba1") ;; Used as a background for a light foreground and as section header and secondary text color
(def gray-icon "#6e777e") ;; Used for forward icon in accounts
(def gray-light "#e8ebec") ;; Used as divider color
(def gray-lighter "#eef2f5") ;; Used as a background or shadow
(def gray-transparent "rgba(184, 193, 199, 0.5)") ;; Used for tabs
(def gray-notifications "#4A5054cc") ;; Used for notifications background
(def gray-border "#ececf0")
(def blue "#4360df") ;; Used as main wallet color, and ios home add button
(def blue-transparent "rgba(67, 96, 223, 0.2)")
(def blue-transparent-40 "rgba(67, 96, 223, 0.4)")
(def blue-darker "#c4cced")
(def blue-dark "#3147ac") ;; Used as secondary wallet color (icon background)
(def hawkes-blue "#dce2fb") ;; Outgoing chat messages background
(def wild-blue-yonder "#707caf") ;; Text color for outgoing messages timestamp
(def red "#ff2d55") ;; Used to highlight errors or "dangerous" actions
(def red-light "#ffe5ea") ;; error tooltip
(def text-light-gray "#212121") ;; Used for labels (home items)
(def cyan "#7adcfb") ;; Used by wallet transaction filtering icon
(def photo-border-color "#ccd3d6")
(def green "#44d058") ;; icon for successful inboud transaction

(def chat-colors ["#fa6565"
"#7cda00"
"#887af9"
"#51d0f0"
"#fe8f59"
"#d37ef4"])

(defn alpha [hex opacity]
(let [hex (string/replace hex #"#" "")
r (js/parseInt (subs hex 0 2) 16)
g (js/parseInt (subs hex 2 4) 16)
b (js/parseInt (subs hex 4 6) 16)]
(str "rgba(" r "," g "," b "," opacity")")))
(str "rgba(" r "," g "," b "," opacity ")")))

(def text black)
Loading

0 comments on commit 370cf13

Please sign in to comment.