Giter Club home page Giter Club logo

lisk-desktop's Introduction

Lisk Desktop

Build Status Coverage Status License: GPL v3 GitHub package.json version DeepScan grade PRs Welcome Discord GitHub issues GitHub closed issues

Installation

You can download the latest release from Lisk.com. The link automatically detects your operating system and downloads the correct app. Currently we are supporting the following operating systems:

  • MacOS (individual builds for Apple Silicon and Intel chips)
  • Windows
  • Linux

For Contributors

Please see CONTRIBUTING_GUIDE.md for more information.

Development

Using Commercial Fonts

Basier Circle and Gilroy used in the production version are commercial fonts. This repository only contains open fonts and uses Open Sans as a replacement for the commercial ones.

If you have licensed copies of Basier Circle and Gilroy, you can add them to fonts folder. If you don't have the fonts, you need to remove lines 25 - 81 of type.css. After that, the build and dev npm scripts run without any errors.

Setup environment

The development environment currently depends on Node.js version 16 (lts/gallium). The below instructions assume nvm is being used to manage Node.js versions.

Note: For Windows users, make sure to set the correct msvs_version config for installing and packing the Lisk Desktop application.

git clone https://github.com/LiskHQ/lisk-desktop.git
cd lisk-desktop
nvm install lts/erbium
npm ci
npm run dev

Run on browser

Open http://localhost:8080

If you are actively developing in a specific route, and want to be automatically signed in every time you reload the page, please add the following input pairs to your localStorage:

loginKey: a valid passphrase

Add the above pair using the storage tab in your dev tools or via JavaScript command:

localStorage.setItem('loginKey', 'wagon stock borrow episode laundry kitten salute link globe zero feed marble') // desired account passphrase

When developing with hardware wallet, this will sign you in using the first account on the first connected hardware wallet:

localStorage.setItem('hwWalletAutoLogin', true);

You can use the same approach to define a desired network to which Lisk Desktop connects:

localStorage.setItem('liskServiceUrl', 'http://localhost:4000') // desired node to log in into

Build

Production build

To build the project simply run

npm run build

Under the hood, this script runs

npm run build:prod

to build the React app under src/ and

npm run build:electron

to build the electron app under app/ using webpack. You can run the above scripts individually if you're looking to see the changes solely on one of the two said applications.

Run Electron

If you have already built the application as described above, you can launch Electron using

npm run start

Run with parameters

To launch a version which supports hardware wallets, you can run

npm run dev:hw

or to launch electron and receive live updates from already running webpack-dev-server on port 8080 and you can run

LISK_DESKTOP_URL="http://localhost:8080" DEBUG=true npm run start

This comes with Redux dev tools.

Distribution

Windows

Build package for Windows (on Windows in Git BASH).

npm run pack:win

macOS

Build package for macOS (on macOs)

npm run pack

Linux

Build package for Linux (on Linux).

npm run pack

Testing

Unit tests

Single run

npm run test

Run each time a file changes

npm run test:live

E2E tests

In order to run e2e tests you need to install lisk-core as well as lisk-service.

Setup Lisk Core

Setup a lisk test node as described in Preparing Node headline under the tests section of Lisk Framework README.

Setup Service

Run Lisk Service against an already running local node as described in Preparing Node headline under the installation section of Lisk Service README.

Run

Start the development version of Lisk:

npm run dev

Apply blockchain snapshot

./test/e2e-test-setup.sh ~/git/lisk/

(replace ~/git/lisk/ with your path to lisk core)

Run e2e tests

npm run cypress:run

React Storybook

To launch storybook sandbox with components run

npm run storybook

and navigate to

http://localhost:6006/

Directory Layout

β”œβ”€β”€ __mocks__/                     # Modules used to mock dependencies for testing purpose.
β”œβ”€β”€ .storybook/                    # React storybooks reside here.
β”œβ”€β”€ app/                           # Electron based application that launces the react app.
β”œβ”€β”€ build/                         # Build specific materials.
β”œβ”€β”€ config/                        # Automation scripts (Webpack configurations, i18n scanner, etc)
β”œβ”€β”€ coverage/                      # Results of Jest test coverage.
β”œβ”€β”€ dist/                          # Platform specific built outputs.
β”œβ”€β”€ docs/                          # Project documentations such as contribution guides and development guidelines.
β”œβ”€β”€ i18n/                          # Localization files inluding setup scripts and translation json files.
β”œβ”€β”€ libs/                          # Modules which can be consumed individually in other projects.
β”œβ”€β”€ node_modules/                  # 3rd-party libraries and utilities.
β”œβ”€β”€ src/                           # Application source code.
β”‚   β”œβ”€β”€ app/                       # The bootstrap React application
β”‚   β”œβ”€β”€ assets/                    # Static files (images, fonts, etc)
β”‚   β”œβ”€β”€ components/                # React presentational components are located here.
β”‚   β”‚   β”œβ”€β”€ screens/               # These are the component that represent screens with dedicated URL.
β”‚   β”‚   β”œβ”€β”€ shared/                # These are the React components used at least in 2 other components (calendar, liskAmount, etc)
β”‚   β”‚   └── toolbox/               # Basic elements with basic styles and functionality which are used in numerous places (button, input, etc)
β”‚   β”œβ”€β”€ constants/                 # Names, addresses, static configurations and other values used throughout the application
β”‚   β”œβ”€β”€ context/                   # React context configuration files
β”‚   β”œβ”€β”€ hooks/                     # React custom hooks
β”‚   β”œβ”€β”€ store/                     # Redux store resides here.
β”‚   β”‚   β”œβ”€β”€ actions/               # Store actions reside here and are broken into script files dedicated to each system entity.
β”‚   β”‚   β”œβ”€β”€ middlewares/           # All the Redux middlewares are places here and have their dedicated script files based on the system entities.
β”‚   β”‚   β”œβ”€β”€ reducers/              # Redux reducers are located here. similar to actions and reducers, they are placed in script files named after the entity they represent.
β”‚   β”œβ”€β”€ utils/                     # Utility functions
└──test/                           # E2E tests written with Cypress.io and Cucumber; also some helpers used by unit test that live in /src

Contributors

See contributors section.

License

Copyright Β© 2016-2021 Lisk Foundation

This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.

You should have received a copy of the GNU General Public License along with this program. If not, see http://www.gnu.org/licenses/.

lisk-desktop's People

Contributors

reyraa avatar slaweet avatar massao avatar yasharayari avatar michaeltomasik avatar usamahameed avatar faival avatar rferro avatar ikem-legend avatar eniolam1000752 avatar gadjacobs avatar manugowda avatar bmaggi-lisk avatar karmacoma avatar francoilol avatar soroushm avatar alepop avatar vibratious avatar efefefef avatar fchavant avatar nazgolze avatar dependabot[bot] avatar sridharmeganathan avatar colado avatar greenkeeper[bot] avatar tschakki avatar osvaldovega avatar toschdev avatar joerodrig avatar willclarktech avatar

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.