[FIX] User status update with hooks (#4362)
* [FIX] User status update with hooks * add log * fix dispatch Co-authored-by: GleidsonDaniel <gleidson10daniel@hotmail.com>
This commit is contained in:
parent
fe7722ca10
commit
5a7f77a159
|
@ -57,34 +57,28 @@ const styles = StyleSheet.create({
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const Status = ({ status }: { status: IStatus }) => {
|
const Status = ({
|
||||||
const user = useSelector((state: IApplicationState) => getUserSelector(state));
|
statusType,
|
||||||
const dispatch = useDispatch();
|
status,
|
||||||
|
setStatus
|
||||||
const { id, name } = status;
|
}: {
|
||||||
|
statusType: IStatus;
|
||||||
|
status: TUserStatus;
|
||||||
|
setStatus: (status: TUserStatus) => void;
|
||||||
|
}) => {
|
||||||
|
const { id, name } = statusType;
|
||||||
return (
|
return (
|
||||||
<List.Item
|
<List.Item
|
||||||
title={name}
|
title={name}
|
||||||
onPress={async () => {
|
onPress={() => {
|
||||||
const key = `STATUS_${status.id.toUpperCase()}` as keyof typeof events;
|
const key = `STATUS_${statusType.id.toUpperCase()}` as keyof typeof events;
|
||||||
logEvent(events[key]);
|
logEvent(events[key]);
|
||||||
if (user.status !== status.id) {
|
if (status !== statusType.id) {
|
||||||
try {
|
setStatus(statusType.id);
|
||||||
await Services.setUserStatus(status.id, user.statusText || '');
|
|
||||||
dispatch(setUser({ status: status.id }));
|
|
||||||
} catch (e: any) {
|
|
||||||
const messageError =
|
|
||||||
e.error && e.error.includes('[error-too-many-requests]')
|
|
||||||
? I18n.t('error-too-many-requests', { seconds: e.reason.replace(/\D/g, '') })
|
|
||||||
: e.reason;
|
|
||||||
showErrorAlert(messageError);
|
|
||||||
logEvent(events.SET_STATUS_FAIL);
|
|
||||||
log(e);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
testID={`status-view-${id}`}
|
testID={`status-view-${id}`}
|
||||||
left={() => <StatusIcon size={24} status={status.id} />}
|
left={() => <StatusIcon size={24} status={statusType.id} />}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -98,6 +92,7 @@ const StatusView = (): React.ReactElement => {
|
||||||
|
|
||||||
const [statusText, setStatusText] = useState(user.statusText || '');
|
const [statusText, setStatusText] = useState(user.statusText || '');
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
|
const [status, setStatus] = useState(user.status);
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const { setOptions, goBack } = useNavigation();
|
const { setOptions, goBack } = useNavigation();
|
||||||
|
@ -105,8 +100,8 @@ const StatusView = (): React.ReactElement => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const submit = async () => {
|
const submit = async () => {
|
||||||
logEvent(events.STATUS_DONE);
|
logEvent(events.STATUS_DONE);
|
||||||
if (statusText !== user.statusText) {
|
if (statusText !== user.statusText || status !== user.status) {
|
||||||
await setCustomStatus(user.status, statusText);
|
await setCustomStatus(status, statusText);
|
||||||
}
|
}
|
||||||
goBack();
|
goBack();
|
||||||
};
|
};
|
||||||
|
@ -122,13 +117,13 @@ const StatusView = (): React.ReactElement => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
setHeader();
|
setHeader();
|
||||||
}, [statusText, user.status]);
|
}, [statusText, status]);
|
||||||
|
|
||||||
const setCustomStatus = async (status: string, statusText: string) => {
|
const setCustomStatus = async (status: TUserStatus, statusText: string) => {
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
try {
|
try {
|
||||||
await Services.setUserStatus(status, statusText);
|
await Services.setUserStatus(status, statusText);
|
||||||
dispatch(setUser({ statusText }));
|
dispatch(setUser({ statusText, status }));
|
||||||
logEvent(events.STATUS_CUSTOM);
|
logEvent(events.STATUS_CUSTOM);
|
||||||
showToast(I18n.t('Status_saved_successfully'));
|
showToast(I18n.t('Status_saved_successfully'));
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
|
@ -138,32 +133,26 @@ const StatusView = (): React.ReactElement => {
|
||||||
: e.reason;
|
: e.reason;
|
||||||
logEvent(events.STATUS_CUSTOM_F);
|
logEvent(events.STATUS_CUSTOM_F);
|
||||||
showErrorAlert(messageError);
|
showErrorAlert(messageError);
|
||||||
|
log(e);
|
||||||
}
|
}
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
const status = Accounts_AllowInvisibleStatusOption ? STATUS : STATUS.filter(s => s.id !== 'offline');
|
const statusType = Accounts_AllowInvisibleStatusOption ? STATUS : STATUS.filter(s => s.id !== 'offline');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SafeAreaView testID='status-view'>
|
<SafeAreaView testID='status-view'>
|
||||||
<FlatList
|
<FlatList
|
||||||
data={status}
|
data={statusType}
|
||||||
keyExtractor={item => item.id}
|
keyExtractor={item => item.id}
|
||||||
renderItem={({ item }) => <Status status={item} />}
|
renderItem={({ item }) => <Status statusType={item} status={status} setStatus={setStatus} />}
|
||||||
ListHeaderComponent={
|
ListHeaderComponent={
|
||||||
<>
|
<>
|
||||||
<FormTextInput
|
<FormTextInput
|
||||||
value={statusText}
|
value={statusText}
|
||||||
containerStyle={styles.inputContainer}
|
containerStyle={styles.inputContainer}
|
||||||
onChangeText={text => setStatusText(text)}
|
onChangeText={text => setStatusText(text)}
|
||||||
left={
|
left={<StatusIcon testID={`status-view-current-${status}`} style={styles.inputLeft} status={status} size={24} />}
|
||||||
<StatusIcon
|
|
||||||
testID={`status-view-current-${user.status}`}
|
|
||||||
style={styles.inputLeft}
|
|
||||||
status={user.status}
|
|
||||||
size={24}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
inputStyle={styles.inputStyle}
|
inputStyle={styles.inputStyle}
|
||||||
placeholder={I18n.t('What_are_you_doing_right_now')}
|
placeholder={I18n.t('What_are_you_doing_right_now')}
|
||||||
testID='status-view-input'
|
testID='status-view-input'
|
||||||
|
|
Loading…
Reference in New Issue