Rust is new to me, but I’m using egui to get some clean, fast UI with simple code. This is all I’ve got so far, and I’ve spent quite a bit of time theming it!

I added a quick option to change the default view of filament lists. I’m surprised I forgot to implement this before shipping!!
I also fixed a MAJOR bug that would make the individual filament pages not display any prints! I didn’t know about this until someone sent in a slightly confusing feedback request.
I ALSO forgot to make analytics turn off while you self-host, and I took the opportunity to add some custom analytics events also!

The day has come!!! The overhaul has officially released!!
Before I started, I added some analytics with Swetrix instead of Rybbit, since it seems to work better.
The transfer took a little over 6 minutes with ZERO errors on the first try!
I didn’t run into any major issues while integrating, but there was one error with Docker that no one has ever gotten and no one could reproduce. Luckily it was a one time thing.
Anyway, with everything implemented, it is super quick!! I was hearing constant complaints of slow loading on the old Filatrack, which was entirely true.
And now it is finally time to ship!

I’ve officially finished everything on my pre-ship todo list!!! The last items were a privacy policy update notifier, and a fallback profile picture. That’s about it until release!

Someone was having trouble setting up OAuth for their selfhosted instance and suggested I set up proper credentials authentication, which I did! In addition, the login UI now responds to what login options are set in the Pocketbase instance. For the official release, I won’t be using email/password because I would want to implement email confirmation, which I can technically do, but the email service I use only allows 150 emails/day. I don’t want to prevent anyone from signing up, so I’m not gonna enable it. I also had to implement reset password/sign up pages, which was quite simple with Pocketbase.
I also added some detailed self hosting documentation as it does get a bit more complex than I explained it as.

The user transfer script works beautifully!! It’s a simple typescript script that reads a Postgres database (I just loaded a dump file from the real database) and translates all the data into pocketbase requests! Pocketbase luckily has a bulk request function so I can make all the filament/storage/prints in one go. And of course, it’s very quick. I saw a lot of users in the database with no filament, storages, or prints so I discarded those users to save time and resources, since they won’t be losing anything. Out of 1,113 user records, 667 (don’t laugh) ended up being transferred. This only took a little over 2 minutes as well!
I took a lot of liberty in making effective logging for this, as if any record failed to add, I wanted to know why. I set it so if any record failed to add in the importUser function, then it would stop importing that user and move on, since if one record failed to add, it may cause related records to also fail. It took a little bit to get the error count down to 0, but when I did, it was very satisfying!
One thing I was worried about when I tried logging in was if OAuth would recognize what account I was trying to log in to. Luckily, it worked like a charm and as long as you use the same email, it lets you in!
I set the release date for the overhaul to be the 11th, and announced that in the community. They were all very excited, as am I, and that’s when I’ll be shipping this project! (at least for the first time)
All of this was tested on my hardware, but when I go to ship, I’ll take a fresh dump of the database while in maintenance mode so no one can modify it, run the transfer, do a little internal testing, and open up the overhaul to the public!
Attached is an image of all my filament, as well as the console when it finished running.

Filatrack is officially self-hostable!! The Next.JS side of it uses less than 100mb of RAM idle which is incredible. Pocketbase uses less than 50mb and hardly any CPU as well, which is part of the reason I switched!!
All that is left before shipping is making the transfer script and a last sweep to check for bugs!

I’m so happy with how this project has come together and I can’t wait for the community to see the changes so far!!

Made a couple fixes here in there, including fixing the landing page on mobile (i forgot), adding fallback screens to all the main pages, etc. Next up is making this self-hostable and documenting it well! I also updated the primary app example image in the repo.

Mobile support is done (for the most part)! Filatrack is absolutely desktop-first design since it is intended to be a desktop app. It doesn’t look/work as good on mobile but it is still absolutely usable.
I had one stupid bug that probably took an hour to debug, where the login buttons just did not work. Their onClick listeners just didn’t fire at all. I thought it was pocketbase at first not cooperating, but it turns out Next.JS doesn’t like it when someone connects to the dev server from a non-localhost IP, which is super dumb but it was just a configuration issue. Once I caught that I tested everything and everything worked surprisingly well for not even testing anything on mobile!

You can now edit your avatar! This isn’t very useful right now but there will be ways to see other users in the future so I decided I should add it. Luckily pocketbase makes file handling super simple!

Ok more interesting devlog!! I finally added being able to change what is shown on filament cards/tables!! This one was a huge change to existing code (not very pretty unfortunately), and took quite a bit of changes. Originally, it was just a single list of keys that could be displayed for both the table and cards. The table however has a lot more room for data and I can see people wanting to display more/different data on the table over the cards, so I split it in two! All the keys are reorderable, obviously.
Attached is an image of the options, and an image of what happens when you turn on every key.

Once again, very boring devlog. I added a quick feedback page using the same Web3Forms as the contact page, and made some organization and GDPR compliance updates to the privacy policy, as well as a quick bug fix for empty filament rolls.
Yes, I am procrastinating the hard stuff.

Pretty boring devlog: I added relevant buttons to the filament page that are usually in the context menu. I don’t know why I didn’t add these when I first implemented the page lmao
It was fairly easy, since all the modals are their own components I just had to import them all and make the buttons open them

You can now download QR codes! If there’s multiple, it even zips them up for you!
It wasn’t very hard as there’s a really good library called JSZip that does all the hard work. At first I tried messing with zip.js but it was far too complicated and required a lot of setup I couldn’t do.
That’s basically QR codes done! I can’t really think of anything else to add to this. I’ve only got a couple of things down on my todo list until we’re ready to deploy! Unfortunately those couple things are going to take a long time

Default QR code options! This took surprisingly more tinkering than adding bulk QR codes… Don’t look at the code for the modal anymore :fear:
ANYWAY there’s a bunch more features coming up and a whole lot more work!

Bulk printing QR codes! Very useful to print a whole batch of QR codes at once for your whole filament collection! Was actually pretty easy to modify the code to allow for multiple at once. Instead of opening the image in a new tab, it opens a new about:blank tab and appends all the images to it.

QR scanner done! That was surprisingly simple actually, as there is a really good library called qr-scanner that gets the job done perfectly! The QR codes are still scannable to phone cameras and whatnot as all it stores is a link to filatrack, and that’s what the in-app scanner reads as well.

QR codes are printable! You get to choose between a PNG or SVG (will include PDF soon), but the preview image dynamically updates with the options you have selected as well as expands when there are too many options! You can also reorder them however you wish.
I’ll also be adding settings for changing the default fields displayed, maybe a couple additional settings to change what is on the QR code as well.
Up next though is an in-app scanner for QR codes as it’s been requested!

This devlog is a bit longer than usual because of the Hackatime downtime! (hehe that rhymes)
Anyway, I’ll rapid fire a couple things I changed/fixed!

• Added an “advanced view” option in settings that shows IDs
• Fixed the landing background causing performance issues in the app somehow
• Started implementing QR codes!
  ^ On that note, I’ve made a route that generated an SVG QR code tag based on settings you pass into the query parameters. It wasn’t that hard luckily just using node-canvas. Just have to make them printable!

Taking a little break but I still implemented account settings, mostly just username editing and account deletion. I also added a couple special tags for users as there will be features soon that will show other user profiles.
Filament presets also actually work now! You can select the preset you want to use when creating filament and it will fill in all the values.

Bulk moving filament! Didn’t require as much work as I thought it would luckily. The whole database operation is performed mildly inefficiently, as moving filament requires 2-3 api requests, and with how Pocketbase works, if you make multiple requests to the same endpoint at the same time, one or both get autocancelled (I may be misunderstanding pocketbase a little, but that is what happened in testing). The best way to get it to work was to just move one filament at a time, with the already-implemented moveFilament function. I just set up a for loop to loop through all of the selected filament, call moveFilament for that filament, and move to the next one. Eventually, all the filament has moved!
I’m not too worried about request volume, as the server I plan on hosting pocketbase on has plenty of resources to handle it, and I plan on limiting how many you can move at a time. Additionally, it is still wicked fast in testing. Pocketbase is amazing, it is super efficient and quick and I’m so glad I chose it for this overhaul.

I readded the search/sort bar! Been missing this one for a bit. Just a very simple way of sorting your filament (defaults to sorting by name), and search works as you’d expect.

I just added bulk deleting!! Just a simple edit button in each filament list that takes you to the table view to select multiple filament to delete. I might add bulk editing, but that sounds like it would require a significant amount of tweaking to make work. It isn’t a feature that I see a lot of people using, so I’ll hold off on it for now. However, I will probably add bulk moving between storages.
I also went through almost every component I have and turned the ones with really long props types into their own type definitions to allow for readability and cleanliness.

Tracked down some stupid bugs! It took forever cause my code may or may not be a little bit of a mess. The whole reason for this overhaul was a better codebase to work off of, so clearly I have some work to do!
Anyway, I also finally added storage editing! (it seems putting things off is quite a trend), it wasn’t crazy hard but made some interesting bugs that I went and fixed. Attached video shows one, comment your best guess for why this happened!

I added a small dropdown to change what storage a filament is when when you create it instead of moving it in after it’s created! This took WAY too much tinkering with existing code, but it’s functional. I also added little messages when there is nothing to display on many of the pages!

Filament presets are finally in the works! I ended up doing a complete overhaul of how settings are handled– it used to be another table in the database, but it ended up being clunky and not working well at all. I moved all the columns I actually needed just into the users table, which works just fine since there aren’t that many.
I also overhauled editing filament already, since that modal used an entirely new component which wasn’t necessary, as it was almost identical to the create modal, so I combined them.
The next step is to actually be able to create filament with the presets, which should be pretty easy!

You can finally edit filament! I’ve been putting this off for far too long, and it was actually a very simple feature to implement since I already had all the boilerplate set up for it!

Quick little devlog: Added filament previews to the prints list! Very helpful for quickly seeing what filament was used in a print. I also spent a little time implementing a nice (radix ui) hover card that I can use in other places as well.

Starting work on filament presets! I’ve been messing around with how I want to structure this, cause there isn’t a perfect way to do it. I ended up making a new table in the database for them that is almost identical to the filament table. The modal is also a copy and paste of the create filament modal, simply to make my life easier and keep my component’s code clean.

Worked on a couple more pages so I could get a break from adding features! There’s now a support page and a contact page. I also made some much-needed changes to handling lists of objects in the code (modifying/deleting from them was a pain), as well as fixing up some types and making storage live update when you add/delete them!

The dashboard is now functional! All your storages will show up alongside recently updated filament, and you can browse all of your filament at the bottom.
There’s also a pie chart at the top that can display all your colors of filament, brand, or material!

We’re getting close to finishing, only a couple more features and some polishing!

Not a very interesting devlog, but I finally figured out how to get the text on these cards to truncate properly. CSS is really dumb when it comes to this, and I’ve been hacking at a solution for forever but it finally worked as expected! (Even the details can do it too!)

You can now set a maximum capacity for storages! Perfect for representing an AMS or storage rack that can hold a specific amount of filament. This required a stupid amount of tinkering the existing system, but the final product looks really good and works very well! It prevents you from moving filament into a storage that is full, until you take one out.
It also gets a little messy when it comes to moving a filament roll from one storage to another, which requires another database query.

Storage now works, including moving filament to/from/out of different storages!! This took a surprising amount of tinkering with existing code to get working.
I also made some more hidden changes that make errors more verbose to the user and to me, as well as cleaning up a couple bugs and UI quirks.

You can now create prints! It will automatically change the amount of filament you have left for easy tracking and you can use more than one roll at a time!

Worked on a lot more UI, it’s looking really good so far! Many aspects of this UI will be customizable, and I’m just focusing on the frontend until that is all figured out.

I’ve been working on more backend. Not much else to say but I can’t stop playing with how fast the pages load. Pocketbase is REALLY fast!

I also found the library holy-loader that makes a nice loading bar on the top of the screen without any fuss.

Ideas and basic UI

My idea from this project stemmed from my loss of motivation to do… really anything. I’m designing this app in a way that helps me do my work with rewards.

I named it neptune for no reason in particular, other than space is cool and also happens to be good for flavortown.

Below is the basic UI I have designed so far!

I’m working on a complete overhaul from the ground up of my app from Summer of Making!

I and many users noticed how slow Filatrack was originally, and the codebase was a complete mess. I don’t want to touch that one anymore and figured it would be best for everyone if I redid the whole thing.
I decided to scrap the old Next.JS backend and decouple it into a self-hosted pocketbase instance. This will end up being a good decision as it removes any limits I had on supabase and gives me full control.
Anyway, this is the new UI. It is so much nicer than before, way more snappy as well and fluid, and there’s a table view now!
I’ve just gotten started implementing the backend, which will take the majority of the time to make sure everything is secure.
(this devlog has a lot of time cause I worked on this quite a bit before putting it on flavortown!)