TMWL October’19 — Scala Steward, DB index and a React hack

This time Michał, Adam and Piotr have shared their discoveries from October:

• why Scala Steward is great and how to use it in private repos
• how not to lock your table when creating DB index
• a neat solution to prevent the user from leaving a particular subroute of our application written in React

Michał Matłoka — Senior Software Engineer

My first time with Scala Steward

This month I’ve used Scala Steward for the first time… and it’s great! How do you update dependencies in your projects? New versions appear, bugs and security issues are being fixed. So far I was using the sbt-updates plugin, which just lists what he new versions for each of the project dependencies are. Scala Steward goes one step ahead. For configured repositories it checks the dependencies updates and… automatically creates PRs for each of them (so CI can verify if everything works)! What is more it can apply even scalafix migrations!

So how to use it for private repos?

1. First clone the Scala Steward repository
2. Update the repos.md file
3. If you want to use it with private repositories, then create e.g. for GitHub a Personal Access Token. Create script which returns this token to stdout, e.g. login.sh with content echo my-key
4. Run the build with sbt stage
5. export STEWARD_DIR=repo_location
6. Run the Scala Steward with the following command

./modules/core/.jvm/target/universal/stage/bin/scala-steward \
  --workspace  "$STEWARD_DIR/workspace" \  
  --repos-file "$STEWARD_DIR/repos.md" \ 
  --git-author-email your-email@example.com \   
  --do-not-fork \ 
  --vcs-api-host "https://api.github.com" \   
  --vcs-login your-github-login \ 
  --git-ask-pass "$STEWARD_DIR/login.sh"

And that’s all. Expect PRs to appear on your repo shortly. Of course in next step you may want to integrate this with your CI flow, which sounds quite good.

Adam Smolarek — Senior Software Engineer

How not to lock your table when creating DB index

So let’s say that you created a few tables when the project started. After that, you added a few columns, and it was ok. But after a while, it looks like queries are slow. So what can you do?

Maybe add an index on some column? Yes, it may help. But there is an issue when you do:

create index index_name on table(column);

It will lock the table until it finishes creating the index.

That is bad for applications with strict SLA that have to be always online, or at least some instances have to be online and be able to write to DB.

So what can you do?

It turns out that in some databases like PostgreSQL, there is an easy solution for that:

create index concurrently index_name on table(column);

Yes, that’s it. This will switch the default behavior of the locking table and will create the index in parallel to standard operations that your app is doing on the DB.

This month I also finished a new book by Nassim Nicholas Taleb, The Black Swan: The Impact of the Highly Improbable. As the title suggests it is about probability, and how we under or overestimate almost everything. There are references to human mind explaining why it is making predictions even when nobody is asking for them. You will also find many practices that you can apply in your daily job when working on project or task estimates.

Photo by Road Trip with Raj on Unsplash

Piotr Majcher — Frontend Developer

How to show the prompt based on the destination location in React

Preventing the user from leaving a particular screen because of unsaved changes or any other reason is quite a trivial task in React. The react-router library provides us with a handy <Prompt /> component that handles the browser’s built-in prompt. Using it is so simple that even though I have used it a lot of times before, I’ve never bothered to have a look into the documentation. The standard case that I would normally use it for looks like this:

I would normally have some form component in which I would have an access to the form’s state and show the prompt only when user wants to leave the page while there are still some unsaved changes. It is easy and straightforward but does not cover all the cases.

Recently I was implementing a wizard form where each step of the form was under /form/:stepName and the last page was /summary. The problem however was that the form had to be saved and sent to the backend before entering /summary and I wanted to prevent a situation where someone would jump to the summary before completing all the necessary steps. Therefore the idea was to allow the user to move freely within the /form/* routes and show the prompt in case they want to wander off.

Clearly, the first thing that comes to one’s mind is: “I need to somehow detect where the user is heading to!”, but because I’ve never checked the documentation of the Prompt component and I had used it already so many times before, I got a bit trapped in my standard way of thinking about it. After a short time of frustration I discovered that the message prop does not only take in a simple string (what the name would suggest actually), but can also accept a function. It turns out that a location object is passed to it and it contains the pathname to which the user is trying to navigate. That’s a really convenient and powerful solution, the only thing we need to do is return true if the user is allowed to navigate or a string containing the prompt message.

So this is it, a neat solution to prevent the user from leaving a particular subroute of our application. Lesson learned for me — RTFM ;) Could have saved myself a bit of unnecessary effort.

And what have you learned in October? Let us know! :)

BTW, we are always looking for outstanding professionals to join our team! Check out backend and frontend open positions!

Questions? Ask us anything about remote work, how does the cooperation with us look like, what projects do we have, or about anything else - on the dedicated Slack channel 💡