My Adventure Updating Vessel

in #hive-1693214 days ago

I took today to update Vessel to work past on Hive past HF24. I'm a heavy user of Vessel and it wasn't working and I hadn't seen any activity from @netuoso on it so I decided to do it myself.

Screen Shot 20201016 at 10.28.24 PM.pngI'm broke, no need to show the numbers

This was my first time looking at this codebase and my first time dealing with electron(which caused most of the pain).

Most of the work was just renaming anything with steem to hive and sbd to hbd, the same update process that I've gone through on a lot of other programs I had written. I also had to update the library to use hive-js instead of steem. That wasn't too bad. Got that running and I thought I was done. It worked on my machine and I had the ability to do what I needed(after fixing a small thing with delegations). Now to build the application. I was able to build the mac app pretty easily. I tried to do the same with the windows and linux. And that didn't work.

I didn't know what I was doing wrong, I was trying to use the build command that were within the package.json. After explaining I couldn't build them, @mahdiyari let me know that he had some experience with building electron apps and told me to use linux to build it and use electron-builder to build it instead.

He did the hard work and made the linux and windows binaries. But there was a problem. He tried running it on windows and it led to a problem. Vessel stores the last used node and for him(and others) that node was not a proper hive node. And because of that, one of the functions that expected certain values weren't working. Time to go back and fix it.

My solution to that was to check to see if the node that was provided was a valid hive node by checking the chain id that it returned. If that wasn't correct or missing, I forced it to use https://api.hive.blog which is a known hive node(https://github.com/Rishi556/vessel/commit/f67c8fb6a293a34ff9f970d37dc16accd2b54acc). I also removed the functionality to switch to Steem by clicking the hive logo. And that got it working. Anyone updating wouldn't have the problem as they'd get switched over to a hive node.

Then came building it. This time I tried on my linux vm. And I was able to build it. The mac dmg had to be built on a mac because yay apple so I came back to my laptop and built that one. With that, I had all the needed artifacts for most users to be able to run Vessel. Uploaded to github and now it can be found at: https://github.com/Rishi556/vessel/releases/tag/v0.5.0 (@netuoso also released v0.5.0 on his copy, found here https://github.com/netuoso/vessel/releases/tag/v0.5.0, this is different and doesn't include the auto node switch to hive and so if you last used Vessel with a steem/non-hive node selected, it will break and leave you with a white screen).

Building it is definitely the hardest part and so if anyone wants to learn how to do it, I'm including the steps I took. This was on on a Ubuntu 20.04.1 machine.

First lets install nodejs and npm:
sudo apt-get install npm

Then use the latest version on nodejs :
sudo npm i -g n
sudo n latest

Usually you'll need to restart your connection or update the path here so your shell uses the latest version of nodejs. I restart cuz its easier.

Clone the project from git, I'm using my fork here:
git clone https://github.com/rishi556/vessel
cd vessel

Install yarn which will be used to get the dependencies:
sudo npm i -g yarn

Install wine which is needed to make for windows(also for drinking after you mess up building all day):
sudo dpkg --add-architecture i386
wget -nc https://dl.winehq.org/wine-builds/winehq.key
sudo apt-key add winehq.key
sudo add-apt-repository 'deb https://dl.winehq.org/wine-builds/ubuntu/ focal main'
sudo apt update
sudo apt install --install-recommends winehq-stable

Install the dependencies:
yarn install
After a certain point, you'll end up stuck on something that looks like:

gyp ERR! build error 
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/home/hidden/.nvm/versions/node/v14.14.0/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:194:23)
gyp ERR! stack     at ChildProcess.emit (events.js:315:20)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12)
gyp ERR! System Linux 5.4.0-48-generic
gyp ERR! command "/home/hidden/.nvm/versions/node/v14.14.0/bin/node" "/home/drak/.nvm/versions/node/v14.14.0/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /home/hidden/vessel/node_modules/bufferutil

You can just press Control + C to exit out at that point. The modules will be installed.

Run the build command:
npm run build

Install electron-builder which will be used to do the actual building.
sudo npm i -g electron-builder

Use electron-builder to make the package for the platforms you want.
electron-builder -mwl

The -mwl part is for what platforms you want. m is mac, w is windows, l is linux. You can remove which ones you don't need. If you are building for mac, you can't do so on anything other than a mac. If you omit the -mwl part, it will build for your device type only.

Now check for the built packages.
cd releases

You'll see all the things you built. The .exe is for windows, .dmg for mac(remember to do this on a mac) and .deb is for linux. Congrats you have successfully built it.

If doing this on a mac and only targeting mac, you'll need to acquire the required tools from other sources(probably homebrew) and you can't build for windows so you won't need to get wine.

I'd like to thank @foxon for helping me test this and @mahdiyari for explaining what I was doing wrong with the building process. If you would like to support me, consider voting for my witness, @hextech.

Sort:  

What an adventure... sucks that your code wasn't used though. At least yours seems better and less buggy so you can laugh at the plebs with the broken Vessel wallets 😂

I'm real proud of you for dealing with React & Yarn. Thanks for posting in programming.

His also works on linux 🙌