-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathuseImageUpload.ts
More file actions
77 lines (68 loc) · 2.07 KB
/
Copy pathuseImageUpload.ts
File metadata and controls
77 lines (68 loc) · 2.07 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import { useRef, useState, useCallback, useEffect } from 'react';
import { uploadFile } from '../../features/event/hooks/usePresignedUrlHook';
const useImageUpload = ({
value,
onSuccess,
useDefaultImage = true,
}: {
value?: string;
onSuccess?: (url: string) => void;
useDefaultImage?: boolean;
}) => {
const DEFAULT_BASIC_PROFILE = 'https://gotogetherbucket.s3.ap-northeast-2.amazonaws.com/default.png';
const [previewUrl, setPreviewUrl] = useState<string | null>(null);
const [isDragging, setIsDragging] = useState(false);
const fileInputRef = useRef<HTMLInputElement>(null);
useEffect(() => {
if (value) {
setPreviewUrl(value);
} else if (useDefaultImage && previewUrl !== DEFAULT_BASIC_PROFILE) {
setPreviewUrl(DEFAULT_BASIC_PROFILE);
onSuccess?.(DEFAULT_BASIC_PROFILE);
}
}, [value, onSuccess, useDefaultImage, previewUrl]);
const validateFile = (file: File) => {
if (file.size > 1000 * 1024) {
alert('파일 크기는 1MB를 초과할 수 없습니다.');
return false;
}
if (!['image/jpg', 'image/jpeg', 'image/png'].includes(file.type)) {
alert('jpg, jpeg, png 파일만 업로드 가능합니다.');
return false;
}
return true;
};
const handleFileUpload = useCallback(
async (file: File) => {
if (!validateFile(file)) return;
try {
const imageUrl = await uploadFile(file);
setPreviewUrl(imageUrl);
onSuccess?.(imageUrl);
} catch (error) {
console.error('파일 업로드 실패:', error);
}
},
[onSuccess]
);
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const file = e.target.files?.[0];
if (file) handleFileUpload(file);
};
const handleDrop = (e: React.DragEvent) => {
e.preventDefault();
setIsDragging(false);
const file = e.dataTransfer.files[0];
if (file) handleFileUpload(file);
};
return {
previewUrl,
isDragging,
setIsDragging,
fileInputRef,
handleFileUpload,
handleFileChange,
handleDrop,
};
};
export default useImageUpload;