would you look at that, 10h… i love wasting time. Now THIS thing fetches some bits of data like the audit log, my passkeys, adding those and even modifying the username (you are forced to do it)!

BUT big buty, i had to add the mr /signup/complete where you set your prefered username, like moon (its a me!), or else the backend will straight up refuse anything you want to do. AFTER changing it, you can do everything else a normal user can [by Default the username is just the user’s email AND THAT IS NOT PRETTY AT ALL >:(]

FIRST OF all i grabbed my magic cup for tea and made the audit log page (it does not even have anything special)! .. oh right, for that i needed to know how the heck you even send requests with tanstack. so uhh,, blah bleh bluh wawa BOOM i now know how to call a method and get my data back AAnd even make infinite fetchers (IT kinda hates my way of giving data [its wrapped in {3} onion layers {request.data.data.data}, the ones that make you cry a bit]).

i also synced my auth state with the tanstack client so it doesnt do two trips every time.

okay now. TO make the audit log thingy, i did some beautiful matching so the type, creation and guy who did the action (probably the user) are actually human readable with a limit of 8 items (or else the /me page would be as long as this project’s crappy devlogs). When there’s more, a beautiful “view more” button appears (separate page).

For this, so called “view more” page, i used the infinite queries. while at first i just puuushed the data into the dom with the #each (svelte thingy), chrome do be VERY very mad when there’s a lot of entries in there (The audit log, because it logs actions in your account, can get very huge. Because actions like the baddie Session action logs each time you log in or log out), SOO i did what someone whose browser is eating more than 10gb does, using a virtual list to render the it! (IT only renders items when they are visible, hidding [removing from the dom] non visible ones. this fixes the “OH gosh THOSE 200 things THAT I CANT EVEN SEE, ARE EATING MY precious ram”). OHh and you can press ESC to leave the page because i made a cool component that lets me plug in a callback for specific keyboard events :D.

SECOND, the passkey stuff. yeah, pretty easy thanks to libraries like SimpleWebAuthn that do the hard work of telling the browser “hey, authenticate this guy please” or “hiya, registrate this passkey please”. its just querying what passkys you have to know… hwat passkeys you have and that’s it.

BUT sadly, an actually sadly, my passkeys are non resident (I cant have a simple button to just login, I need you email before i can use the passkey). Thaaat means I havea teeny big tiny small user enumaration problemo becuase the backend can reveal that an user has a passkey registered and, in turn, we know that user is registered. a bad guy can just atack with “oh noes, your passkey has been stolen. pls give a undecillion of moneys”.

third, i had to add the sudo page. It does what you think, reauthenticate to do sensitive operations like adding a passkey. Pretty simple, it redirects directly to an email code if the user does not have a passkey or totp enabled (email code is always enabled), if they have those, it just shows a selection screen.

fourth, i had to fix up some stupid things with the api schema of the backend becuase I either forgot to put a body on the responses (like the passkey/webauthn routes) or just fix up a teeeeeny tiny setting thing that wasnt correct (its the webauthn/passkey rp_origin [allowed pages to register/use a passkey} becuase it jsut used the backend url and THAT is not correct).

so tahat’s it, shall you see some stupid screenshots and not even a video because i havent even finished everything: