bitfinexcom / bfx-hf-ui

Bitfinex Honey UI

• Creates HF services as background processes
• Enables order types (Accum/Dist, Ping/Pong, Iceberg, TWAP and OCOCO)
• Define and backtest trading strategies

Installation

Steps to install

git clone https://github.com/bitfinexcom/bfx-hf-ui
cd bfx-hf-ui
npm run fetch-core
npm install

Create folder to store local db

mkdir ~/.bitfinexhoney
touch ~/.bitfinexhoney/algos.json
touch ~/.bitfinexhoney/hf-bitfinex.json
touch ~/.bitfinexhoney/ui.json
touch ~/.bitfinexhoney/strategy-executions.json

Run Electron version in the browser

npm run start-ds-bitfinex
npm run start-api-server
npm run build-css
npm run start

Fetch latest submodule

npm run update-core

Build Electron app manually

Generates an installable application to run independently from the browser. Once you have ran the below command navigate to the /dist folder and select the instillation executable file for the operating system that you are using.

npm run build
npm run dist-win-unpruned # for windows
npm run dist-mac # for mac
npm run dist-linux # for linux

Install pre-built Electron app

Head to the latest cut releases and locate the most recent release. Once there you will see installers attached for linux, mac and windows. Run the installer for the operating system that you are using.

The UI

Starting the Bitfinex Honey UI will spawn all of the Bitfinex Honey services that are needed to register custom algo-order definitions in the background. Currently (as of release 1.0.0) the UI will register the built in default order types which will be instantly available for use in the bitfinex.com UI. For more info on how to use algo orders once the UI is running head here.

API Key Permissions

To login to the HF application, please use API keys generated from bitfinex platform. Minimum required API key permissions are as following:

• Get orders and statuses.
• Create and cancel orders.
• Get wallet balances and addresses.

Contributing

1. Fork it (https://github.com/bitfinexcom/bfx-hf-ui)
2. Create your feature branch (`git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create a new Pull Request

bfx-hf-ui's Issues

Feature: Add ability to resize chart on Trading page

See title

Feature: Pan past end in chart

Proxy of bitfinexcom/bfx-hf-chart#6 for scheduling

Disable websocket kill switch

The user should be able to optionally disable the websocket kill switch within their settings.

Feature: OTA Updates

Low priority; details WIP

TODO

• research electron OTAU solutions
• implement selected solution

Feature: Hotkeys

Low priority but requested by several people; we need a hotkey system for order execution and app navigation. This should be configurable by the user.

TODO

• design hotkey list (non-trivial, check MT4/etc for ideas)
• implement hotkey system
• implement hotkey edit UI

Feature: Jump to strategy trade in chart

Clicking on a strategy trade in the table should center it on the chart, and optionally open the trade info overlay (as if hovering).

Requires bitfinexcom/bfx-hf-chart#5

Fix: Sync sometimes does not end

Has been seen in the wild when 0 candles are returned; the data server never sends the data.sync.end packet

As the packet is sent out before candles are queried from the DB, the 0 candle return is likely unrelated. Relevant logic: https://github.com/bitfinexcom/bfx-hf-data-server/blob/master/lib/cmds/get_candles.js#L64

Feature: Adaptive Front-of-Book Order

From bitfinexcom/bfx-hf-algo#24 to be scheduled for release here.

Order book stops receiving data

This issue was soon in the compiled electron app.

Steps to reproduce:

1. load application
2. Sign in
3. Connect API keys
4. Switch between "Market data" and "Trading terminal" view lots of times

Err:

Orderbook will freeze as if no data is being received from websocket. This might be caused by the websocket which attempts to unsubscribe from the websocket whenever you change page.

Feature: Plugin System

Currently the HF has a plugin system in the form of bfx-hf-models adapters, which abstract Trade and Candle sync logic. There is however a secondary system used within bfx-hf-server which cannot be easily removed (individual exchange connection classes).

As a note, bfx-hf-server relies on the bfx-hf-models adapters for all algo order execution and trade/candle syncing, not the internal exchange connection classes.

TODO

• decide on plugin architecture
  • technically half of a plugin is in bfx-hf-server and half in bfx-hf-ext-plugin-EXCHANGE
• refactor existing plugins if needed
• design plugin UI
• implement plugin system

Feature: Strategy Editor Help

This currently exists in the codebase but is disabled as it was overlooked in the new design. Add it back in.

TODO

• re-enable logic
• fix design for new UI

Algo Order UI

The HF UI needs to provide a table w/ a list of all active algo orders, along with the ability to start/stop them, edit parameters, and view historical atomic trade activity.

Historical BT UI

Features

• Sidebar list of historical backtests
• Ability to see strategy logic (serialize JS handler func contents w/ results)

Fix: Add exchange/market controls to charts on Market Data page

These were omitted from the design after 2 iterations of the chart, and need to be added back in. The other panels in the MarketData page expose exchange/market dropdowns as expected. Charts do not.

TODO

• add exchange/market dropdowns to chart (use slim header to save space)

NOTE: The incoming redesign will replace this, hence this needs to be done before.

Example of useless chart:

Refactor: Improve modal design

Currently some modals feel highly bloated with whitespace, although not all. This needs to be fixed.

TODO

• enumerate different modal styles throughout the app
• restyle as necessary around a common theme

Current state:

Order cancels on server close

Every order is cancelled upon server close or losing internet connection, and I am looking into disabling this behavior.
It would be fine if only algo-type orders would be cancelled as I can't have my long term limit orders deleted everytime.

Any hint on where this behavior is coded ? , I just can't find it

Feature: Chart Go-To Time

Add a button to bfx-hf-chart to trigger a modal allowing the user to select a specific time to jump to. Should use a date/time picker.

Feature: Offline Mode

When offline we should theoretically be able to view historical candle data, as it is synced locally. However the app fails to start initially due to being unable to fetch market meta data.

TODO

• safely fail to fetch exchange metadata at startup, don't exit
• disable unnecessary networked services (ex pool, algo server, etc)
• display offline notice to user
• display 'go online' button, triggering full server restart.

Unable to change API credentials if error

When the websocket is unable to authenticate the users credentials there is no way to change/update them without deleting the entire database.

Steps to reproduce:

1. Open application
2. Entire valid API keys
3. Close application
4. Revoke API keys
5. Load application
6. Click on order create

Expected:
See option to change API keys since they are not working

Actual:
A message saying "connecting to bitfinec" is displayed indefinitely and does not close.

Refactor: Improve strategy trade rendering

Trades are rendered as red and green circles at the trade position on the chart. They are hard to see against the candle background, and very thin.

Redesign them!

Current state:

Feature: VPS Auto-Deployment

This has been planned for ages, and is not too difficult, just low priority. We need to add an UI allowing the user to provision a VPS (given the necessary API key/secret) and deploy an instance of bfx-hf-algo-server on it with a systemd service file (enabled and started).

Includes Bitfinex hosting!

TODO

• create provisioning system
• create bfx hosting logic
• create linode logic
• create digitalocean logic
• create AWS logic
• create GCP logic
• refactor bfx-hf-server to use remote instance, and kill local one
  • resume to remote instance if configured on last run
• design UI
  • decide server metrics reporting (uptime, load, etc, maybe 'update packages' button)
• implement UI
• update app UI/UX to notify the user when using a remote server for algos (banner or in status bar)

Feature: Strategy Execution

This includes both the UI side (multiple pages) and bfx-hf-server internal updates.

TODO

• create strategy system bitfinexcom/bfx-hf-server#14
• design strategy UI
• implement strategy UI

Chart doesn't exists

After the first launch chart doesn't exist.

Fix: Hook up panel move icon

Panels show an icon meant to be dragged to reposition the panel, but it does nothing.

Hook it up.

Example of move icon, top 2nd from right:

Fix: Select fields don't scroll

Seen in ExchangeInfoBar

Feature: Minimal Terminal-esque Redesign

Placeholder; details coming soon.

Strategy Exec UI

This will consist of multiple pages, and the design & final layout are still pending. However, this is a rough draft of the data that could/should be shown for each element:

• Strategy
  • Name
  • Intended market (can be changed as a param, but all strats define a default market)
  • Operating time frame (1min candles, 1hr, etc)
  • Link to open in editor for immediate backtesting
• Strategy Instance (in list view, maybe cards in a grid)
  • Parent strategy name
  • Target market
  • Running/stopped status
  • Controls to start/pause/stop execution, or delete the instance completely
  • Supplied arguments (may be long, so maybe this would be an expandable detail section)
    • Can be trade size, target market, indicator params, custom thresholds for triggering events. This is dynamic and defined by the user.
  • Performance metrics
    • Profit/Loss graph over time
      or
    • Chart of last 100 candles from the target market
  • Last few trades the strategy made
  • Current strategy state
    • No position, or long/short
    • Position size (if open)
    • Current target profit price, and current stop price (if active)
    • Current position profit
    • Total Profit/Loss since execution started
  • 'Running for X hours...' text to indicate when strategy started
  • Average trades/minute
  • Average profit per trade
  • And more! Ideally the card view should be expandable to show more info, or we can move things that don't fit into the detail view
• Strategy Instance Details
  • All of the above from 'Strategy Instance'
  • Large chart showing trades, current position, open orders, etc etc

Submitting API credentials does not unlock Order Form

After entering the API Key/Secret on a fresh install, the order form does not redirect from the credential submit form, even though the server successfully connections to Bitfinex.

After a restart it works as expected.

Refactor: Add autocomplete to bfx-hf-chart indicators dropdown

From bitfinexcom/bfx-hf-chart#3 to be scheduled for release here.

Unable to submit algo orders via bitfinex.com UI

The HF UI successfully connects to the bitfinex.com UI but is unable to submit orders even though submitting orders works correctly via the HF-UI application.

Steps to reproduce:

• Open HF-UI electron application

• Click on an algo order

• Submit API credentials

• Navigate to bitfinex.com

• Log-ing

• Submit algo order

Results:
HF shows that its connected however the order request times out and nothing happens.

Expected:
Algo order is submitted and picked up by the UI

Refactor: axios usage

Currently axios is used to pull the latest version info from the Github repo in order to render the version & upgrade button in the StatusBar component here:

bfx-hf-ui/src/components/StatusBar/StatusBar.js

Line 95 in 20e311a

axios

This needs to be refactored into the redux system, so we don't make the GET request on every render of StatusBar (not very efficient).

TODO

• Add/use existing reducer for data (I recommend meta)
• Add a saga to fetch the current version & run it on startup, potentially on an interval (something large, maybe 60 minutes, not sure)
• Add a selector to access the remote version value
• Use the selector in StatusBar.container to pass the value as a prop
• Refactor StatusBar to use the prop.

Likely fixed by #45 but needs review

Refactor: Tweak StatusBar Design

Currently all statusbar elements are right-aligned and bunched together; refactor UI/IX

Feature: OCOCO Algo Order

In progress here: bitfinexcom/bfx-hf-algo#23

TODO

• populate docs

Feature: Lock UI Button

The UI must be unlocked with a password, but there is no current way to lock it aside from closing the app entirely.

Add a lock button

Error Not responding

This issue was found in the electron JS application.

Steps to reproduce:

1. Load application
2. Sign in
3. Navigate to "Market data"
4. Interact with chart

Err:

Application freezes with "Not responding" status for a few seconds. This happens multiple times, not sure if there is some blocking code (prehaps chart waiting for data?) or if there is some really inefficient render patterns.

Feature: Edit Indicator Color(s)

bfx-hf-chart exposes save/load functionality for colors but they are not connected to the settings modal. A color picker should be used, and some indication of which line each color is for (where applicable)

Feature: Integrate HF affiliate code

TODO

• user settings page & persistence
• update bfx adapter to accept and use aff code
• pass aff code to bfx adapter

Feature: Strategy Editor P/L Chart

This was present early in the life of the HF UI but removed before it became a proper app.

Add a chart somewhere in the StrategyEditor page that shows Profit/Loss over time.

Needs bitfinexcom/bfx-hf-chart#7

Feature: Order Form Profiles

Allow the user to save a populated order form for later restoration. Very useful in testing when having to enter the same details over and over again, but it has also been requested multiple times by multiple users.

Should grab & save all field state into a 'profile' or so

TODO

• create profile save system
• add profile dropdown to OF, that causes profile values to fill in
• allow setting of default profiles (i.e. user often uses the same amount in orders on a market, etc)

Refactor: Notifications Design

Aside from #83, the notifications in general feel bloated. The sidebar expands very far out into the available screen space, and the notifications themselves have large dimensions.

Make them slicker, rethink UI/UX.

Current state:

MacOS: The application “The Honey Framework” can’t be opened.

I can't execute the binary on Mac OS. Get the error The application “The Honey Framework” can’t be opened.

MacOS version: 10.15.2
The honey version: v3.0.3 (from github release zip) https://github.com/bitfinexcom/bfx-hf-ui/releases

Feature: Populate bfx-hf-chart docs

Proxy of bitfinexcom/bfx-hf-chart#8 for scheduling

Error: spawn concurrently ENOENT

Trying to run the app on my laptop, I did clone the repo and follow the install procedure.
npm run build went fine but npm run start-server is crashing.

Error:

$> npm run start-server

> [email protected] start-server /Users/doweig/dev/satoshi_cenobium/bfx-hf-ui
> cross-env concurrently --kill-others "npm run start-api-server"

events.js:167
      throw er; // Unhandled 'error' event
      ^

Error: spawn concurrently ENOENT
    at Process.ChildProcess._handle.onexit (internal/child_process.js:232:19)
    at onErrorNT (internal/child_process.js:407:16)
    at process._tickCallback (internal/process/next_tick.js:63:19)
    at Function.Module.runMain (internal/modules/cjs/loader.js:744:11)
    at startup (internal/bootstrap/node.js:285:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:739:3)
Emitted 'error' event at:
    at Process.ChildProcess._handle.onexit (internal/child_process.js:238:12)
    at onErrorNT (internal/child_process.js:407:16)
    [... lines matching original stack trace ...]
    at bootstrapNodeJSCore (internal/bootstrap/node.js:739:3)

Full log:

$> cat /Users/doweig/.npm/_logs/2020-01-20T08_51_23_455Z-debug.log

0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node',
1 verbose cli   '/usr/local/bin/npm',
1 verbose cli   'run',
1 verbose cli   'start-server' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prestart-server', 'start-server', 'poststart-server' ]
5 info lifecycle [email protected]~prestart-server: [email protected]
6 info lifecycle [email protected]~start-server: [email protected]
7 verbose lifecycle [email protected]~start-server: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~start-server: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/doweig/dev/satoshi_cenobium/bfx-hf-ui/node_modules/.bin:/Users/doweig/dev/satoshi_cenobium/bitcoin-0.17.1/bin:/Users/doweig/dev/satoshi_cenobium/lnd-darwin-amd64-v0.7.0-beta:/Users/doweig/.yarn/bin:/Users/doweig/.config/yarn/global/node_modules/.bin:/usr/local/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
9 verbose lifecycle [email protected]~start-server: CWD: /Users/doweig/dev/satoshi_cenobium/bfx-hf-ui
10 silly lifecycle [email protected]~start-server: Args: [ '-c',
10 silly lifecycle   'cross-env concurrently --kill-others "npm run start-api-server"' ]
11 silly lifecycle [email protected]~start-server: Returned: code: 1  signal: null
12 info lifecycle [email protected]~start-server: Failed to exec start-server script
13 verbose stack Error: [email protected] start-server: `cross-env concurrently --kill-others "npm run start-api-server"`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:301:16)
13 verbose stack     at EventEmitter.emit (events.js:182:13)
13 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:182:13)
13 verbose stack     at maybeClose (internal/child_process.js:962:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:251:5)
14 verbose pkgid [email protected]
15 verbose cwd /Users/doweig/dev/satoshi_cenobium/bfx-hf-ui
16 verbose Darwin 19.2.0
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "start-server"
18 verbose node v10.13.0
19 verbose npm  v6.10.1
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] start-server: `cross-env concurrently --kill-others "npm run start-api-server"`
22 error Exit status 1
23 error Failed at the [email protected] start-server script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

Versions:

➜  bfx-hf-ui git:(master) ✗ node --version
v10.13.0
➜  bfx-hf-ui git:(master) ✗ npm --version
6.10.1
➜  bfx-hf-ui git:(master) ✗ yarn --version
1.13.0

on MacOS 10.15.2

Refactor: Move Chart OHLC onto canvas

Is

Should be

Feature: Low Level Trading Limits

The very first version of bfx-hf-algo had this, but was rewritten and support for it was dropped in the process. Would be very useful to have again.

The user should be able to set at least the following limits:

• max trade size
• max position size (?)
• max traded per X minutes (research interval?)
• max traded per day
• and/or more!

TODO

• implement limit system in bfx-hf-algo
• design UI for limits
  • limit specification (add to user settings page?)
  • limit usage info if in interval
• design limit exceeded behavior (stop AOs, show dialogue/notification, etc)
• hook up limit UI

Feature: Show trade label on hover in chart

From bitfinexcom/bfx-hf-chart#4 to be scheduled for release here.

Indicator: Darvas Box

From bitfinexcom/bfx-hf-indicators#48 to be scheduled for release here

Fix: Notifications bar icon

Currently the notifications bell icon at the top of the page is unused, and we still have the old lower icon from the initial design. Screenshots:

Old:

New:

TODO

• remove old icon
• make new icon move with expanding panel, to always be visible

Feature: Theme System

We need to refactor all component css to export colors/fonts/etc into an own theme, for easier customization in the future.

As we have a complete redesign coming up next month, the system needs to be flexible enough to accommodate it.

TODO

• architect system/decide on lib
• update all components, use current styles as classic-dark theme
• make classic-light example theme

Feature: Order Help

This currently exists in the codebase but is disabled as it was overlooked in the new design. Add it back in.

TODO

• re-enable logic
• fix design for new UI