File Uploads

.env.example

@@ -19,3 +19,6 @@ SINGLESTORE_DATABASE="database"
 # Clerk
 NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=some-publishable-key
 CLERK_SECRET_KEY=some-secret-key
+
+# Uploadthing
+UPLOADTHING_TOKEN='uploadthing-token'

README.md

@@ -88,7 +88,7 @@ Tracking progress on key features and tasks for the project.
 - [x] 🛢️ Set up the database and define data models
 - [x] 🔗 Sync folder open state with the URL
 - [x] 🔐 Implement user authentication
-- [ ] 📁 Enable file upload functionality
+- [x] 📁 Enable file upload functionality
 - [ ] 📊 Add analytics tracking
 
 ### 📝 Note from 5-28-2025
@@ -106,3 +106,12 @@ The database and UI are now connected, some improvements to make:
 - [x] Change folders to link components, remove all client state
 - [x] Clean up the database and data fetching patterns
 - [ ] Real homepage
+
+### 📝 Note from 7-4-2025
+
+Uploading a file to '[uploadthing](https://uploadthing.com/)' works, things that
+can be approved:
+
+- [ ] Upload files to the right folder
+- [ ] Delete file button
+- [ ] Allow files that are not images to be uploaded

package.json

@@ -24,6 +24,7 @@
     "@libsql/client": "^0.14.0",
     "@radix-ui/react-slot": "^1.2.3",
     "@t3-oss/env-nextjs": "^0.12.0",
+    "@uploadthing/react": "^7.3.1",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "drizzle-orm": "^0.41.0",
@@ -33,6 +34,7 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "tailwind-merge": "^3.3.0",
+    "uploadthing": "^7.7.2",
     "zod": "^3.24.2"
   },
   "devDependencies": {