feat(filesLimit): handle if user goes over size limit

[josephmcg]

What this PR does 📖

• add getter to calculate the total size of all tracked files
• update files aside to track your files usage (amount and progress bar)
• prevent further uploads if you're out of room

Which issue(s) this PR fixes 🔨
AP-899, AP-910

Special notes for reviewers 🗒️

• Originally wanted to use a computed for the progress bar, but it would cause an infinite render issue. opted for watch instead

Additional comments 🎤

[netlify]

✔️ Yeeeehaw, deploy preview is ready!

🔨 Explore the source changes: b30eb44

🔍 Inspect the deploy log: https://app.netlify.com/sites/adoring-edison-dbcef8/deploys/6221654ce037ea0008906923

😎 Browse the preview: https://deploy-preview-1715--adoring-edison-dbcef8.netlify.app

[KemoPaw]

Very cool to see the progress bar updating upon file uploads! 🎉 Sadly do not currently have a 4GB file to test for if a user can continue to upload past that point.

[josephmcg]

I didn't either, I tested it by changing the limit to a smaller number

[phillsatellite]

Tested: works really well, the only bug I was able to find is if a user has stuff uploaded and the refresh they're page, all the files will still be there but the progress bar will be empty until a user uploads another file

refresh.files.mov

[stavares843]

/rebase

[josephmcg]

@phillsatellite Thanks Phil! should be fixed now

[stavares843]

thanks @josephmcg 🔨

[josephmcg]

@stavares843 I noticed something I need to fix here, will cause bugs after file type support gets merged

[josephmcg]

ok, now its good

[stavares843]

thanks 💥

[stavares843]

/rebase

[josephmcg]

• 4GB is 4e+9 bytes. A few bytes won't 'move the needle', so to speak. I'm not sure what the threshold is for a visible indication on <progress>. We could potentially add Math.ceil to it if you'd like to always see a bar, but that may have unintended results past 1%.
• What should the threshold be for turning the text red? >80% filled?
• I've never tried uploading several GB at once, I'll look into that

[stavares843]

that's true!

maybe we could ask Liz about the 2 first questions as they are more UI/UX related

[josephmcg]

@stavares843 issues above should be fixed. I was setting the loading state after checking filesize. It was working correctly in your video, it just takes a LONG time for files that large
It seems like the filesize package we're using changed their default byte base from 2 to 10. I added some config to change it to 2 again, now numbers should be more accurate

[josephmcg]

Do we want to display in terms of decimal or binary? Before, we were using binary for calculations, but using the decimal labels.
https://en.wikipedia.org/wiki/Byte#Multiple-byte_units

[stavares843]

thanks @josephmcg

we could ask if there's any preference, either decimal or binary

[phillsatellite]

@josephmcg hello!! Last little problem I found on this branch, after updates MB and GB changed to MiB and GiB

[josephmcg]

yes, they were using binary. just switched it to decimal