{"id":27169,"date":"2023-06-16T12:23:28","date_gmt":"2023-06-16T08:53:28","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/learning-firebase-and-react-native-private-message-app-3n06\/"},"modified":"2023-06-16T12:23:28","modified_gmt":"2023-06-16T08:53:28","slug":"learning-firebase-and-react-native-private-message-app-3n06","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/learning-firebase-and-react-native-private-message-app-3n06\/","title":{"rendered":"\u0622\u0645\u0648\u0632\u0634 Firebase \u0648 React-Native: Private Message App"},"content":{"rendered":"
\n

\u062f\u0631 \u0627\u06cc\u0646 \u0622\u0645\u0648\u0632\u0634\u060c \u0622\u0646\u0686\u0647 \u0631\u0627 \u06a9\u0647 \u062f\u0631 \u0637\u0648\u0644 \u0633\u0641\u0631\u0645 \u0628\u0631\u0627\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0633\u0627\u062e\u062a\u0646 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0622\u0632\u0645\u0627\u06cc\u0634\u06cc \u0633\u0627\u062f\u0647 \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u067e\u06cc\u0627\u0645\u200c\u0631\u0633\u0627\u0646 \u062e\u0635\u0648\u0635\u06cc \u06cc\u0627\u062f \u06af\u0631\u0641\u062a\u0645\u060c \u0628\u0647 \u0634\u0645\u0627 \u0646\u0634\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u0645. \u0645\u0646 \u0631\u0648\u0646\u062f \u0627\u062d\u0631\u0627\u0632 \u0647\u0648\u06cc\u062a firebase \u0645\u0648\u062c\u0648\u062f \u062f\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0631\u0627 \u067e\u0648\u0634\u0634 \u0646\u0645\u06cc\u200c\u062f\u0647\u0645. \u0627\u06cc\u0646 \u062f\u0631 \u067e\u0633\u062a \u0642\u0628\u0644\u06cc \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u067e\u0648\u0634\u0634 \u062f\u0627\u062f\u0647 \u0634\u062f: https:\/\/dev.to\/colinah\/learning-firebase-and-react-native-authentication-2822.<\/p>\n

\u062f\u0631 \u062d\u0627\u0644\u06cc \u06a9\u0647 \u0628\u0647 \u0631\u0627\u0647\u200c\u0647\u0627\u06cc\u06cc \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0627\u06cc\u0646 \u0645\u0648\u0636\u0648\u0639 \u0641\u06a9\u0631 \u0645\u06cc\u200c\u06a9\u0631\u062f\u0645\u060c \u0645\u06cc\u200c\u062e\u0648\u0627\u0633\u062a\u0645 \u0633\u06cc\u0633\u062a\u0645 \u0686\u062a \u062e\u0635\u0648\u0635\u06cc \u0631\u0627 \u0627\u0646\u0639\u0637\u0627\u0641\u200c\u067e\u0630\u06cc\u0631 \u06a9\u0646\u0645\u060c \u0628\u0646\u0627\u0628\u0631\u0627\u06cc\u0646 \u0627\u06af\u0631 \u0628\u062e\u0648\u0627\u0647\u0645 \u0622\u0646 \u0686\u062a \u0631\u0627 \u0628\u0647 \u06cc\u06a9 \u0686\u062a \u06af\u0631\u0648\u0647\u06cc \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0647\u0645\u060c \u0645\u0639\u0645\u0627\u0631\u06cc \u0627\u0632 \u0642\u0628\u0644 \u062a\u0646\u0638\u06cc\u0645 \u0634\u062f\u0647 \u0628\u0648\u062f. \u0628\u0631\u0627\u06cc \u0627\u0646\u062c\u0627\u0645 \u0627\u06cc\u0646 \u06a9\u0627\u0631 \u0628\u0627\u06cc\u062f \u0686\u0646\u062f \u0646\u06a9\u062a\u0647 \u0631\u0627 \u062f\u0631 \u0646\u0638\u0631 \u06af\u0631\u0641\u062a. \u0627\u0648\u0644 \u0627\u06cc\u0646\u06a9\u0647 \u0686\u06af\u0648\u0646\u0647 \u062f\u0627\u062f\u0647\u200c\u0647\u0627 \u0631\u0627 \u0628\u0631\u0627\u06cc \u067e\u06cc\u0627\u0645\u200c\u0647\u0627 \u0630\u062e\u06cc\u0631\u0647 \u0645\u06cc\u200c\u06a9\u0646\u06cc\u0645\u060c \u0628\u0647 \u0686\u0647 \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc\u06cc \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u0645 \u0648 \u0686\u06af\u0648\u0646\u0647 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0631\u0627 \u0628\u0647 \u0622\u0646 \u062f\u0627\u062f\u0647\u200c\u0647\u0627 \u0645\u062a\u0635\u0644 \u06a9\u0646\u06cc\u0645.<\/p>\n

\u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u067e\u06cc\u0627\u0645\u200c\u0647\u0627\u060c \u062a\u0635\u0645\u06cc\u0645 \u06af\u0631\u0641\u062a\u0645 \u0627\u0632 \u0645\u062c\u0645\u0648\u0639\u0647 Firebase \u0628\u0647 \u0646\u0627\u0645 \u0627\u062a\u0627\u0642\u200c\u0647\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645\u060c \u06a9\u0647 \u062f\u0627\u0631\u0627\u06cc \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u0645\u0646\u062d\u0635\u0631\u0628\u0647\u200c\u0641\u0631\u062f \u0627\u0633\u062a \u06a9\u0647 \u0627\u0632 \u062a\u0631\u06a9\u06cc\u0628 \u062f\u0648 \u0634\u0646\u0627\u0633\u0647 \u06a9\u0627\u0631\u0628\u0631 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc\u200c\u0634\u0648\u062f. \u0633\u067e\u0633 \u0633\u0646\u062f \u0627\u062a\u0627\u0642 \u062d\u0627\u0648\u06cc \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0632\u06cc\u0631\u060c \u0631\u0646\u06af\u060c \u0622\u062e\u0631\u06cc\u0646 \u067e\u06cc\u0627\u0645\u060c \u067e\u06cc\u0627\u0645\u200c\u0647\u0627 \u0648 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f. \u062f\u0631 \u062c\u0627\u06cc\u06cc \u06a9\u0647 \u0631\u0646\u06af \u06cc\u06a9 \u06a9\u062f \u0647\u06af\u0632 \u0631\u0634\u062a\u0647 \u0628\u0631\u0627\u06cc \u0631\u0646\u06af\u06cc \u0627\u0633\u062a \u06a9\u0647 \u06af\u0631\u0648\u0647 \u0631\u0627 \u0627\u062e\u062a\u0635\u0627\u0635 \u0645\u06cc \u062f\u0647\u062f\u060c lastMessage \u0622\u062e\u0631\u06cc\u0646 \u067e\u06cc\u0627\u0645\u06cc \u0627\u0633\u062a \u06a9\u0647 \u062f\u0631 \u0686\u062a \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0644\u06cc\u0633\u062a \u0686\u062a \u0647\u0627 \u0627\u0631\u0633\u0627\u0644 \u0634\u062f\u0647 \u0627\u0633\u062a\u060c \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0645\u062c\u0645\u0648\u0639\u0647 \u0627\u06cc \u0627\u0632 \u067e\u06cc\u0627\u0645 \u0647\u0627 \u062f\u0631 \u0627\u062a\u0627\u0642 \u0647\u0633\u062a\u0646\u062f \u0648 \u062f\u0631 \u0646\u0647\u0627\u06cc\u062a \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0645\u062c\u0645\u0648\u0639\u0647 \u0627\u06cc \u0627\u0632 \u0627\u0641\u0631\u0627\u062f \u062f\u0631 \u0627\u062a\u0627\u0642 \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u0645\u0648\u0646\u0647 \u0627\u06cc \u0627\u0632 \u0633\u0646\u062f \u0627\u062a\u0627\u0642 \u0647\u0627 \u0622\u0648\u0631\u062f\u0647 \u0634\u062f\u0647 \u0627\u0633\u062a.<\/p>\n

\"\u062a\u0648\u0636\u06cc\u062d\u0627\u062a<\/p>\n

\u0645\u0627 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0628\u0647 \u0631\u0627\u0647\u06cc \u0628\u0631\u0627\u06cc \u0647\u0631 \u06a9\u0627\u0631\u0628\u0631 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u0645 \u062a\u0627 \u0628\u062f\u0627\u0646\u062f \u0686\u0647 \u0686\u062a \u0647\u0627\/\u0627\u062a\u0627\u0642 \u0647\u0627\u06cc\u06cc \u0631\u0627 \u0642\u0628\u0644\u0627\u064b \u0634\u0631\u0648\u0639 \u0628\u0647 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0631 \u0635\u0641\u062d\u0647 \u067e\u06cc\u0627\u0645 \u0647\u0627 \u06a9\u0631\u062f\u0647 \u0627\u0633\u062a. \u0645\u0646 \u062a\u0635\u0645\u06cc\u0645 \u06af\u0631\u0641\u062a\u0645 \u0634\u0646\u0627\u0633\u0647 \u0627\u062a\u0627\u0642 \u0631\u0627 \u062f\u0631 \u0634\u06cc \u06a9\u0627\u0631\u0628\u0631 \u062f\u0631 \u06cc\u06a9 \u0622\u0631\u0627\u06cc\u0647 \u0630\u062e\u06cc\u0631\u0647 \u06a9\u0646\u0645.<\/p>\n

\"\u062a\u0648\u0636\u06cc\u062d\u0627\u062a<\/p>\n

\u0627\u06a9\u0646\u0648\u0646 \u06a9\u0647 \u0645\u06cc \u062f\u0627\u0646\u06cc\u0645 \u067e\u0627\u06cc\u06af\u0627\u0647 \u062f\u0627\u062f\u0647 Firebase \u0628\u0627 \u0627\u06cc\u0646 \u067e\u0631\u0648\u0698\u0647 \u0686\u06af\u0648\u0646\u0647 \u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f\u060c \u0627\u062c\u0627\u0632\u0647 \u062f\u0647\u06cc\u062f \u0628\u0631\u0646\u0627\u0645\u0647 React-Native \u0631\u0627 \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u0645. <\/p>\n

\u0633\u0647 \u0635\u0641\u062d\u0647 \u0627\u0635\u0644\u06cc \u0628\u0631\u0627\u06cc \u0628\u062e\u0634 \u0686\u062a \u0628\u0631\u0646\u0627\u0645\u0647\u060c \u0686\u062a \u0647\u0627\u060c \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0648 newChat \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f. \u0635\u0641\u062d\u0647 \u0686\u062a \u0644\u06cc\u0633\u062a\u06cc \u0627\u0632 \u0627\u062a\u0627\u0642 \u0647\u0627\u06cc\u06cc \u0631\u0627 \u06a9\u0647 \u06a9\u0627\u0631\u0628\u0631 \u062f\u0631 \u0622\u0646 \u0642\u0631\u0627\u0631 \u062f\u0627\u0631\u062f \u0631\u0627 \u0646\u0634\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f\u060c \u0635\u0641\u062d\u0647 \u067e\u06cc\u0627\u0645 \u0647\u0627 \u067e\u06cc\u0627\u0645 \u0647\u0627\u06cc \u0627\u0631\u0633\u0627\u0644 \u0634\u062f\u0647 \u0628\u06cc\u0646 \u062f\u0648 \u06a9\u0627\u0631\u0628\u0631 \u0631\u0627 \u0646\u0634\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f \u0648 \u062f\u0631 \u0646\u0647\u0627\u06cc\u062a \u0635\u0641\u062d\u0647 newChat \u0628\u0647 \u06a9\u0627\u0631\u0628\u0631 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc \u062f\u0647\u062f \u062a\u0627 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646\u06cc \u0631\u0627 \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u0686\u062a \u062c\u0633\u062a\u062c\u0648 \u06a9\u0646\u062f.<\/p>\n

\u0628\u06cc\u0627\u06cc\u06cc\u062f \u0628\u0627 \u0633\u0627\u062e\u062a \u0635\u0641\u062d\u0647 \u0686\u062a \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u0645. \u0645\u0627 \u0645\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 \u062f\u0631 \u0634\u06cc\u0621 \u06a9\u0627\u0631\u0628\u0631 firebase \u0645\u0634\u062a\u0631\u06a9 \u0634\u0648\u06cc\u0645 \u062a\u0627 \u062f\u0631 \u0635\u0648\u0631\u062a \u062a\u063a\u06cc\u06cc\u0631\u060c \u0627\u062a\u0627\u0642 \u0647\u0627 \u0628\u0647 \u0637\u0648\u0631 \u062e\u0648\u062f\u06a9\u0627\u0631 \u0628\u0647 \u0631\u0648\u0632 \u0634\u0648\u0646\u062f. \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u06a9\u0627\u0645\u067e\u0648\u0646\u0646\u062a Chats \u0628\u0647 \u0646\u0638\u0631 \u0645\u06cc \u0631\u0633\u062f \u0645\u0648\u0644\u0641\u0647 ChatGroup \u06cc\u06a9 \u0635\u0641\u062d\u0647 \u0646\u0645\u0627\u06cc\u0634 \u0633\u0627\u062f\u0647 \u0627\u0633\u062a \u06a9\u0647 \u0646\u0627\u0645 \u0627\u0641\u0631\u0627\u062f \u062f\u0631 \u0686\u062a \u0648 \u0622\u062e\u0631\u06cc\u0646 \u067e\u06cc\u0627\u0645 \u0631\u0627 \u0646\u0634\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f.<\/p>\n

\n
export default function Chats() {\n  const [rooms, setRooms] = React.useState([]);\n  const { user } = useContext(UserContext);\n  const router = useRouter();\n\n  React.useEffect(() => {\n    const userRef = doc(firestore, 'users', user.uid);\n\n    const unSub = onSnapshot(userRef, (doc) => {\n      doc.exists() && setRooms(doc.data().rooms);\n    });\n\n    return () => {\n      unSub();\n    };\n  }, []);\n\n  return (\n    <View style={styles.container}>\n      <ScrollView>\n        {rooms ? (\n          rooms.map((room) => <ChatGroup roomId={room} key={room} \/>)\n        ) : (\n          <View\n            style={{\n              padding: 6,\n              borderRadius: 6,\n              borderWidth: 1,\n              borderColor: '#ffffff60',\n              margin: 20,\n            }}>\n            <Text>You aren't in any rooms. Press the \"+\" to start a chat.<\/Text>\n          <\/View>\n        )}\n      <\/ScrollView>\n      <FAB icon=\"plus\" style={styles.fab} onPress={() => router.push('\/(chat)\/newChat')} \/>\n    <\/View>\n  );\n}\n<\/code><\/pre>\n
\n
\n    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    \n<\/svg><\/p>\n
    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    \n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\u0635\u0641\u062d\u0647 \u0628\u0639\u062f\u06cc \u0635\u0641\u062d\u0647 \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0627\u0633\u062a.  \u0628\u0631\u0627\u06cc \u0627\u0641\u0632\u0648\u062f\u0646 \u0639\u0645\u0644\u06a9\u0631\u062f \u0622\u0633\u0627\u0646 \u062a\u0631\u060c \u062a\u0635\u0645\u06cc\u0645 \u06af\u0631\u0641\u062a\u0645 \u0627\u0632 \u0628\u0633\u062a\u0647 react-native-gifted-chat \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645 \u06a9\u0647 \u0646\u0645\u0627\u06cc\u0634 \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0631\u0627 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u06a9\u0646\u062f.  \u0628\u0631\u0627\u06cc \u062f\u0631\u06cc\u0627\u0641\u062a \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0628\u0627\u06cc\u062f \u0628\u0647 \u0647\u0645\u0627\u0646 \u0631\u0648\u0634\u06cc \u06a9\u0647 \u0628\u0631\u0627\u06cc \u0634\u06cc \u06a9\u0627\u0631\u0628\u0631 \u0627\u0646\u062c\u0627\u0645 \u062f\u0627\u062f\u06cc\u0645\u060c \u062f\u0631 \u0633\u0646\u062f \u0627\u062a\u0627\u0642 \u0647\u0627 \u0645\u0634\u062a\u0631\u06a9 \u0634\u0648\u06cc\u0645.  \u0627\u06cc\u0646 \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0631\u0627 \u0628\u0647 \u0631\u0648\u0632 \u0646\u06af\u0647 \u0645\u06cc \u062f\u0627\u0631\u062f.<\/p>\n
\n
export default function Messages() {\n  const [messages, setMessages] = React.useState<IMessage[]>([]);\n  const { user } = React.useContext(UserContext);\n  const { id } = useSearchParams();\n\n  React.useEffect(() => {\n    const roomRef = doc(firestore, 'rooms', id as string);\n\n    const unSub = onSnapshot(roomRef, (doc) => {\n      doc.exists() &&\n        setMessages(\n          doc.data().messages.map((message: any) => ({\n            ...message,\n            createdAt: message.createdAt.toDate(),\n          }))\n        );\n    });\n\n    return () => {\n      unSub();\n    };\n  }, [id]);\n\n  const onSend = async (messages: IMessage[]) => {\n    const roomRef = doc(firestore, 'rooms', id as string);\n    await updateDoc(roomRef, {\n      messages: arrayUnion(messages[0]),\n      lastMessage: messages[0],\n    });\n  };\n\n  return (\n    <View style={styles.container}>\n      <Stack.Screen\n        options={{\n          title: 'Messages',\n        }}\n      \/>\n      <GiftedChat\n        renderBubble={ThemedBubble}\n        renderInputToolbar={ThemedInputToolbar}\n        minInputToolbarHeight={60}\n        messages={messages.reverse()}\n        showAvatarForEveryMessage\n        onSend={(messages) => onSend(messages)}\n        user={{\n          _id: user ? user.uid : 'Not logged it',\n          name: user ? (user.displayName as string) : 'No Display Name',\n          avatar: user?.photoURL ? user.photoURL : '',\n        }}\n      \/>\n    <\/View>\n  );\n}\n<\/code><\/pre>\n
\n
\n    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    \n<\/svg><\/p>\n
    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    \n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\u062f\u0631 \u0646\u0647\u0627\u06cc\u062a \u0645\u0627 \u0628\u0647 \u0631\u0627\u0647\u06cc \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u0686\u062a \u0647\u0627\u06cc \u062c\u062f\u06cc\u062f \u0628\u0627 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u0645\u060c \u0627\u06cc\u0646 \u062f\u0631 \u0635\u0641\u062d\u0647 newChat \u0627\u0646\u062c\u0627\u0645 \u0645\u06cc \u0634\u0648\u062f.  \u0628\u0631\u0627\u06cc \u0627\u0646\u062c\u0627\u0645 \u0627\u06cc\u0646 \u06a9\u0627\u0631\u060c \u0645\u0627 \u0641\u0642\u0637 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u06cc\u06a9 \u0648\u0631\u0648\u062f\u06cc \u062c\u0633\u062a\u062c\u0648 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u0645 \u06a9\u0647 \u0628\u0647 \u0645\u062c\u0645\u0648\u0639\u0647 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0645\u062a\u0635\u0644 \u0645\u06cc \u0634\u0648\u062f \u0648 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0631\u0627 \u0628\u0627 \u0646\u0627\u0645 \u062c\u0633\u062a\u062c\u0648 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n
\n
export default function NewChat() {\n  const [search, setSearch] = React.useState('');\n  const [results, setResults] = React.useState<UserInfo[]>([]);\n\n  const onSearchHandler = async (text: string) => {\n    setSearch(text);\n    const q = query(collection(firestore, 'users'), where('displayName', '==', text.toLowerCase()));\n\n    try {\n      const querySnapshot = await getDocs(q);\n\n      const list = [] as UserInfo[];\n      querySnapshot.forEach((doc) => list.push(doc.data() as UserInfo));\n      setResults(list);\n    } catch (err) {\n      console.log('error', err);\n    }\n  };\n\n  return (\n    <View style={{ flex: 1 }}>\n      <TextInput value={search} onChangeText={onSearchHandler} \/>\n      {results.map((user) => (\n        <SearchResult username={user.displayName} email={user.email} id={user.uid} key={user.uid} \/>\n      ))}\n    <\/View>\n  );\n}\n<\/code><\/pre>\n
\n
\n    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    \n<\/svg><\/p>\n
    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    \n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\u0627\u06cc\u0646 \u0686\u0627\u0631\u0686\u0648\u0628 \u0627\u0633\u0627\u0633\u06cc \u0628\u0631\u0627\u06cc \u0633\u0627\u062e\u062a \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u067e\u06cc\u0627\u0645\u200c\u0631\u0633\u0627\u0646 \u062e\u0635\u0648\u0635\u06cc \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 react native \u0648 firebase \u0627\u0633\u062a.  \u0627\u06af\u0631 \u0645\u06cc\u200c\u062e\u0648\u0627\u0647\u06cc\u062f \u06a9\u0644 \u067e\u0631\u0648\u0698\u0647 \u0631\u0627 \u0628\u0628\u06cc\u0646\u06cc\u062f\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0622\u0646 \u0631\u0627 \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u062f\u0631 https:\/\/github.com\/codingcruxes\/react-native-firebase-chat \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/p>\n
\u0627\u0645\u06cc\u062f\u0648\u0627\u0631\u0645 \u0627\u0632 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0631\u062f\u0646 \u0622\u0646 \u0644\u0630\u062a \u0628\u0631\u062f\u0647 \u0628\u0627\u0634\u06cc\u062f \u0648 \u0628\u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0647 \u0627\u0646\u062f\u0627\u0632\u0647 \u0645\u0646 \u062f\u0631 \u0637\u0648\u0644 \u0627\u06cc\u0646 \u0641\u0631\u0622\u06cc\u0646\u062f \u06cc\u0627\u062f \u0628\u06af\u06cc\u0631\u06cc\u062f.<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"
\u062f\u0631 \u0627\u06cc\u0646 \u0622\u0645\u0648\u0632\u0634\u060c \u0622\u0646\u0686\u0647 \u0631\u0627 \u06a9\u0647 \u062f\u0631 \u0637\u0648\u0644 \u0633\u0641\u0631\u0645 \u0628\u0631\u0627\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0633\u0627\u062e\u062a\u0646 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0622\u0632\u0645\u0627\u06cc\u0634\u06cc \u0633\u0627\u062f\u0647 \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u067e\u06cc\u0627\u0645\u200c\u0631\u0633\u0627\u0646 \u062e\u0635\u0648\u0635\u06cc \u06cc\u0627\u062f \u06af\u0631\u0641\u062a\u0645\u060c \u0628\u0647 \u0634\u0645\u0627 \u0646\u0634\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u0645. \u0645\u0646 \u0631\u0648\u0646\u062f \u0627\u062d\u0631\u0627\u0632 \u0647\u0648\u06cc\u062a firebase \u0645\u0648\u062c\u0648\u062f \u062f\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0631\u0627 \u067e\u0648\u0634\u0634 \u0646\u0645\u06cc\u200c\u062f\u0647\u0645. \u0627\u06cc\u0646 \u062f\u0631 \u067e\u0633\u062a \u0642\u0628\u0644\u06cc \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u067e\u0648\u0634\u0634 \u062f\u0627\u062f\u0647 \u0634\u062f: https:\/\/dev.to\/colinah\/learning-firebase-and-react-native-authentication-2822. \u062f\u0631 \u062d\u0627\u0644\u06cc \u06a9\u0647 \u0628\u0647 \u0631\u0627\u0647\u200c\u0647\u0627\u06cc\u06cc \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f …<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-27169","post","type-post","status-publish","format-standard","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/27169","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=27169"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/27169\/revisions"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=27169"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=27169"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=27169"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}