This is a work in progress (WIP) browser extension that signals a blue butterfly icon, if the domain of the webpage you're actively browsing is on Bluesky. Otherwise, it signals the icon of a gray butterfly outline for the pages that aren't.
Clicking the butterfly will activate the extension's popup page. If the butterfly signal icon is blue/active, the popup will present you with a minified version of that websites Bluesky profile, with links that will take you to their bsky profile page. Otherwise, when the butterfly is dormant/inactive/an outline, the popup will simply inform you that the domain of the page you're currently on, doesn't have a profile on Bluesky.
The popup uses Svelte, while the logic is written with a combo of TypeScript (for data fetching, browser APIs, state management, etc.) and Rust (to handle data transformations/factory tasks). The latter is compiled into Web Assembly prior to building the extension.
This project is currently at the early-experimental prototype stage. As such, you'll have to compile the extension yourself, and load the unpacked './extension/dist' into a chromium browser with "Developer Mode" enabled. Pre-compiled binaries will be made available for distribution the minute core features are implemented and semi-polished.
To compile the project, see the contributing prequisites down below for the necessary libraries, then run the following:
❯ wasm-pack build ./crates/data_factory -t bundler --scope butterfly-signal
❯ cd ./extension
❯ bun i
❯ bun run build
You can also one-line-it for convenience:
❯ wasm-pack build ./crates/data_factory -t bundler --scope butterfly-signal && cd ./extension && bun i && bun run build
The above will generate a unpacked ./dist you can load into a Chromium based browser.
I liked @bradgessler's idea so much, I wanted to bring it to life.
I've been learning Rust recently, and wanted to create something that would bring me full circle to my focus on Web development. Wasm was the perfect bridge for me to do that. So, while the little data_factory crate is arguably a wee bit of an over-optimization step for this project, it's primary goal is educational (for myself), which (so far) it's excelled at.
- Chromium Compatibility (WIP)
- Firefox Compatibility
- Safari Compatibility
- Install the Nix package manager (if you're not already using NixOS or NixOS-WSL).
- Fork this repo
- Run
nix develop
to immediately have access to all the same libraries/versions. - After you've made some changes, create a pull request to merge your changes into master. In the description, be sure to detail what you've changed or added, as well as your motivation for doing so.
- Install required libraries into your environment:
- Rust: rustc, rustup, cargo, and wasm-pack
- JS: nodejs, bun.sh
- Fork this repo
- After you've made some changes, create a pull request to merge your changes into master. In the description, be sure to detail what you've changed or added, as well as your motivation for doing so.