231 const [isDragging, setIsDragging] = useState(false);
232
233 const fetchBlobs = useCallback(async () => {
234 setLoading(true);
235 try {
236 const response = await fetch(`/api/blobs?prefix=${encodeKey(searchPrefix)}&limit=${limit}`);
237 const data = await response.json();
238 setBlobs(data);
239 } catch (error) {
240 console.error("Error fetching blobs:", error);
241 } finally {
242 setLoading(false);
245
246 useEffect(() => {
247 fetchBlobs();
248 }, [fetchBlobs]);
249
250 const handleSearch = (e) => {
261 setBlobContentLoading(true);
262 try {
263 const response = await fetch(`/api/blob?key=${encodeKey(clickedBlob.key)}`);
264 const content = await response.text();
265 setSelectedBlob({ ...clickedBlob, key: decodeKey(clickedBlob.key) });
266 setEditContent(content);
267 } catch (error) {
268 console.error("Error fetching blob content:", error);
269 } finally {
270 setBlobContentLoading(false);
275 const handleSave = async () => {
276 try {
277 await fetch(`/api/blob?key=${encodeKey(selectedBlob.key)}`, {
278 method: "PUT",
279 body: editContent,
287 const handleDelete = async (key) => {
288 try {
289 await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
290 setBlobs(blobs.filter(b => b.key !== key));
291 if (selectedBlob && selectedBlob.key === key) {
304 const key = `${searchPrefix}${file.name}`;
305 formData.append("key", encodeKey(key));
306 await fetch("/api/blob", { method: "POST", body: formData });
307 const newBlob = { key, size: file.size, lastModified: new Date().toISOString() };
308 setBlobs([newBlob, ...blobs]);
312 }
313 }
314 fetchBlobs();
315 };
316
326 try {
327 const fullKey = `${searchPrefix}${key}`;
328 await fetch(`/api/blob?key=${encodeKey(fullKey)}`, {
329 method: "PUT",
330 body: "",
341 const handleDownload = async (key) => {
342 try {
343 const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
344 const blob = await response.blob();
345 const url = window.URL.createObjectURL(blob);
360 if (newKey && newKey !== oldKey) {
361 try {
362 const response = await fetch(`/api/blob?key=${encodeKey(oldKey)}`);
363 const content = await response.blob();
364 await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
365 method: "PUT",
366 body: content,
367 });
368 await fetch(`/api/blob?key=${encodeKey(oldKey)}`, { method: "DELETE" });
369 setBlobs(blobs.map(b => b.key === oldKey ? { ...b, key: newKey } : b));
370 if (selectedBlob && selectedBlob.key === oldKey) {
380 const newKey = `__public/${key}`;
381 try {
382 const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
383 const content = await response.blob();
384 await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
385 method: "PUT",
386 body: content,
387 });
388 await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
389 setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));
390 if (selectedBlob && selectedBlob.key === key) {
399 const newKey = key.slice(9); // Remove "__public/" prefix
400 try {
401 const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
402 const content = await response.blob();
403 await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
404 method: "PUT",
405 body: content,
406 });
407 await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
408 setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));
409 if (selectedBlob && selectedBlob.key === key) {