created the useHooke useAvatarETag

app/containers/Avatar/index.tsx

@@ -1,17 +1,15 @@
-import { Q } from '@nozbe/watermelondb';
+import React from 'react';
-import React, { useEffect, useRef, useState } from 'react';
 import { shallowEqual, useSelector } from 'react-redux';
-import { Observable, Subscription } from 'rxjs';
 
 import Button from '../Button';
-import { IApplicationState, TSubscriptionModel, TUserModel } from '../../definitions';
+import { IApplicationState } from '../../definitions';
-import database from '../../lib/database';
 import { getUserSelector } from '../../selectors/login';
 import Avatar from './Avatar';
 import { IAvatar } from './interfaces';
 import I18n from '../../i18n';
 import { useTheme } from '../../theme';
 import styles from './styles';
+import { useAvatarETag } from './useAvatarETag';
 
 interface IAvatarContainer extends IAvatar {
 	handleEdit?: () => void;
@@ -32,12 +30,8 @@ const AvatarContainer = ({
 	rid,
 	handleEdit
 }: IAvatarContainer): React.ReactElement => {
-	const subscription = useRef<Subscription>();
-	const [avatarETag, setAvatarETag] = useState<string | undefined>('');
 	const { colors } = useTheme();
 
-	const isDirect = () => type === 'd';
-
 	const server = useSelector((state: IApplicationState) => state.share.server.server || state.server.server);
 	const serverVersion = useSelector((state: IApplicationState) => state.share.server.version || state.server.version);
 	const { id, token, username } = useSelector(
@@ -59,45 +53,7 @@ const AvatarContainer = ({
 			true
 	);
 
-	const unsubscribeQuery = () => {
+	const { avatarETag } = useAvatarETag({ username, text, type, rid });
-		if (subscription?.current?.unsubscribe) {
-			subscription.current.unsubscribe();
-		}
-	};
-
-	const init = async () => {
-		unsubscribeQuery();
-		const db = database.active;
-		const usersCollection = db.get('users');
-		const subsCollection = db.get('subscriptions');
-
-		let record;
-		try {
-			if (isDirect() || username === text) {
-				const [user] = await usersCollection.query(Q.where('username', text)).fetch();
-				record = user;
-			} else if (rid) {
-				record = await subsCollection.find(rid);
-			}
-		} catch {
-			// Record not found
-		}
-
-		if (record) {
-			const observable = record.observe() as Observable<TSubscriptionModel | TUserModel>;
-			subscription.current = observable.subscribe(r => {
-				setAvatarETag(r.avatarETag);
-			});
-		}
-	};
-
-	useEffect(() => {
-		if (!avatarETag) {
-			init();
-		}
-	}, [text]); // testar se precisa do avatarETag
-
-	useEffect(() => () => unsubscribeQuery(), []);
 
 	return (
 		<>

app/containers/Avatar/useAvatarETag.ts

@@ -0,0 +1,65 @@
+import { Q } from '@nozbe/watermelondb';
+import { useEffect, useRef, useState } from 'react';
+import { Observable, Subscription } from 'rxjs';
+
+import { TSubscriptionModel, TUserModel } from '../../definitions';
+import database from '../../lib/database';
+
+export const useAvatarETag = ({
+	username,
+	text,
+	type = '',
+	rid
+}: {
+	type?: string;
+	username: string;
+	text: string;
+	rid?: string;
+}) => {
+	const subscription = useRef<Subscription>();
+	const [avatarETag, setAvatarETag] = useState<string | undefined>('');
+
+	const isDirect = () => type === 'd';
+
+	const unsubscribeQuery = () => {
+		if (subscription?.current?.unsubscribe) {
+			subscription.current.unsubscribe();
+		}
+	};
+
+	const init = async () => {
+		unsubscribeQuery();
+		const db = database.active;
+		const usersCollection = db.get('users');
+		const subsCollection = db.get('subscriptions');
+
+		let record;
+		try {
+			if (isDirect() || username === text) {
+				const [user] = await usersCollection.query(Q.where('username', text)).fetch();
+				record = user;
+			} else if (rid) {
+				record = await subsCollection.find(rid);
+			}
+		} catch {
+			// Record not found
+		}
+
+		if (record) {
+			const observable = record.observe() as Observable<TSubscriptionModel | TUserModel>;
+			subscription.current = observable.subscribe(r => {
+				setAvatarETag(r.avatarETag);
+			});
+		}
+	};
+
+	useEffect(() => {
+		if (!avatarETag) {
+			init();
+		}
+	}, [text]);
+
+	useEffect(() => () => unsubscribeQuery(), []);
+
+	return { avatarETag };
+};