Today, I’d like to introduce a web app that can instantly find and copy all files in a folder containing the name of a file you drag & drop. (I’ll explain the details below.)
With this web app, you can quickly list out which files reference a dreaded file like CommonFunctionA.cs.
By listing all related files, it also makes it much easier to ask questions to ChatGPT.
💡 What Can It Do?
Imagine you have the following folder structure:
FolderA
├── FolderB
│ ├── aaa.txt
│ └── bbb.txt
├── ccc.txt ← drag & drop
└── ddd.txt
When you drag ccc.txt into the browser, the app performs these actions:
✅ Recursively searches within the folder
✅ Extracts all files that contain the string ccc in their content
✅ Copies the file names and their contents to the clipboard in bulk
📝 Technical Highlights
🚀 File System Access API
This app uses the File System Access API to explore the contents of your local folders directly from the browser.
✅ Recursive folder search
✅ Bulk copy using the Clipboard API
🎯 Summary
With just drag & drop, you can bulk copy all “related files,”
making it perfect for large-scale local text searches or as a code review assistant.
Note: It does not copy “related files of related files.”
While it’s possible to implement this, doing so could result in copying the entire folder due to chain references.
Also, I’ve been debating whether such a web app should include itself (the dragged file) in the output. (Currently, it doesn’t.)
Including it might make it more user-friendly, but from the perspective of “who is using CommonFunctionA.cs?”, it seems more accurate to exclude it.
📌 Links
Original Version:
https://uni928.github.io/DirectoryInFileAllCopy/index5.html
Updated Version (Includes Self):
https://uni928.github.io/DirectoryInFileAllCopy/index6.html
I decided to release this version too since it’s more convenient when asking ChatGPT questions.
Source Code (for local use and safety checks):
https://github.com/uni928/DirectoryInFileAllCopy
Feel free to download it and try it out locally!
Top comments (0)