'setSysMsg' was used before it was defined
45 dispath(setOnlineUsers(msg.users))
46 return
47 }
48 setSysMsg(msg) 49 },
50 onOpen: () => {
51 const token = localStorage.getItem('token')
'msgs' was used before it was defined
39 onMessage: ({ data }) => {
40 const msg = JSON.parse(data)
41 if (msg.type === 'chat') {
42 setMsgs([...msgs, msg]) 43 return
44 } else if (msg.type === 'usersList') {
45 dispath(setOnlineUsers(msg.users))
'setMsgs' was used before it was defined
39 onMessage: ({ data }) => {
40 const msg = JSON.parse(data)
41 if (msg.type === 'chat') {
42 setMsgs([...msgs, msg]) 43 return
44 } else if (msg.type === 'usersList') {
45 dispath(setOnlineUsers(msg.users))
'setSubmit' was used before it was defined
46 formData.append(`image${i + 1}`, productImages[i])
47 }
48 await createProduct(formData)
49 setSubmit(false) 50 dispatch(setShowStep2(false))
51 setTimeout(
52 () =>
'setSubmit' was used before it was defined
36 const productIcon = product.images ? product.images : []
37 const productImages = [...productIcon, ...images]
38 dispatch(setProductData({ ...product, images: productImages }))
39 setSubmit(true) 40 const formData = new FormData()
41 formData.set('name', product.name)
42 formData.set('description', product.description)
'setImages' was used before it was defined
14 const dispatch = useAppDispatch()
15 const [createProduct, { error, isLoading }] = useCreateProductMutation()
16 const closeHandler = () => {
17 setImages([]) 18 dispatch(setShowStep2(false))
19 }
20 const fileRef = useRef() as MutableRefObject<HTMLInputElement>
'router' was used before it was defined
16 const [showErrMsg, setShowErrMsg] = useState(false)
17 const [token, setToken] = useState('')
18 const closeHandler = () => {
19 router.push('/')20 setShow(false)
21 }
22 const router = useRouter()
'ConfirmDelete' was used before it was defined
202 </div>
203 </div>
204 <br />
205 <ConfirmDelete206 productName={DelProduct.name}
207 productID={DelProduct.id}
208 isShown={showDelModal}
'setShowDelModal' was used before it was defined
67 })
68 const handleDelete = (name: string, id: number) => {
69 setDelProduct({ name, id })
70 setShowDelModal(true) 71 }
72 const fileRef = useRef() as MutableRefObject<HTMLInputElement>
73 const [showDelModal, setShowDelModal] = useState(false)
'fileRef' was used before it was defined
52 const handleNewPfp = (e: ChangeEvent<HTMLInputElement>) => {
53 if (fileRef.current.files) {
54 let preview = URL.createObjectURL(fileRef.current.files[0])
55 setPfp(fileRef.current.files[0]) 56 const newUserData = { ...userInfo, pfp: preview } as User
57 setUserInfo(newUserData)
58
'fileRef' was used before it was defined
51 }
52 const handleNewPfp = (e: ChangeEvent<HTMLInputElement>) => {
53 if (fileRef.current.files) {
54 let preview = URL.createObjectURL(fileRef.current.files[0]) 55 setPfp(fileRef.current.files[0])
56 const newUserData = { ...userInfo, pfp: preview } as User
57 setUserInfo(newUserData)
'fileRef' was used before it was defined
50 setSave(false)
51 }
52 const handleNewPfp = (e: ChangeEvent<HTMLInputElement>) => {
53 if (fileRef.current.files) { 54 let preview = URL.createObjectURL(fileRef.current.files[0])
55 setPfp(fileRef.current.files[0])
56 const newUserData = { ...userInfo, pfp: preview } as User
Description
Variables, functions and types should always be used after they've been defined. This issue will flag any code snippets that use variables or types before definition.
Sometimes, the code will run just fine even when the variable is declared after use. Consider the following example:
const ram: Resource = { type: "memory", limit: 1024 ** 3 }
type Resource = {
type: string;
limit: number;
}
Here, Resource
is used in the annotation before it has been defined.
Similarly, it is possible to hoist function declarations and variables declared with the var
keyword:
const four = twice(2);
function twice(n: number) {
return n * 2;
}
However, it makes the code harder to follow when variables or types are declared after being used.
Bad Practice
const knight: Radiant = {
order: "SurgeBinder"
strength: 30
}
interface Radiant {
order: string;
strength: number;
}
Recommended
interface Radiant {
order: string;
strength: number;
}
const knight: Radiant = {
order: "SurgeBinder"
strength: 30
}