I have a many to many relation prisma model. I wan to be able to delete a single item in my table but for whatever reason I am able to delete all the data but I cant delete a single item
Current working delete handle:
const student = await prisma.courseEnrollment.deleteMany({
where: {
id,
studentId: id,
}
})
const studentToDelete = await prisma.student.deleteMany({
where: {
id,
studentId: id,
}
})
But this is not what I want
I tried:
const student = await prisma.courseEnrollment.delete({
where: {
id,
studentId: id,
}
})
const studentToDelete = await prisma.student.delete({
where: {
id,
studentId: id,
}
})
Able to manually delete with this:
const student = await prisma.courseEnrollment.deleteMany({
where: {
studentId: 58
}
})
const studentToDelete = await prisma.student.delete({
where: {
id: 58
}
})
But I am getting Invalid prisma.student.delete() error when handling it on the client side.
handle delete function:
const handleDelete = async (id) => {
const response = await fetch('/api/student/delete/', {
headers: {
"Content-Type": "application/json",
},
});
const data = await response.json();
console.log(data);
router.push("/");
};
<button onClick={() => handleDelete(student.id)}>Delete</button>
I'm I missing something?
Related
I am getting my base64 urls and they are correct because if I send only one image its uploaded correctly to cloudinary but when sending multiple images Ii get an error 'ENAMETOOLONG' with error number 4064
here is my graphql resolver
createEvent: async (args: any, req: any) => {
if (!req.isAuth) {
throw new Error("Unauthenticated!!!!");
}
let imagesArr: any[] = [];
for (let i = 0; i < args.eventInput.images.length; i++) {
const result = await cloudinary.uploader.upload(
args.eventInput.images[i],
{
public_id: `${args.eventInput.title}${new Date(
args.eventInput.date
)}${i}`,
folder: "Eventers",
allowedFormats: ["jpeg", "png", "jpg"],
}
);
console.log(result.url, result.public_id);
imagesArr.push({ public_id: result.public_id, url: result.secure_url });
}
const event = new Event({
title: args.eventInput.title,
description: args.eventInput.description,
price: +args.eventInput.price,
date: new Date(args.eventInput.date),
category: args.eventInput.category,
brief: args.eventInput.brief,
tickets: +args.eventInput.tickets,
images: [...imagesArr],
author: req.userId,
});
let createdEvent;
try {
const result = await event.save();
createdEvent = transformEvent(result);
const author = await User.findById(req.userId);
if (!author) {
throw new Error("User not found.");
}
author.createdEvents.push(event);
await author.save();
return createdEvent;
} catch (error) {
console.log(error);
throw error;
}
},
here is the response i get when trying to submit multiple base64 urls
message: "Unexpected error value: { error: { errno: -4064, code: \"ENAMETOOLONG\", syscall: \"open\", path: \"C:\\\\Users\\\\user\\\\Desktop\\\\graphQl maximillian yt course\\\\bookingEvents\\\\backend\\\\data:image\\\\jpeg;base64,\\\\9j\\\\4AAQSkZJRgABAQAAAQABAAD\\\\2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj\\\\2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj\\\\wAARCAQIAkUDASIAAhEBAxEB\\\\8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL\\\\8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6\\\\8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL\\\\8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uP…"
and here is how i transform the images to base
const fileOnChangeHandler = async (e: ChangeEvent<HTMLInputElement>) => {
let files = Array.from(e.target.files!);
files.forEach((file: any) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onloadend = async () => {
setImageLinks((prevArr: any) => [...prevArr, reader.result]);
};
});
};
and here is how i send the data to the back end
export const fetchAsyncCreateEvents = createAsyncThunk(
"Events/fetchAsyncCreateEvents",
async (eventInput: Event) => {
const {
title,
category,
description,
brief,
price,
date,
tickets,
images,
} = eventInput;
const { data } = await axios.post<Event>(
API,
{
query: `
mutation{
createEvent(eventInput:{title:"${title}",category:"${category}",description:"""${description}""",brief:"${brief}",price:${price},date:"${date}",tickets:${tickets},images:"${images}"}){
author{
email
}
}
}
`,
},
{
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + localStorage.getItem("token"),
},
}
);
return data;
}
);
I've tried alot of things like adding .replace(/(\r\n|\n|\r)/gm,"") to the for loop at each image array index but it didnt work
and here is one of the base 64 urls
"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAQIAkUDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4"
I deleted more than half of the url so I could submit the question.
i solved the problem it was so simple the problem is i am sending the array of images base64 in a wrong way in graphql mutation
i was sending it with a quotation wrapping it and it turned out you have to use quotations only for strings and for arrays you should json.stringify
export const fetchAsyncCreateEvents = createAsyncThunk(
"Events/fetchAsyncCreateEvents",
async (eventInput: Event) => {
const {
title,
category,
description,
brief,
price,
date,
tickets,
images,
} = eventInput;
const { data } = await axios.post<Event>(
API,
{
query: `
mutation{
createEvent(eventInput:{title:"${title}",category:"${category}",description:"""${description}""",brief:"${brief}",price:${price},date:"${date}",tickets:${tickets},images:${JSON.stringify(images)}}){
author{
email
}
}
}
`,
},
{
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + localStorage.getItem("token"),
},
}
);
return data;
}
);
I am receiving data from an api call, taking that data and restructuring it to properly display in a table. When a user clicks a button I am trying to create a copy of that record. I've got it all working, its just not updating the table with the appended, or removed (for delete) data. until after i refresh the page through the browser.
Is it possible to call a function after refetchQueries?
const {
loading: appLoading,
data: applicationsData,
refetch: refetchApplicationsData,
} = useQuery(applications.operations.GET_APPLICATIONS_BY_COMPANY, {
client: applications.client,
variables: { companyId: userDetails.companyId },
})
const [
CloneApplication,
{ loading: cloneLoading, data: cloneData, error: cloneError },
] = useMutation(applications.operations.CLONE_APPLICATION_BY_COMPANY, {
client: applications.client,
onCompleted: () => {
refetchApplicationsData
},
})
useEffect(() => {
if (applicationsData && templatesList) {
const newFinalData = getFinalData({
applicationsList: applicationsData.getApplicationsByCompany,
templatesList: templatesList,
})
console.log('oldFinalData: ', finalData)
console.log('newFinalData: ', newFinalData)
setFinalData(newFinalData)
console.log('updatedFinalData: ', finalData)
}
}, [applicationsData, templatesList])
const cloneAndRefresh = (applicationId, companyId, ucId) => {
CloneApplication({
variables: {
applicationId: applicationId,
companyId: companyId,
ucId: ucId,
},
}).then(({ data: responseData }) => {
if (responseData) {
console.log('response data: ', responseData)
console.log('applications: ', applicationsData)
}
})
}
the function to restructure data:
export function getFinalData(request: {
templatesList: GetAllTemplate[]
applicationsList: GetApplicationsByCompany[]
}): FinalDataResponse[] {
const templates = request.templatesList.map((template) => {
const applicationsForTemplate = request.applicationsList.filter(
(app) => app.templateId === template.templateId
)
return { ...template, applications: applicationsForTemplate }
})
const groupedData = _.chain(templates)
.groupBy('templateId')
.map((value, key) => {
const templateName = _.chain(value)
.groupBy('templateName')
.map((value, key) => key)
.value()
const createdDate = _.chain(value)
.groupBy('dateCreated')
.map((value, key) => dayjs(key).format('ll'))
.value()
const lastModified = _.chain(value)
.groupBy('lastModified')
.map((value, key) => dayjs(key).format('ll'))
.value()
return {
templateId: key,
templateName: templateName[0],
createdDate: createdDate[0],
lastModified: lastModified[0],
applications: value[0].applications,
}
})
.value()
const finalData = groupedData.map((object, index) => {
return {
...object,
totalApplications: object.applications.length,
}
})
console.log('returning final data: ', finalData)
return finalData
}
I guess im trying to rerun getFinalData after the refetchquery then save it to state and it should re-render the table?
EDIT: I've updated my queries with new code, though it didnt quite work. If its possible to get the data from the refetched query I think i could make it work. I assume that refetching the query would update applicationsData as a result but i dont think it did?
By default, the useQuery hook checks the Apollo Client cache to see if all the data you requested is already available locally. If all data is available locally, useQuery returns that data and doesn't query your GraphQL server. This cache-first policy is Apollo Client's default fetch policy. If you say that you will call handleRefresh() after mutation the below code will work fine.
here read fetch policy
const {
loading: appLoading,
data: applicationsData,
refetch: refetchApplicationsData,
} = useQuery(applications.operations.GET_APPLICATIONS_BY_COMPANY, {
client: applications.client,
variables: { companyId: userDetails.companyId },
fetchPolicy: "network-only",
})
I got following 2 values in id and company variable by navigating the screen.
useEffect(() => {
if (props.route && props.route.params) {
console.log("id-->", props.route.params.oved);
console.log("company-->", props.route.params.company);
}
});
e,g i got 2 values like this
id--> 31
company--> 465
I want to pass the id and company value in API params.
api.js : -
const AllFormCardAPI = () => {
const [formAllAPIData, setAllFormAPIData] = useState("");
//NOTE: retrieving loginAuthToken from store
const loginAuthToken = useSelector(
(state) => state.loginAuthTokenReducer.loginAuthToken
);
useEffect(() => {
axios
.get(GET_ALL_FORM, {
//TODO: take parameters from user data currently parameters are static
params: {
company: "984",
employee: "38887683",
DisplayRow: "123456",
},
headers: {
Authorization: `Bearer ${loginAuthToken}`,
},
})
.then((response) => response.data)
.then((data) => setAllFormAPIData(data))
.catch((error) => {
if (error.status === 401) {
//NOTE: handling token expire
return ExpireAlertRestart();
} else {
Alert.alert(error.message);
}
})
.finally(() => console.log("finally block all form api", formAllAPIData));
}, []);
};
i want to pass those 2 values i,e id and company from navigation which I mentioned above and those has to be passed as string to following in API params.
My new API params should look like this. The id value should replace in employee params and company value should replace in company params.
params: {
company: "465",
employee: "31",
action.js:--
import { CHANGE_SELECTED_COMPANY } from "./action-constants";
export const changeCompany = (updatedCompany, updatedId) => {
return {
type: CHANGE_SELECTED_COMPANY,
updatedCompany,
updatedId,
};
};
reducer.js:--
import { CHANGE_SELECTED_COMPANY } from "../actions/action-constants";
const initialState = {
company: "",
id: "",
};
const changeCompanyReducer = (state = initialState, action) => {
switch (action.type) {
case CHANGE_SELECTED_COMPANY:
return {
company: {
company: action.updatedCompany,
id: action.updatedId,
},
};
}
return state;
};
export default changeCompanyReducer;
congigure-store.js:--
import changeCompanyReducer from "./reducers/change-company-reducer";
const rootReducer = combineReducers({changeCompanyReducer});
How can i store the update values getting from navigation in Redux?
could you please write code for redux??
const AllFormCardAPI = (props) => {
//New lines
const id = props?.route?.params?.oved;
const company = props?.route?.params?.company;
//New lines end
const [formAllAPIData, setAllFormAPIData] = useState("");
//NOTE: retrieving loginAuthToken from store
const loginAuthToken = useSelector(
(state) => state.loginAuthTokenReducer.loginAuthToken
);
useEffect(() => {
axios
.get(GET_ALL_FORM, {
//TODO: take parameters from user data currently parameters are static
params: {
company: company,
employee: id,
DisplayRow: "123456",
},
headers: {
Authorization: `Bearer ${loginAuthToken}`,
},
})
.then((response) => response.data)
.then((data) => setAllFormAPIData(data))
.catch((error) => {
if (error.status === 401) {
//NOTE: handling token expire
return ExpireAlertRestart();
} else {
Alert.alert(error.message);
}
})
.finally(() => console.log("finally block all form api", formAllAPIData));
}, []);
};
I created a route here where in I am planning to post or update on this route via updateResortOwner:
router.route('/:userid').get(getOwnerResorts, resortOwner).post(protect, resortOwner, createOwnerResort)
router.route('/:userid/:id').get(getResortOwnerById).put(protect, resortOwner, updateResortOwner).delete(protect, resortOwner, deleteResortOwner)
On my controller I have this:
// #description Update a resort
// #route PUT /api/resorts/:userid
// #access Private/Admin
const updateResortOwner = expressAsyncHandler(async (req, res) => {
const {
name,
price_per_night,
description,
address,
city,
province,
zip_code,
latitude,
longitude,
phone,
website,
amenities,
image
} = req.body
const resort = await Resort.findById(req.params.id)
if(resort){
resort.name = name,
resort.price_per_night = price_per_night
resort.description = description
resort.address = address
resort.city = city
resort.province = province
resort.zip_code = zip_code
resort.latitude = latitude
resort.longitude = longitude
resort.phone = phone
resort.website = website
resort.amenities = amenities
resort.image = image
const updatedResort = await resort.save()
res.json(updatedResort)
} else{
res.status(404)
throw new Error('Resort not found!')
}
})
In order to make this work on my redux action:
export const updateResortOwner = (resort) => async (dispatch, getState) => {
try {
dispatch({ type: RESORT_OWNER_UPDATE_REQUEST })
const { userLogin: { userInfo } } = getState()
const config = {
headers: {
'Content-Type': 'application/json',
Authorization: `Bearer ${userInfo.token}`
}
}
const { data } = await axios.post(`/api/resorts/${userInfo._id}/${resort._id}`, resort, config)
dispatch({
type: RESORT_OWNER_UPDATE_SUCCESS,
payload: data
})
} catch (error) {
dispatch({
type: RESORT_OWNER_UPDATE_FAIL,
payload: error.response && error.response.data.message ?
error.response.data.message : error.message
})
}
}
And then on my submithandler on the frontend:
const submitHandler = (e) => {
e.preventDefault()
dispatch(updateResortOwner({
_id: resortId,
name,
price_per_night: pricePerNight,
description,
address,
city,
province,
zip_code: zipCode,
phone,
email,
website,
image,
amenities: {
tv,
reservation,
moderate_noise: moderateNoise,
free_wifi: freeWifi,
trendy,
credit_card: creditCard,
bar,
animals,
kids
}
}))
}
When I submit this its returning this error:
Not found - /api/resorts/5fe92b7a1ecf1a16e8ced784/5fe1798bebef0c2db08d4c76
Any idea what's happening here? How can I fix this?
OK so kinda new here.
So currently I have data in the backend where I needed to pull it using a specific id so it gets the specific data for that user. In the backend, I just need to put it as an argument. In the front end, I'm able to pull the owner "ID" that I need to put in the argument I just don't know if I am doing it right here is my code for my front-end and server controller.also here is the pic of my logs 16 is the code for the specific user that i using enter image description here
class GetDogs extends Component {
constructor(props) {
super(props);
this.state = {
id: "",
dogs: []
};
}
async componentDidMount() {
//destructure get user function
const { getUser } = this.props;
//call function to get user info
await getUser();
//sets state into owner_id that i need to be put as the argument for my get dog's function
await this.setState({ id: this.props.userReducer.user.owner_id });
//call axios to bring dog info
await axios
.get(`/api/yourdogs`, {
owner_id: this.state.id
})
.then(response => {
this.setState({ dogs: response.data });
});
}
render() {
console.log(this.state.id);
console.log(this.state.dogs);
return <div>get dogs</div>;
}
}
const mapStateToProps = state => state;
export default connect(
mapStateToProps,
{ getUser }
)(GetDogs);
module.exports = {
newDog(req, res) {
const db = req.app.get("db");
const { name, age, picture, breed, sex, owner_id } = req.body;
db.newDog([name, age, picture, breed, sex, owner_id])
.then(response => {
res.status(200).send(response);
})
.catch(console.log);
},
getDogs(req, res) {
const db = req.app.get("db");
const { owner_id } = req.body;
db.getDogs([owner_id])
.then(response => res.status(200).json(response))
.catch(console.log);
}
};
instead of doing like this :
...
await this.setState({ id: this.props.userReducer.user.owner_id });
//call axios to bring dog info
await axios
.get(`/api/yourdogs`, {
owner_id: this.state.id // i don't think this.state.id is already assign new value
})
.then(response => {
this.setState({ dogs: response.data });
});
...
so, try it like this :
...
this.setState({ id: this.props.userReducer.user.owner_id }, () => {
//call axios to bring dog info
axios
.get(`/api/yourdogs`, {
owner_id: this.state.id
})
.then(response => {
this.setState({ dogs: response.data });
});
});
...