From 0d8f60163a810c52e60a54903423c53f246becbf Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Tue, 23 Jan 2024 19:02:47 +0200
Subject: [PATCH] fix: make functions expressions and imports order

---
 .../General/CreateAvatar/CreateAvatar.tsx      | 18 ++++++++++--------
 src/components/General/EmojiPickerDialog.tsx   |  3 ++-
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/components/General/CreateAvatar/CreateAvatar.tsx b/src/components/General/CreateAvatar/CreateAvatar.tsx
index 0abf524e..f8070241 100644
--- a/src/components/General/CreateAvatar/CreateAvatar.tsx
+++ b/src/components/General/CreateAvatar/CreateAvatar.tsx
@@ -2,11 +2,12 @@ import { useEffect, useRef, useState } from 'react'
 import { XStack, YStack } from 'tamagui'
 import { Avatar, Text } from '@status-im/components'
 import { ReactionIcon } from '@status-im/icons'
-import './CreateAvatar.css'
+import { Emoji, EmojiClickData, EmojiStyle } from 'emoji-picker-react'
+
 import LabelInputField from '../LabelInputField'
 import ColorPicker from '../ColorPicker/ColorPicker'
 import EmojiPickerDialog from '../EmojiPickerDialog'
-import { Emoji, EmojiClickData, EmojiStyle } from 'emoji-picker-react'
+import './CreateAvatar.css'
 
 const CreateAvatar = () => {
   const [chosenColor, setChosenColor] = useState('#2A4AF5')
@@ -14,16 +15,17 @@ const CreateAvatar = () => {
   const [selectedEmoji, setSelectedEmoji] = useState<string>('1f600')
   const emojiRef = useRef<HTMLDivElement | null>(null)
 
-  function changeEmoji(emojiData: EmojiClickData) {
+  const changeEmoji = (emojiData: EmojiClickData) => {
     setSelectedEmoji(emojiData.unified)
   }
 
-  useEffect(() => {
-    function handleClickOutside(event: any) {
-      if (emojiRef.current && !emojiRef.current.contains(event.target)) {
-        setIsEmojiDialogOpen(false)
-      }
+  const handleClickOutside = (event: any) => {
+    if (emojiRef.current && !emojiRef.current.contains(event.target)) {
+      setIsEmojiDialogOpen(false)
     }
+  }
+
+  useEffect(() => {
     document.addEventListener('mousedown', handleClickOutside)
     return () => {
       document.removeEventListener('mousedown', handleClickOutside)
diff --git a/src/components/General/EmojiPickerDialog.tsx b/src/components/General/EmojiPickerDialog.tsx
index 4babda00..846b3bd2 100644
--- a/src/components/General/EmojiPickerDialog.tsx
+++ b/src/components/General/EmojiPickerDialog.tsx
@@ -14,7 +14,7 @@ type EmojiPickerProps = {
   changeEmoji: (emojiData: EmojiClickData) => void
 }
 
-function EmojiPickerDialog({ emojiStyle, changeEmoji }: EmojiPickerProps) {
+const EmojiPickerDialog = ({ emojiStyle, changeEmoji }: EmojiPickerProps) => {
   return (
     <Stack position="absolute" zIndex={1} left={100} top={-150}>
       <EmojiPicker
@@ -54,4 +54,5 @@ function EmojiPickerDialog({ emojiStyle, changeEmoji }: EmojiPickerProps) {
     </Stack>
   )
 }
+
 export default EmojiPickerDialog