This is a submission for the The Pinata Challenge
What I Built
Pinata Filesystem and PinDrop acts as a layer on top of Pinata's storage system that allows users to organise and visualise their files using folders and sub-folders.
It provides an interface and at the same time extends the features of Pinata. The users can associate files with folders, as well as do most of the general functions like creating, deleting and downloading files and folders.
Inspiration
I had instantly decided to make a fast private file sharing system right on first day of hackathon since it is something I myself needed. But the idea had to be dropped since their was too much to be done.
Fast forward to 1 day before deadline, I thought about leveraging the feature of groups. I could make use of a relational db to create a heirarchy through self-references and make it a full-fledged platform to store and organise files.
Thankfully, with no-sleep development constantly for 24 hours, I present the first version of Pinata's own filesystem.
Pindrop folder
There is a feature called PinDrop (inspired from AirDrop) that I have ideated which is supposed to be a go-to folder that is present by default in the system when a user registers.
This folder is special in that it doesn't have sub-folders, instead a user can simply push and stack files and retreive them later. This is supposed to be for instant file shares between the user's two devices. It can even have its dedicated service and routes going forward.
Demo
https://github.com/mr-loop-1/pindrop
Overview
For Future
The best thing about the database is that nothing about actual files is being stored. It is only a hierarchical representation of groups.
Currently it may seem redundant as the app asks for jwt and gateway on register but I got to know through discord that new auth provider is being developed and with that integrated, the app would be completly detached from actual user data.
tech stack
server: expressjs, knexjs, mysql, hosted on railway
frontend: vite react, tailwind, hosted on vercel
Overview
The first greetings are the login/register pages. During registration, a valid pinata jwt and gateway url need to be provided. But it will never be exposed on client side and only for server operations.
This is the root folder mounted at "~/". All other folders are supposed to derive from here. In pinata, this group is created when a user first signsup.
- Supported file types can be added using the Add File button in any folder. The file then gets added to the folder's group in pinata
- Similarly, except in pinDrop folder at root, new folders can be created anywhere.
- Clicking on a folder will navigate to it, a back button has been provided to navigate to previous folder. For navigating to root, remove the id param from url.
Files and folders can be deleting using the button provided on right. pinDrop folder can't be deleted, as is root.
Files can be opened in new tab using the download button provided. This is done through signed urls with expiry of 1 minute.
My Code
https://github.com/mr-loop-1/pindrop
instructions to run locally are provided. Please report any bugs/questions in comments or github issues.
More Information
Please ensure
- Folder names can't contain spaces
- Duplicate files/filenames can't be uploaded even in different folders as on pinata they are stored together
Way Forward
- downloading multiple files and whole folders
- currently delete feature of folder leaves files in subfolders dangling. i am yet to implement the query in knex as well as Pinata's sdk for recursive deletes.
- some bug fixes and field validations
- Currently, it requires user to manually provide jwt and gateway of their pinata accounts. I want to integrate the future pinata oauth provider to the app.
Top comments (1)
hi @pinata @stevedylandev I had added the deployment link some time after making the post. Just thought I should let you know in case it got missed.