{"id":30439956,"url":"https://github.com/kevinpareek/s3-storage-manager","last_synced_at":"2026-05-06T17:34:30.559Z","repository":{"id":310313952,"uuid":"1039028941","full_name":"kevinpareek/s3-storage-manager","owner":"kevinpareek","description":"A fast, browser-based S3 file manager with drag‑and‑drop uploads, multipart uploads, folder management, previews, and shareable links. Built with React + Vite.","archived":false,"fork":false,"pushed_at":"2025-12-12T13:11:14.000Z","size":639,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-12-13T22:38:31.478Z","etag":null,"topics":["aws-s3","drag-and-drop","file-manager","file-upload","multipart-uploads","object-storage","react","s3","s3-compatible","vite","webapp"],"latest_commit_sha":null,"homepage":"https://s3.onekick.in/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kevinpareek.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-08-16T10:23:37.000Z","updated_at":"2025-12-12T13:08:46.000Z","dependencies_parsed_at":"2025-12-12T15:05:24.087Z","dependency_job_id":null,"html_url":"https://github.com/kevinpareek/s3-storage-manager","commit_stats":null,"previous_names":["kevinpareek/s3-storage-manager"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/kevinpareek/s3-storage-manager","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kevinpareek%2Fs3-storage-manager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kevinpareek%2Fs3-storage-manager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kevinpareek%2Fs3-storage-manager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kevinpareek%2Fs3-storage-manager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kevinpareek","download_url":"https://codeload.github.com/kevinpareek/s3-storage-manager/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kevinpareek%2Fs3-storage-manager/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32704521,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-06T08:33:17.875Z","status":"ssl_error","status_checked_at":"2026-05-06T08:33:17.221Z","response_time":117,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["aws-s3","drag-and-drop","file-manager","file-upload","multipart-uploads","object-storage","react","s3","s3-compatible","vite","webapp"],"created_at":"2025-08-23T05:19:28.975Z","updated_at":"2026-05-06T17:34:30.552Z","avatar_url":"https://github.com/kevinpareek.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# S3 Storage Manager 🗂️\n\nModern, client‑side file manager for S3‑compatible storage. Built with React + Vite and AWS SDK v3. Manage buckets, browse folders, upload with multipart, rename, delete, search, preview, and generate signed URLs — across multiple providers and credentials.\n\n![S3 Storage Manager Logo](./public/logo.svg)\n\n## ✨ Features\n\n### 🔐 Multi‑credential management\n- Add, select, and manage multiple S3-compatible accounts\n- Credentials stored locally in the browser (no server)\n- Quick switch from the header dropdown; edit or disconnect anytime\n\n![Multiple Credentials Support](./public/multiple-credential.png)\n\n### 📁 File \u0026 folder operations\n- Drag \u0026 drop uploads with progress (multipart, 5 MB chunks)\n- Create folders, rename files/folders (copy + delete under the hood)\n- Delete files/folders (bulk via ListObjects + DeleteObjects)\n- Breadcrumb navigation and inline path breadcrumbs per item\n- Search recursively and filter by type (images, videos, docs, etc.)\n- Info modal with signed preview/download URL and folder stats\n\n![File Manager Interface](./public/File-Manager-Interface.png)\n\n### 🚀 Advanced\n- Client‑only: signs requests locally via AWS SDK in the browser\n- Responsive, dark UI with Tailwind CSS 4 and Lucide icons\n- SPA routing with React Router; Vercel configuration included\n\n![File Uploading](./public/File-Uploading.png)\n\n## 🛠️ Tech stack\n- React 19, Vite 7\n- Tailwind CSS 4\n- AWS SDK v3: `@aws-sdk/client-s3`, `@aws-sdk/s3-request-presigner`\n- React Router DOM, React Toastify, Lucide React\n\n## 📦 Installation\n\n### Prerequisites\n- Node.js ≥ 20 (enforced by `package.json`)\n- npm or yarn\n\n### Setup\n1) Clone and install\n```bash\ngit clone https://github.com/kevinpareek/s3-storage-manager.git\ncd s3-storage-manager\nnpm install\n# or\nyarn install\n```\n\n2) Start dev server\n```bash\nnpm run dev\n# or\nyarn dev\n```\nVisit `http://localhost:5173`.\n\n## 🚀 First‑run \u0026 usage\n\n### 1) Enter credentials\nOn first run you’ll be redirected to `/config` to add a credential set:\n\n- Name: friendly label for the account/bucket\n- Access Key / Secret Key\n- Region (e.g. `us-east-1` or `auto` for some providers)\n- Endpoint (required for non‑AWS providers)\n\nThe form includes provider presets and copy‑paste helpers for CORS and policies.\n\n![Enter Credentials](./public/enter-Credentials.png)\n\n### 2) Manage files\n- Drag \u0026 drop files into the drop area to upload\n- Create folders, rename or delete items\n- Use search and file‑type filter; navigate with breadcrumbs\n- Click the info icon to view details, signed preview/download URLs, and folder stats\n\n### 3) Multiple accounts\nUse the header dropdown to switch accounts, add new ones, or disconnect.\n\n## 🔧 Configuration notes\n\n### Supported providers (tested presets)\n- AWS S3\n- Cloudflare R2 (endpoint: `https://\u003caccountid\u003e.r2.cloudflarestorage.com`, region: `auto`)\n- DigitalOcean Spaces (e.g., `https://nyc3.digitaloceanspaces.com`, region: `nyc3`)\n- Google Cloud Storage (Interoperability/HMAC)\n- IBM Cloud Object Storage\n- Oracle Cloud Object Storage\n- Scaleway Object Storage\n- Wasabi\n- Any S3‑compatible provider\n\n### Required CORS (example)\n```json\n[\n  {\n    \"AllowedHeaders\": [\"*\"],\n    \"AllowedMethods\": [\"GET\", \"PUT\", \"POST\", \"DELETE\", \"HEAD\"],\n    \"AllowedOrigins\": [\"*\"],\n    \"ExposeHeaders\": [\"ETag\"],\n    \"MaxAgeSeconds\": 3000\n  }\n]\n```\n\nFor production, restrict `AllowedOrigins` to your domain.\n\n### Minimal bucket policy (example)\nReplace `\u003cyour-bucket-name\u003e`:\n```json\n{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    { \"Effect\": \"Allow\", \"Action\": [\"s3:ListBucket\"], \"Resource\": [\"arn:aws:s3:::\u003cyour-bucket-name\u003e\"] },\n    { \"Effect\": \"Allow\", \"Action\": [\"s3:GetObject\", \"s3:PutObject\", \"s3:DeleteObject\"], \"Resource\": [\"arn:aws:s3:::\u003cyour-bucket-name\u003e/*\"] }\n  ]\n}\n```\n\n### Security\n- This is a client‑only app; credentials are stored in `localStorage` and used in‑browser to sign requests.\n- Use dedicated, least‑privilege access keys limited to the target bucket.\n- Consider rotating keys periodically.\n\n## 📜 Scripts\n- `npm run dev` — start dev server\n- `npm run build` — production build\n- `npm run preview` — preview build locally\n- `npm run lint` — run ESLint\n\n## 🏗️ Project structure\n```\ns3-storage-manager/\n├── src/\n│   ├── api/           # S3 operations (list, upload, rename, delete, search, stats, presign)\n│   ├── components/    # UI components (dropper, finder, modals, header)\n│   ├── context/       # Credentials provider (multi‑account)\n│   ├── helpers/       # Utilities (filters)\n│   ├── hooks/         # `useCredentials`\n│   ├── pages/         # `/config`, `/` and edit views\n│   └── main.jsx       # App entry\n├── public/            # Static assets\n└── package.json       # Scripts \u0026 deps\n```\n\n## 🔌 API (internal modules)\n- `listFiles(s3, prefix, bucket, opts?)` — list folders/files using delimiter. Returns `{ items, isTruncated, nextContinuationToken }`. Pass `opts.continuationToken` to fetch next pages.\n- `addFolder(s3, folderPath, bucket)` — create placeholder folder object\n- `deleteFileOrFolder(s3, key, bucket)` — bulk delete with `DeleteObjects`\n- `renameFileOrFolder(s3, oldKey, newKey, bucket)` — copy + delete\n- `renameFolder(s3, oldPrefix, newPrefix, bucket)` — copy + delete recursively\n- `getFilePreview(s3, key, download, bucket)` — signed URL (1 hour)\n- `getFolderStats(s3, prefix, bucket)` — sum size, earliest/latest modified\n- `searchFilesAndFolders(s3, prefix, term, bucket)` — recursive search\n- `MultiPartUpload(s3, file, dir, bucket)` — multipart upload (5 MB parts)\n\n## 🎨 Customization\n- Styling: Tailwind CSS 4; override tokens/classes in `src/index.css` and component classes\n- Upload behavior: adjust chunk size in `src/api/MultiPartUpload.js` (defaults to 5 MB)\n\n## 📦 Deployment\n\n### Vercel (recommended)\nIncludes `vercel.json` with SPA rewrites. Deploy with default static output.\n\n### Any static hosting\n```bash\nnpm run build\n# upload dist/ to your host; ensure SPA rewrites to index.html\n```\n\n## 🧩 Troubleshooting\n- CORS blocked: set CORS on the bucket (see snippet above) and restrict origins appropriately\n- AccessDenied/ListObjects: policy or key permissions missing (`s3:ListBucket` and object permissions)\n- SignatureDoesNotMatch: wrong endpoint/region; ensure exact provider endpoint and region\n- R2/GCS: use interoperability endpoints and HMAC keys; R2 region is `auto`\n- Path style: app uses `forcePathStyle: true` (works well with MinIO/R2/Spaces)\n\n## ⚠️ Known limitations\n- Folder rename uses copy + delete; can be slow and incurs provider costs\n- Recursive search/stats list objects; for very large buckets, operations may take time\n- Signed URLs expire in 1 hour (tunable in `getFilePreview`)\n\n## 📄 License\nMIT — see `LICENSE`.\n\n---\n\nBuilt with ❤️ using React and AWS SDK v3.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkevinpareek%2Fs3-storage-manager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkevinpareek%2Fs3-storage-manager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkevinpareek%2Fs3-storage-manager/lists"}