I am currently working on a project that requires using rtk query. Is there a way to get unwrapped value by default for mutations.
const [removeStudent] = useRemoveStudentMutation()
and i have the call for removeStudent() within try catch because removeStudent can fail in which case i show an error message. Something like this.
try{
await removeStudent().unwrap()
// logic for showing success message
}
catch(e){
//logic for showing error message
}
problem is if i don't use unwarp i'm getting a success message even when the removeStudent() failed. Is there a way i could make unwrap() apply to all mutations.So that i don't have to use unwrap every time i write a mutation.Maybe at createApi level
Thanks
Related
I have implemented expo-IAP in my app and can purchase the subscription. However, there is no way to check subscription status using EXPO. I am hoping to use this react-native-IAP package so I can simply call subscriptionStatus using storekit2 and check the status. That is the only thing I wish to implement.
Is it possible to simply call this so I can get a true/false?
Here is the current implementation I have, and I get undefined when trying to read it.:
import {endConnection,initConnection,IapIosSk2, setup} from "react-native-iap"
async nativeTest() : Promise<any>{
setup({storekitMode:'STOREKIT2_MODE'})
await initConnection()
const status = await (IapIosSk2).subscriptionStatus('sku')
console.log((JSON.stringify(status) + 'status'))
await endConnection();
return status
}
I think they are different depending on where i put 'await' keyword
{"_1":0,"_2":0,"_3":null,"_4":null}
or
undefined
Is there a way to do this without implementing an entire workflow for IAP?
EDIT: I've debugged and provided an answer to some of my issues below.
I've been researching this issue for a while now and can't seem to find an adequate resolution. As you will see looking at my code, I have a lot to learn. The issue seems to come from trying to display data that hasn't finished fetching despite my redundant placement of await. I am also curious if I should place my getData() function within a useEffect hook? The problem with this is I use the getData() function in my submit button's onClick. So when I run my app, getData() is only available in useEffect's scope.
const getData = async () => {
if(searchData.platform !== "" && searchData.platformUserIdentifier !== ""){
setValidInput(true);
const response = await fetch(`http://localhost:8080/data?platform=${searchData.platform}&username=${searchData.platformUserIdentifier}`);
const json = await response.json();
await finishAllOperations(json)
} else {
setValidInput(false);
}
}
function finishAllOperations(json) {
if(json.code === "ERR_BAD_REQUEST"){
console.log(`Request failed with a status code ${json.status}`);
setErrorMessage(true);
setDisplayTable(false);
} else {
console.log("Request successful");
setMatches(json);
setErrorMessage(false);
setDisplayTable(true)
}
}
const displayMatchRows = matches.map((match,index) => {
//dummy data to populate if reward is available
function checkRewardAvailability(match){
const value = Math.random()
if (value <= .5) {
return true
} else {
return false
}
}
return (
<tr key={match.id}>
<td>{index+1}</td>
<td>{parseDate(match.metadata.endDate.value)}</td>
<td>{match.stats.kills.value}</td>
<td>{match.stats.rankScore.value}</td>
<td>{checkRewardAvailability()?<button className="reward-button">Claim Reward</button>:""}</td>
</tr>
)
})
When I go to deploy my code to my Node server and attempt to submit an API call with the above code I receive the following error:
TypeError: b.map is not a function
Furthermore, when I run my program with my client and server running on separate terminals my code does work and the data does properly get displayed. However, the "Request successful" console log occurs before the fetch has finished running. Obviously, I would like for the "Request successful" (see attached screenshot) to occur after I have completely finished fetching all data.
"Request Success" before fetch finish
I really appreciate any input as on I'm the verge of smashing my computer. Thank you in advance.
I am happy to report after several hours of debugging, the error came from my .env file providing an undefined value because it was not getting moved alongside my package.json file.
Because the .env file was in the wrong place, I was not getting returned an array that .map would work on. Once I realized the error I was receiving had something to do with my server's API call, I was getting an error that went
{"code":"ERR_HTTP_INVALID_HEADER_VALUE"}
This seemed very vague to me and took a while to locate. If you're receiving this error and you are using a .env file, check to be sure it's not returning an undefined value. If it is undefined, then ensure that the .env files is in the same directory as your package.json file.
i am throwing an UserInputError from the Apollo server, the playground is correctly displaying the error with extension and exceptions, but the the apollo client is not showing the extensions and exceptions.
Stringify the error and found that ,we can access it using error.graphQlErrors[0] , it's weird that it's not written anywhere in the documentation. This sure gave me a lot of trouble
The existing answer worked for me. Just providing some more details to help future Googlers.
On the apollo-server backend, we are throwing an error:
throw new UserInputError("Form Arguments invalid", {
field: "name",
});
On the apollo-client frontend, we are catching that error:
try {
// Perform GraphQL mutation.
} catch (error) {
// How do we get the "field" extra info?
}
As the previous answer says, there is some graphQlErrors property that contains extra information. So in this example, I can access error.graphQlErrors[0].extensions.field to get the "name" value.
Using React & Redux & Redux-Thunk, trying to make this pseudocode:
// pseudocode
dispatch(makeServiceRequest)
if failed
dispatch(makeIdentityRequest)
if successful
dispatch(makeServiceRequest)
end
end
Want to avoid an infinite loop which would happen if the code was placed inside the .catch block of makeServiceRequest.
I'm using a fetch(url).then(...).catch(...) logic in the dispatch action. fetch does not reject on HTTP status errors.
How do I make this pseudocode happen? What is the correct pattern to handle a situation like this?
Just have a then that checks HTTP status and throws an error if it isn't a success status just like it says in your link:
function checkStatus(response) {
if (response.status >= 200 && response.status < 300) {
return response
} else {
var error = new Error(response.statusText)
error.response = response
throw error
}
}
fetch(url).then(checkStatus).then(...).catch(...);
Other than that, I'm not clear on what your Redux-specific question is.
Edit: based on your comments, I think you are asking how to manage a Redux actions that, when dispatched, can asynchronously dispatch other actions. One way to model that is as a "saga". There's a Redux library called redux-saga that lets you model this sort of thing.
I am working through Angular Meteor tutorial and got deprecation warning on
this.helpers({
parties: () => {
return Parties.find({}); //deprecation warning. Use getReactively
}
});
But I am not quite sure how to get all records reactively. I do not have any queries to say return Parties.find({field: this.getReactively(query)}). I just want all records/everything similar to Collection.find({}) or Parties.find({}) but without deprecation warning.
Im often use parties: ()=> Parties.find() and I'm has no error or deprecated warning. You maybe should try it.
Beside, sometime I need handle data fetch from query. Im used a temp variable for save data before handle it.
You can try (some code is pseudo code)
parties: () {
this.temp = Parties.find().fetch();
if(this.temp) {
//handle data, adjust property like format string, format date....
return this.temp
}
}
Its work, no deprecated, no error. You can try it.