Import React, { useState, useEffect } from "react"; import { View,

Text, ActivityIndicator } from "react-native";

export const SpinnerErrorNotificationApi = {
onPromise: handle => {},
setPromise(
promise,
createSuccessMessage = res => res.message,
createErrorMessage = err => err.message
) {
this.onPromise(promise, createSuccessMessage, createErrorMessage);
}
};

export const SpinnerErrorNotification = props => {
const [state, setState] = useState({
spinner: false,
message: null
});

SpinnerErrorNotificationApi.onPromise = (
promise,
createSuccessMessage,
createErrorMessage
) => {
setState({ ...state, spinner: true });
promise
.then(res => {
const text = createSuccessMessage(res);
setState({
...state,
spinner: false,
message: { text, type: "message" }
});
})
.catch(err => {
const text = createErrorMessage(err);
setState({
...state,
spinner: false,
message: { text, type: "error" }
});
});
};

useEffect(() => {
if (state.message) {
const t = setTimeout(() => {
setState({ ...state, message: { ...state.message, expired: true } });
}, 4000);
return () => clearTimeout(t);
}
});

return (
<View>
{state.spinner && <ActivityIndicator color="#000" />}
{state.message && !state.message.expired && (
<Text
style={{
color: state.message.type === "error" ? "tomato" : "lightskyblue"
}}
>
{state.message.text}
</Text>
)}
</View>
);
};

Воооу

ну тип есть вариант использовать такой подход

по крайней мере сам код