bitshares / bitshares/bitshares-ui
Uplift compute environment & packages to latest versions
- Dominant language
- JavaScript
- Stars
- 520
- Forks
- 575
- Avg merge
- 12h 7m
- Merged PRs (30d)
- 5
Description
**Is your feature request related to a problem? Please describe.**

Node16 is no longer actively updated, only receiving security updates for the next 10 months. It looks like the reference dockerfile uses `node:6`? But looks like node versions <16 are in use from glancing over the repo issues?
https://ubuntu.com/about/release-cycle
Ubuntu 16/18 also seem to be end of maintenance cycle soon.
The packages.json contents now here's what could be updated from a quick glance:
```
@babel/core ^7.16.0 → ^7.19.6
@babel/eslint-parser ^7.16.3 → ^7.19.1
@babel/plugin-proposal-function-bind ^7.16.0 → ^7.18.9
@babel/preset-env ^7.16.4 → ^7.19.4
@babel/preset-react ^7.16.0 → ^7.18.6
@babel/register ^7.16.9 → ^7.18.9
@hot-loader/react-dom 16 → 17
archiver ^3.0.0 → ^5.3.1
autoprefixer ^9.5.1 → ^10.4.12
babel-jest ^24.1.0 → ^29.2.1
babel-loader ^8.2.3 → ^8.2.5
babel-plugin-lodash ^3.3.2 → ^3.3.4
benchmark ^2.1.3 → ^2.1.4
bignumber.js ^4.0.0 → ^9.1.0
classnames ^2.2.1 → ^2.3.2
coffee-loader ^3.0.0 → ^4.0.0
coffeescript ^2.6.1 → ^2.7.0
cookies-js ^1.2.1 → ^1.2.3
copy-webpack-plugin ^10.0.0 → ^11.0.0
copyfiles ^1.2.0 → ^2.4.1
counterpart ^0.18.5 → ^0.18.6
cross-env ^5.0.5 → ^7.0.3
css-loader ^6.5.1 → ^6.7.1
electron 16.2.6 → 21.2.0
electron-builder 22.14.5 → 23.6.0
es6-promise ^3.0.2 → ^4.2.8
eslint ^8.4.1 → ^8.26.0
eslint-plugin-react ^7.27.1 → ^7.31.10
express ^4.17.1 → ^4.18.2
express-history-api-fallback ^2.1.0 → ^2.2.1
extract-zip ^1.6.7 → ^2.0.1
file-saver ^1.3.8 → ^2.0.5
fs-jetpack ^1.3.0 → ^5.0.0
git-rev-sync ^1.12.0 → ^3.0.2
handlebars-loader ^1.7.0 → ^1.7.2
hirestime ^3.2.1 → ^7.0.1
html-loader ^3.0.1 → ^4.2.0
html2canvas ^1.3.3 → ^1.4.1
humanize-duration ^3.27.1 → ^3.27.3
husky ^0.14.3 → ^8.0.1
immutable 3.8.2 → 4.1.0
indexeddbshim ^2.2.1 → ^10.0.0
intro.js ^2.8.0-alpha.1 → ^6.0.0
jest-cli ^24.9.0 → ^29.2.1
js-sha256 ^0.2.3 → ^0.9.0
jsonschema ^1.2.4 → ^1.4.1
jspdf ^2.3.1 → ^2.5.1
jspdf-autotable ^3.1.1 → ^3.5.25
lodash-es ^4.17.10 → ^4.17.21
lzma 2.1.6 → 2.3.2
markdown-loader ^6.0.0 → ^8.0.0
md5-file ^4.0.0 → ^5.0.0
mini-css-extract-plugin ^2.4.5 → ^2.6.1
mocha ^5.1.1 → ^10.1.0
moment-timezone ^0.5.35 → ^0.5.38
node-libs-browser ^1.0.0 → ^2.2.1
numeral 2.0.4 → 2.0.6
oidc-client ^1.8.2 → ^1.11.5
postcss ^8.4.4 → ^8.4.18
postcss-loader ^6.2.1 → ^7.0.1
prettier ^1.10.2 → ^2.7.1
pretty-quick ^1.4.1 → ^3.1.3
prop-types ^15.6.1 → ^15.8.1
qrcode ^1.4.4 → ^1.5.1
qrcode.react ^0.7.1 → ^3.1.0
query-string ^6.1.0 → ^7.1.1
react 16.14.0 → 18.2.0
react-clipboard.js ^1.0.1 → ^2.0.16
react-copy-to-clipboard ^5.0.2 → ^5.1.0
react-debounce-render ^7.0.0 → ^8.0.2
react-dom 16.14.0 → 18.2.0
react-intl ^2.9.0 → ^6.2.1
react-router-dom ^5.1.2 → ^6.4.2
react-scroll ^1.8.1 → ^1.8.8
react-tooltip ^4.2.21 → ^4.4.2
react-transition-group ^4.4.2 → ^4.4.5
sass ^1.45.1 → ^1.55.0
sass-loader ^12.4.0 → ^13.1.0
string-similarity ^2.0.0 → ^4.0.4
svgo-loader ^3.0.0 → ^3.0.1
tcomb 2.5.2 → 3.2.29
webpack ^5.65.0 → ^5.74.0
webpack-cli ^4.9.1 → ^4.10.0
webpack-dev-server ^4.6.0 → ^4.11.1
webpack-hot-middleware ^2.25.1 → ^2.25.2
whatwg-fetch ^2.0.1 → ^3.6.2
xss ^1.0.3 → ^1.0.14
zxcvbn-async 0.0.5 → 0.0.6
```
Then some of the following were forked to the bitshares org, but haven't themselves inherited the last few years of upstream repo changes:
```
"alt": "https://github.com/bitshares/alt.git",
"alt-container": "https://github.com/bitshares/alt-container.git",
"alt-react": "https://github.com/bitshares/alt-react.git",
"foundation-apps": "git+https://github.com/zurb/foundation-apps.git",
"jdenticon": "git+https://github.com/cryptonomex/jdenticon.git",
"perfect-scrollbar": "git+https://github.com/bitshares/perfect-scrollbar.git",
"react-foundation-apps": "git+https://github.com/bitshares/react-foundation-apps.git",
```
One thing which stands out the most to me from these package versions, is the following:
` react 16.14.0 → 18.2.0`
This we would need to do in 2 steps
1. Uplift to [React v17](https://reactjs.org/blog/2020/10/20/react-v17.html) - Requires refactor of every component
2. Uplift to [React v18](https://reactjs.org/blog/2022/03/29/react-v18.html) - Small config changes, new advanced features
The upgrade to React 17 requiring a refactor of every React component in this repo is a significant task, I estimate there to be approx 400 components so this is plausibly several thousand hours of work purely on refactoring components.
Then some of the packages may not support react 18 and so would either need forked or replaced.
For example the following will likely need replaced:
* alt-react - depends on react 14
* https://github.com/zurb/foundation-apps - archived read-only
* react-autocomplete - archived read-only react 15
* react-clipboard.js - not updated in 3 years
* react-debounce-render - https://github.com/podefr/react-debounce-render/issues/42 (could do ourselves)
* https://github.com/akiran/react-foundation-apps - not updated in 7 years
* react-highcharts - not updated in 3 years, may be limited to react 16
* react-interpolate-component - no update in 5 years, pretty sure this is handled by react 17 now
* https://github.com/Lapple/react-json-inspector - archived read-only
* react-loadable - no update in 3 years, loading handled by [Suspense](https://beta.reactjs.org/apis/react/Suspense) now in latest react.
* react-notification-system - not been updated in a while, can be [forced to work with 17/18](https://github.com/igorprado/react-notification-system/issues/182), however electron offers built in notifications for light client.
* react-popover - no release in years, [abandoned](https://github.com/jasonkuhrt/react-popover/issues/231).
* react-qr-reader - [lack of maintenance](https://github.com/react-qr-reader/react-qr-reader/issues/278) limits use with latest react
* react-responsive-mixin - no update for 6 years
* react-sticky-table - https://github.com/henrybuilt/react-sticky-table/issues/137 lack of maintenance
* react-translate-component - no update for 5 years
* core-js - developer's health is failing, no other maintainers, may switch to commercial licensing soon.
I've not investigated what changes would be required in the dev dependencies too, however it's plausible some would also need replaced.
**Describe the solution you'd like**
Use Ubuntu 22 & Node 18/19.
Use latest React.
Uplift packages, replace those which no longer function as expected.
**Describe alternatives you've considered**
Create new reference wallet UI from scratch, or at least specific chunks of the wallet which interest me the most.
Fork the Bitshares NFT Viewer, use as basis for reimplementing existing functionality.
**Additional context**
The Beet multiwallet recently uplifted similarly from vue2 to vue3; It was a several month task.
There are likely significant improvements to performance purely from using the latest software, latest node, latest OS. Some of the packages currently in use can be removed now that their functionalities are supported natively.
Contributor guide
Research direction
Start with the reference Dockerfile and the listed packages.json dependencies, then review the React, Electron, Node and Ubuntu version constraints described in the issue. Map which dependencies and components block the upgrade before choosing replacements or migration steps. Done means the project runs on Ubuntu 22 with Node 18/19 and a current React version, with obsolete packages replaced and the wallet still functioning.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- docker, electron, javascript, node.js, react, ubuntu
- Domain
- build-system, devops, frontend, operating-systems
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 15/100