Code Monkey home page Code Monkey logo

trade-executor-frontend's Introduction

Trade executor user interface

This package is still in alpha.

Web API client for trading strategy executor.

  • This is a SvelteKit based frontend library
  • Load active trading strategies
  • Load open/closed trading positions
  • Load profitability metrics like profit and loss, trades won
  • Explore trades

Requirements

  • Node.js 16.14+ or 18+ (minumum required by SvelteKit)

Architecture

  • src/lib/strategy contains utilities for loading configured strategies
  • src/lib/state contains utilities for exploring strategy positions and stats
  • src/lib/helpers contains various UI helpers for correctly rendering data

Development

Helpful links

Tag & Pubish Package

To make a new release, update the version number and create a tag:

npm version [major | minor | patch]
git push
git push --tags

Pushing the tag will trigger the publish.yml GitHub action to run, which automatically packages and publishes the new version to the GitHub package registry.

trade-executor-frontend's People

Contributors

miohtama avatar kenkunz avatar

Stargazers

Joakim Bakke Hellum avatar Anndream avatar Josep Servat avatar

Watchers

 avatar  avatar Joakim Bakke Hellum avatar  avatar

trade-executor-frontend's Issues

Add summary statistics to metadata

Goal

Add support for new summary statistics added to trade-executor metadata endpoint.

See: tradingstrategy-ai/trade-executor#98

Details

The metadata endpoint now includes a summary_statistics key with the following sub-document:

{
  "calculated_at": 1669844489.737471,
  "first_trade_at": 1669584307.20721,
  "last_trade_at": 1669752500.799481,
  "enough_data": false,
  "current_value": 498.7829786372567,
  "profitability_90_days": -0.002404288169667067,
  "performance_chart_90_days": [
    [
      1669593600,
      0
    ],
    [
      1669680000,
      -0.002404288169667067
    ]
  ]
}

Add type-defs and add to the return payload of strategy metadata getter functions.

Use GH action to publish package

Current, new releases must be packaged and published manually (as described in the README). This could be simplified by using a GH action to package and publish when a new tag is pushed.

Upgrade SvelteKit to >= next.539

As of frontend@v54 released on 2022-11-10, Trade Executor Frontend pages no longer load successfully in frontend.

Based on my initial investigation, this is due to incompatible versions of SvelteKit used in the two projects.

To remedy this, Trade Executor Frontend should be upgraded to a version that matches frontend – currently next.539. In addition, frontend should include one or more end-to-end tests of Trade Executor Frontend pages to reduce risk of a similar bug is not introduced in the future.

See also: tradingstrategy-ai/frontend#232

Live strategy statistics made visible on the strategy UI

We have live test strategies that execute trading. To understand their performance better, we would need the following statistics visible on each strategy's investor facing UI and the respective strategy's admin UI

  • Strategy's base currency (USDC)
  • Net profit % (from the beginning, past 7 days, past 30 days) i.e. Gross Profit−Gross Loss = Net Profit
  • Max drawdown (%) i.e. https://www.investopedia.com/terms/m/maximum-drawdown-mdd.asp
  • Assets under management (USD)
  • AUM growth in last 30 days (%)
  • Trade win rate (%) e.g. 77 Winning Trades / 140 Total Trades = 55% Win Percentage
  • Average trade net profit i.e. total net profit / total number of trades
  • Profit factor i.e. Gross profit/Gross loss (including fees and commissions) for the entire trading period
  • Number of closed trades
  • Number of traders/investors in the strategy

Remove deprecated components and deps

Goal

Remove deprecated components, routes and dependencies that are no longer in use in Trading Strategy's frontend.

When these changes are complete, the footprint / role of trade-executor-frontend will be reduced to that of an API abstraction layer for trade-executor APIs (along with various related helper functions).

Background

See frontend › #231 EPIC: Strategy pages Design System 0.2 update

The above changes required us to re-evaluate the dependency graph between frontend and trade-executor-frontend. After considering various options, the team agreed on the following approach:

Before update After update Possible future state
Deprecated / unused UI components Reduce footprint of trade-executor-frontend to just API abstraction layer Pull shared design-system components / CSS into separate repo
Bootstrap has been mostly eliminated from frontend. frontend pages depends on a set of internal reusable design-system components and global CSS files (for colors, typography and some layout utility classes). trade-executor-frontend still relies on Bootstrap 4, which does not work well with our design-system components and CSS files. All UI components pulled into frontend. This was deemed the simplest approach, allowing for various reusable UI elements that are common to both repos to be extracted to the same shared set of design-system-components.
Downside: the Trade Execution UI is no longer independent of frontend.
Extract all shared / reusable components back out of frontend into design-system repo. frontend and trade-executor-frontend would both depend on design-system. This adds some complexity and overhead to the development lifecycle.
Upside: Trade Execution UI becomes fully independent of frontend (again).
Diagram: Before update Diagram: After update Diagram: Future state

Now that the frontend changes have been completed, the deprecated components, routes and other UI dependencies in trade-executor-frontend should be removed.

In the future, we may choose to extract the common / shared UI components back out of frontend into the design-system repo. This would allow trade-executor-frontend to run independent of frontend.

Tasks

  • remove routes (leave a vanilla home route)
  • remove all Svelte components under src/lib
  • remove unused helpers under src/lib
  • remove all unused npm dependencies
  • upgrade svelte related dependencies
  • remove bootstrap from app.html
  • update README.md (and any other docs)
  • make sure npm run dev, npm run build and npm run package still work
  • make sure frontend still works with these changes
  • publish minor version update (after review/merge)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.