created the useHooke useAvatarETag

This commit is contained in:
Reinaldo Neto 2022-12-21 19:41:22 -03:00
parent 7e1dec41e9
commit 2a4195c10a
2 changed files with 69 additions and 48 deletions

View File

@ -1,17 +1,15 @@
import { Q } from '@nozbe/watermelondb';
import React, { useEffect, useRef, useState } from 'react';
import React from 'react';
import { shallowEqual, useSelector } from 'react-redux';
import { Observable, Subscription } from 'rxjs';
import Button from '../Button';
import { IApplicationState, TSubscriptionModel, TUserModel } from '../../definitions';
import database from '../../lib/database';
import { IApplicationState } from '../../definitions';
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 = () => {
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(), []);
const { avatarETag } = useAvatarETag({ username, text, type, rid });
return (
<>

View File

@ -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 };
};