Gitindex banner

Gitindex

9 devlogs
30h 32m 25s

Gitindex is a browser extension that adds the features GitHub forgot.
Hover over any file to instantly trigger actions. See a repo's language breakdown as a pie chart. Open files directly in your IDE without leaving the page. Navigate GitHub like…

Gitindex is a browser extension that adds the features GitHub forgot.
Hover over any file to instantly trigger actions. See a repo’s language breakdown as a pie chart. Open files directly in your IDE without leaving the page. Navigate GitHub like a power user — no page reloads, no friction.
Available on Firefox (Mozilla Add-ons) and Chrome. Actively developed.

Mozilla Addons Page: https://addons.mozilla.org/en-US/firefox/addon/gitindex/
Chrome .crx Release: https://github.com/PokeMatPok/gitindex/releases/tag/v0.1.1

Demo Repository

Loading README...

cskartikey

Tagged your project as well cooked!

🔥 cskartikey marked your project as well cooked! As a prize for your nicely cooked project, look out for a bonus prize in the mail :)

Matthias

Shipped this project!

Hours: 29.15
Cookies: 🍪 662
Multiplier: 22.72 cookies/hr

Ok, so I was annoyed by some things that were just missing on github, soooo….

I built them.
This Project is a chrome extension (probably should work in gecko too, but it is battle tested in chromium), which adds some comfort features to github, which are helpful for navigation and micro-interactions. This project isn’t by any means complete, I am still actively developing it.

About the technical implementation:

  • surviving Github’s SPA nature: probably the hardest part, I needed to assure that everything works even when Github did not load any other page, but rather mutated, so I wrote my own little SPA extension framework, maybe I’m gonna release it separately
  • the injection hell: like putting the hover widgets inside the webcontents, easy, right? The thing was, for every feature, you need to find where you want to inject the widget based on classes and displayed text, inject a styled working widget and maintain it there (Github sometimes overwrites widgets with React)

Anyway, thanks for reading.

Cheers

Matthias

quick actions work now🥳

also I finished everything for shipping and made a quick banner

Attachment
0
Matthias

Progress of the last few hours:

  • imporve building slightly
  • add support for some edge cases (specific navigation)
  • implemented global (shared) react rerender detection

Also am currently adding file hover feature for repos,
this is the interesting part, it gives the user instant value, many actions with configurable favorites instantly callable on hover, check the video below for prototype version.

Cheers

0
Matthias

I added an edit with IDE popup prototype (will be improved), an little mascot next to the github icon, hope you like it, tell me what could be better.

Attachment
Attachment
0
Matthias

What happened in this hour? Much.

I’ve mainly improved build and logging, also now there is a proper build config, you can now turn off logging and all this other useless stuff (it really isn’t useless).

Anyway, not much to show for these changes (you can check the code on github soon), so attached there is a screen recording of my non minified build JS. You’re welcome :)

0
Matthias

Ooff, yeah, did not log for a long time, but hear me out, I’ve used the time to not add one feature, but multiple and I’ve almost rewrite the whole thing.

My problem was, that I couldn’t show the search expansions when the user was on a repo before, as Github is an SPA (single page app, what does that mean?), so you can’t trust chrome (nor firefox) to reliably load new content scripts if the page wasn’t reloaded.

Sooooo, I’ve written my own contentController which simply gets loaded everywhere on github.com/* and it decides for itself if any module should be loaded. It checks for URL changes via polling (running an interval) and mounts/unmounts the modules.

Also the new feature: you can now view a repo’s language stats as a pie chart.

Damn it, I need a 5$ one time payment to release it on the Google Web Store, but there is a license in the flavortown shop (🥳), I’m gonna get that one.

Attachment
Attachment
Attachment
0
Matthias

Popup itself works now, language colors are fetched from linguist and content is fetched from the github api, there are still some performance and rendering issues (I think because they use react).

That’s about it for this hour.

Attachment
0
Matthias

Added the popup and the hover logic, was trickier than you might think 🤔…

Also set up TS env, so I don’t have to code in JS 😨

Well, will be online on github soon, if you find any bugs please contact me on slack, thanks!

Attachment
Attachment
0
Matthias

Building base of this project… - so this is the first devlog🎉

Have build the github api interface in typscript and a really simple ui.

Attachment
0