DEV Community: Yohanes Bandung Bondowoso

Non Null Type Inference After Null Checking in Flutter

Yohanes Bandung Bondowoso — Mon, 08 Nov 2021 14:12:18 +0000

A shorts.

Suppose I make this cool simple widget with sound null safety:

import 'package:flutter/material.dart';

void main() {
  return CoolWidget();
}

class CoolWidget extends StatelessWidget {
  const CoolWidget({
    this.text,
  });

  final String? text;

  @override
  Widget build(BuildContext build) {
    if (text != null) return Text(text);

    return Text('Y U NO GIVE TEXT?');
  }
}

Flutter will get angry and summon this error log:

Error: The argument type 'String?' can't be assigned to the parameter type 'String' because 'String?' is nullable and 'String' isn't.

if (text != null) return Text(text);
                              ^

It is silly that Flutter cannot dictate from the null check text != null not a moment ago, and infer that the text is in fact non-nullable. There is only one possible control flow from that point on!

There is bang operator (! operator) to tell Flutter: “Yeah, I know it is typed as nullable, but I am super duper sure it will not be a null!”

Which sounds dangerous, no? Code changes, maintainer changes, the world is changing. There is a great chance that sometime in the future, a refactor done and the maintainer forget to deal with the bang operator.

Solution

After browsing the internet for a bit, I found that there was a mention in the Dart docs:

The analyzer can’t model the flow of your whole application, so it can’t predict the values of global variables or class fields.

which used to be in this page of docs, but currently not exists.

From that documentation text, implied that non-null inference can be done in a local scope.So if we define new local variable and do null check on that var, Flutter will gladly say: “OK homie, peace out ✌️”.

diff --git a/lib/main.dart b/lib/main.dart
index 96969696..69696969 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -13,7 +13,8 @@ class Cool Widget extends StatelessWidget {

  @override 
  Widget build(BuildContext build) {
-   if (text != null) return Text(text);
+   final String? newText = text;
+   if (newText != null) return Text(newText);

    return Text('Y U NO GIVE TEXT?');
  }

Final code looks like this.

import 'package:flutter/material.dart';

void main() {
  return CoolWidget();
}

class CoolWidget extends StatelessWidget {
  const CoolWidget({
    this.text,
  });

  final String? text;

  @override
  Widget build(BuildContext build) {
    final String? newText = text;
    if (newText != null) return Text(newText);

    return Text('Y U NO GIVE TEXT?');
  }
}

Other Example

It’s not just variable (re)declaration, but passing parameter to a method also works.

For example, this will summon error:

import 'package:flutter/material.dart';

void main() {
  return CoolWidget();
}

class CoolWidget extends StatelessWidget {
  const CoolWidget({
    this.text,
  });

  final String? text;

  @override
  Widget build(BuildContext build) {
    return _buildBuildBuild();
  }

  Widget _buildBuildBuild() {
    if (text != null) return Text(text);

    return Text('Y U NO GIVE TEXT?');    
  }
}

You might have guessed that the solution is to pass the parameter to the private method:

diff --git a/lib/main.dart b/lib/main.dart
index 96969696..69696969 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -19,8 +19,8 @@ Widget build(BuildContext build) {
     return _buildBuildBuild();
   }

-   Widget _buildBuildBuild() {
-     if (text != null) return Text(text);
+   Widget _buildBuildBuild({String? newText}) {
+     if (newText != null) return Text(newText);

      return Text('Y U NO GIVE TEXT?');

Conclusion

I personally like this approach, rather than using the bang operator (! operator).

Will there be performance impact because we declare some new variables? There might be.

Is passing method parameter counts as declaring new variable? I honestly don’t know. Do tell me if you have insights about this 😃

References

Some Apple Scripts for Safari

Yohanes Bandung Bondowoso — Sun, 23 Aug 2020 12:48:48 +0000

Safari Technology Preview is my primary web browser when I am not developing website. It is the beta equivalent for Safari that features the latest updates, including the «Tracker Blocker» that will be released to public on macOS Big Sur.

One of the main losses is the lack of good browser extension to simulate Vim key bindings. Vimari is okay, but it doesn’t work correctly on GitHub. The other losses are the lack of accidental quit prevention and alternative key binding to change tab.

Prevent accidental quit

Firefox and Chrome has option to warn us if we press ⌘ + Q accidentally. Safari doesn’t provide this option. This often happen when I want to close a tab with ⌘ + W, but my clumsy ring finger misses that W. Previously, I use App Shortcuts modifier (System Preferences → Keyboard → Shortcuts → App Shortcuts) and assign it to ⌘ + ⌥ + Q. It works, but I am curious whether there’s another way.

I browsed the internet, and found that John Gruber already shared the solution for this issue. You can read it on this post: Quit Confirmation for Safari on MacOS via DaringFireball.net.

For your convenience, I will share the slightly modified script here:

tell application "Safari Technology Preview"
  set windowCount to count windows
  set tabCount to 0

  repeat with currWindow in every window
    set tabCount to tabCount + (count tabs of currWindow)
  end repeat

  -- Make a string like "1 window containing 3 tabs."
  if windowCount is 1 then
    set msg to windowCount & " window containing " as string
  else
    set msg to windowCount & " windows containing " as string
  end if
  if tabCount is 1 then
    set msg to msg & tabCount & " tab." as string
  else
    set msg to msg & tabCount & " tabs." as string
  end if

  display alert ¬
    "Are you sure you want to quit Safari?" message msg ¬
    buttons {"Cancel", "Quit"} ¬
    giving up after 60
  if button returned of result is "Quit" then quit
end tell

Notice that you might want to change from Safari Technology Preview to only Safari.

You’d want to put the script to Script Editor.app, and —as suggested by John, use FastScripts. FastScripts is awesome! Credits to red sweater. What you should do is move the scripts generated by Script Editor to FastScripts’ folder for Safari and assign your preferred key bindings for it. Obviously you’d want to assign it to ⌘ + Q.

More info on FastScripts, you can check their FAQ here.

Because we’ve covered the issue about quitting, now moving to the next issue.

Alternative key bindings to change tab

The default key bindings to change tab for Safari is ⌃ + ⇥ for Next Tab, and ⌃ + ⇧ + ⇥ for Previous Tab. I’d like to add the already familiar key bindings that exist on Firefox and Chrome, that is ⌘ + ⌥ + ← for Previous Tab and ⌘ + ⌥ + → for Next Tab.

I tried using Mac’s built in App Shortcuts modifier (System Preferences → Keyboard → Shortcuts → App Shortcuts) to modify it, but I’d lose the original key bindings. I want them both to coexist.

My solution is by using the Apple Script and FastScripts too.

Hereby the script to change tab to Next Tab:

tell application "Safari Technology Preview"
  tell window 1
    set myTab to (index of current tab)
    set goodtab to (myTab + 1) as integer
    try
      set current tab to tab goodtab
    on error
      set current tab to tab 1
    end try
  end tell
end tell

and the script to change tab to Previous Tab:

tell application "Safari Technology Preview"
  tell window 1
    set myTab to (index of current tab)
    set goodtab to (myTab - 1) as integer
    if goodtab = 0 then
      tell application "Safari Technology Preview" to set lastTab to the number of tabs in window 1
      set current tab to tab lastTab
    else
      set current tab to tab goodtab
    end if
  end tell
end tell

You’d want to change the Safari Technology Preview too. The scripts are straight forward, one of the advantages of Apple Script’s strange syntax. Let me explain a bit about the try ... on error and if ... else part.

When you use the Next Tab script and reach the last tab, you’d encounter error because the last tab + 1 is nowhere to be found. In that case, we move to the first tab. That’s the expected behavior too, because we’d want the key binding to keep looping on the available tabs.

For the Previous Tab script, it gets a little complicated, because there is no property or method to get the length of available tabs that I know of. So I ask (tell) Safari to define a lastTab variable with the number of available tabs on the active Safari window as its value.

Prior to this day, I never thought that I’d use Apple Scripts and these kind of macOS utility tools helps my day this much. I read Mac Power User, listen to Rosemary Orchard’s podcasts about productivity and automating some tasks, and others. Now I know how awesome the previously overlooked tools is.

Inclusive Content Sharing

Yohanes Bandung Bondowoso — Sun, 28 Jun 2020 09:44:38 +0000

This is a complicated world. Each individuals are different, and there are many factors to consider while interacting with others. People who don't eat pork, or won't eat meat. People who fond of talking about ghost, and the ones easily scared. You must leave the toilet seat closed in some house, in some others opened.

Internet adds to that complexity. For instance you share a cute picture of a snake. There may be someone having Ophidiophobia¹ who will block you. Not because they hate you, but only to get rid of that "horrible picture" of a scary creature.

On Inclusivity

The awareness of inclusivity had spread wider day by day. There is Inclusive Design, which concepts encourage you to think about diversity and accessibility when building products.

Example of diversity: provide more gender dropdown choice knowing some people won't feel comfortable sharing their gender.

Image courtesy of post from Sarah Dopp

Example of accessibility: make your website content recognizable by text-to-speech software for those having difficulties reading. Other example of accessibility: provide certain color scheme on video game's User Interface, for those having difficulties differentiating certain colors.

Content Sharing

Back to the topic of content sharing. I gave you example about sharing picture of animal that some people may find disturbing. That is one thing.

Other thing is to think about individuals that do extra effort to conceal their privacy, even from Google².

What is it about Google? Well, some people believe that accessing Google's domains or endpoints may give off their privacy to that company. The obvious example is using Google Analytics for any website³. That practice may give off visitors' data to Google. Other example is using Google Fonts, or embedding Youtube videos. Extreme example is linking a text to Youtube, like how I did in some of my posts.

Previously, I share Youtube links too

Changed those to Invidious

I replaced the links to Invidio.us though. Hope that helps.

So we talked about disturbing content and privacy. I am also thinking about content availability. The example is sharing great content that some people may not be able to retrieve, because it is hidden behind paywall. The example is some content on Medium, or NYTimes.

I often encounter this on Hacker News, where the linked content is a paywalled post on Medium, or NYTimes. There is a work-around for this, and I know maybe that great content only available on that certain platform.

GIF animation of Medium Paywall, also an irony

I train myself to take some time searching whether that post shared elsewhere and share the alternative link instead.

Conclusion

You cannot please everyone.

The topics I've written are not all. Others may think other factors they find necessary to consider before writing post or sharing links on the internet.

Easier written than said, even more done.

Sometimes I forget about some factors, and I am willing to be stand corrected for that. Thank you for all of you taking your precious time for reminding me. Truly appreciate your good intention.

As a closing statement, this is a complicated world. I can be a simpleton and ignoring all those complexity, but I choose the option I think making this world a more pleasant place to live. For me, and others.

Cheers!

Fear of snake. Even they may feel the fear only by reading the word of that animal. Sorry then :( ↩
Don't trust privacy options → Ali Reza Hayati boldly written about how some companies may use your private informations for scary things. Not now, maybe, but might be in the future. ↩
A more privacy-friendly blog → This is a great post by Vincent Bernat listing privacy friendly alternatives for tools oft used on website. ↩

Org-mode with Org-roam

Yohanes Bandung Bondowoso — Sat, 27 Jun 2020 16:05:28 +0000

On a late night some twenty or more days ago, my friend Juang contacted me on Discord.

On Wed, Jun 03, 2020 at 01.20 AM @broerjuang wrote:

Dung

On Wed, Jun 03, 2020 at 01.20 AM @ybbond wrote:

ju

On Wed, Jun 03, 2020 at 01.20 AM @broerjuang wrote:

https://github.com/org-roam/org-roam

lol

He knew about me ranting on Twitter two days earlier for not getting invitation to try Roam Research. He is also a fellow Vimmer¹, and I think he knew that I will think twice before using Emacs. I decided to to try it today.

The Steps

First, I installed Emacs. If you are on macOS, it is highly recommended to use emacs-plus:

brew tap d12frosted/emacs-plus

brew install emacs-plus --with-modern-icon-cg433n

ln -s /usr/local/opt/emacs-plus/Emacs.app /Applications/Emacs.app

Then install Doom Emacs:

git clone https://github.com/hlissner/doom-emacs ~/.emacs.d

~/.emacs.d/bin/doom install

I know from experience that I should try the vanilla version of any software before modding it. For Emacs, I have known its basic navigation key bindings. I even use the basic C-b, C-f, C-n, C-p, C-a and C-e instead of arrow keys to navigate most text editor that don’t support Vim key bindings. Even you can use Emacs bindings for the form in the internet with Web Browser. Doom Emacs use Evil mode key bindings by default, that means Vim-like key binding is usable from the start.

I make myself comfortable with Doom Emacs for an hour, then installing Org-roam. With Doom Emacs, Org-mode is installed by default and I can add +roam flag in init.el to install Org-roam. You can also follow the main installation method from the docs.

I also installed the recommended packages deft and org-journal. The former is a tool to open any file by searching its title or content text. The later is a complementary framework to make a good timeline based journaling à la Roam Research. With the tool ready, I try making a daily journal with the shortcut C-c n j.

The Matter of Personal Preferences

Evil mode is actually an acronym for Extensible Vi Layer. Its key bindings really makes me feel at home, but it still has some quirks. My first problem is with soft wrapped text. I mapped gj and gk to replace default j and k in Vim, it enables per visual line movement on wrapped text, instead of per line number. evil-mode provides evil-respect-visual-line-mode option, but it doesn’t work in the case of delete whole line with dd command. With that option enabled, dd will only delete the current visual line. I installed evil-better-visual-line that try to solve this issue. There is still some quirks, but better than before.

My second problem is clipboard management. I expect a Vim-like environment to not mess with my system clipboard each time I delete, yank or change any text with Vim key bindings. I want the editor to use its internal register for Vim commands, and only use clipboard if I explicitly use ⌘+c and ⌘+v. For this issue, I asked on Doom Emacs’ discord channel, and got the solution from this this guide.

A newbie Emacs user, I configure with Org-roam’s maintainer’s dotfiles as reference. You can see my Doom Emacs configuration files on my dotfiles repo.

Moving from FSNotes

I use FSNotes to keep my notes. It is a great program inspired by nvALT and created by a single person (check out the Patreon page!). It features wiki linking and I’ve tried using Zettelkasten paradigm, even though not too successful. I have 300+ good Markdown files in it, guides, personal notes, quotes from internet, many topics.

My next move after creating journal with Org-roam is… migrating the Markdown files to Org files. I migrated 2 files at first, then compared between my notes on Org-roam with the one in FSNotes. I actually liked the interface of FSNotes, but the automatic back links, and the Vim bindings… I went “what the hell” and migrated all of those 300+ Markdown files. It took around 2 hours of my afternoon, but I enjoy it.

There is still issue though.

The Org as in Mode and File Extension

I like to do things on my Macbook Pro. I even bring the laptop everywhere. I use it like anyone else use smartphone, as communication tool, scrolling social medias², read articles and news. But I’d still like to be able to see my notes on my iPhone or iPad, and this weird *.org file format hindered me on doing so.

FSNotes has iOS app that synchronizes instantly. Looking on the App Store, Reddit and DuckDuckGo, I only find this app called Beorg. By itself, Beorg is a good TODO and Agenda manager based on Org-mode. It won’t accept *.org file outside its iCloud directory, so no go. Other alternative is to install terminal emulator app and Emacs within, but it won’t be a pleasant touch experience.

Org-mode has a weird syntax to display verbatim text and it doesn’t have syntax for displaying inline code or block code. As a programmer that often store note related to coding, I think this is a minus.

Thinking long and far, I decided to keep using Org-roam, while waiting to find a good iOS app that allow me to read my notes. Maybe it’s time to make my own iOS application that does just that? Interesting.

Conclusion

Let’s stop worrying and start loving ~~Emacs~~ Org-mode! It is overall a good framework to store notes, add Org-roam and it became many times better! Don’t worry, (Neo)Vim is still my daily driver.

Not sure if this is even a word, but you know… A Vim user? ↩
Even though I try to use social media as minimum as possible. ↩

Remove Specific Files from Old Git Commit

Yohanes Bandung Bondowoso — Sat, 20 Jun 2020 10:44:20 +0000

tldr; Skip to solution »

Last week, I encountered a merge conflict while trying to sync my git working branch to latest remote master. Merge conflicts is not a serious problem to me, I am used to resolving conflicts. But the conflict that I encountered is from an auto generated typings file from Apollo Codegen¹.

Apollo Codegen file is Flow or TypeScript typings for the schema and queries in project that uses GraphQL. The generated file often has >10k lines of code. Trying to resolve conflict in that file will make the text editor unresponsive (even with Vim!).

So I aborted the sync master (git rebase --abort), then attempt to remove the changes for the auto-generated codegen file using lazygit. Afterwards, I do sync remote master branch and the conflict don't happen. Last thing I do is regenerate the codegen file before posting a Pull Request.

How-Tos

Back to the post's main topic, to remove specific file using plain old shell command.

First, checkout to temporary branch with the afore mentioned commit as HEAD using the commit's hash:

git checkout <commit-hash>

Then do a soft reset to uncommit with all files in staged status:

git reset --soft HEAD^

Make the desired file(s) unstaged using reset command, and then commit with -c ORIG_HEAD flag to use the previous commit message. The --no-edit flag is optional.

git reset <path/to/file>

git commit -c ORIG_HEAD --no-edit

Discard the changes of the file you want to remove from unstaged area:

git checkout -- .

Last, rebase this temporary branch to your branch, from the commit of <commit-hash>.

git rebase --onto HEAD <commit-hash> <destination-branch-name>

If you do this for already merged Pull Request, you need to push <remote> <branch> --force. Mind you, doing this will be inconvenient for other people working on same project.

Lazygit Way

As I mentioned above, I use lazygit. The process is more straight forward. For the following example, I accidentally committed build file, far before I .gitignored build/ folder. What I do is:

Navigate to desired commit

Press return key, and navigate to file to be removed

Press x will prompt command list. Turns out d will discard the file

After pressing d, the Index.js file is now removed!

Do this way if you want to install lazygit before doing your intention.

lazygit way is easier. I also use tig as a TUI for git, but I don't know the command to do the steps wit tig.

Here is Apollo Codegen Github page. As a frontend engineer, I consider codegen as breakthrough because I can easily type the endpoint's return value. ↩

About GoatCounter, The Web Analytics I Use

Yohanes Bandung Bondowoso — Fri, 22 May 2020 17:47:36 +0000

I like to develop website. I also like to write blogs, poems, post mortem, thoughts, tutorial, anything. I enjoy doing those things that even if I cannot publish (some of) them, I've got more experience and I feel good.

But.

Let's be real here. I have itches. Curiosity. Social needs? Maybe, but I try avoid social media, or silo — as the IndieWeb folks call it. I try to serve this site keeping my ethic¹ and readers' privacy. I also want to know whether anyone read my posts, and I want my works to be assessed by fellow readers. The assessment can be as simple as likes and thumb-ups (Luke Smith hilariously calls them upcummies²). The assessment can also be comments or text feedbacks, this is what I prefer the most.

With the stuff I just told you in mind, I decided that I will implement analytic³ and response system to this site. So I researched for the tools. The main requirements are lightweight and respects users' privacy.

For the response system, I found WebMention, which leads me to know more about IndieWeb. The current candidate for the direct commenting system is Isso. The first I implemented is web analytics. Already suggested in this post's title, I use GoatCounter.

About GoatCounter

GoatCounter is web analytics by Martin Tournoij or arp242. It is lightweight, it is easy to implement, and it respects users' privacy. See its privacy policy here.

One embarassing thing is that I follow Martin's RSS Feed for so long, but I didn't read about his latest project. Before GoatCounter, I tried StatCounter and opted-out shortly because I think the settings page is clumsy. I searched for another good alternatives that results none. Just last monday I see Martin published a new post about GoatCounter update. I decided to check it and that day, I tried GoatCounter.

You can see my instance of GoatCounter on stats.ybbond.dev!

I made it open for everyone and set obvious statement down in the footer of my website, because I think however small the data I take from user visits, the users should be able to know about it.

A good post from iA, "Ethics" and Ethics by Oliver Reichenstein. Read it here on their site. ↩
Reference is from video Social Media: Anything for Upcummies! ⬆🍆💦💦 by Luke Smith. You can watch it here on YouTube. ↩
I even stated in my post about migrating to Hugo that I will implement tracker. ↩

Why I Positioned Sidebar to the Right

Yohanes Bandung Bondowoso — Mon, 27 Apr 2020 04:57:12 +0000

A few minutes ago, I opened twitter and scrolled the timeline.

Simon Sturmer

@sstur_

@rstacruz This is 🔥
(I love that you have the tree on the right side. @ybbond_ told me to do this a long time ago 🤣)

19:28 PM - 26 Apr 2020

I laughed when I read that tweet. It brings back so much memories of my previous workplace.

Positioning the sidebar to the right reduces distraction when I toggle it. If the sidebar is on the left, the text shifts around whenever the sidebar is toggled on or off. Readjusting my eyes for the moved text creates disturbance to my logical thinking. “Why are you not just leave the sidebar open?", you might be asking. I want to keep the screen real estate wide.

Back then, I often toggle the sidebar because two reasons. First, the project I was working on uses Redux - Saga. Second, I used to use VSCode.

Redux-Saga is a great states and IO management for React, I was blown away when I was first using it. Sadly, cannot grok the Redux paradigm easily. I often need to see the file structure when I write new files or refactoring. My current project uses Apollo GraphQL and Domain Driven Development paradigm. I am comfortable using the current setup.

In VSCode, manipulating file must be done with mouse. Using the built in Git also done in the sidebar, with mouse. Nowadays I use NeoVim. File management can be done easily with text command. If a more complex file management must be done, which is rare, I use NerdTree. Versioning with Git is done with the help of vim-fugitive which I found less disturbing.

As a closing: if you often toggle the sidebar, try positioning it to the right. That is, if your editor supports that configuration. It might help reduce the distraction when you need it the most.