App is getting crashed in `localhost` on latest `develop`

[PiyushChandra17]

p5.js version

2.9.2

What is your operating system?

Mac OS

Web browser and version

Chrome and 117.0.5938.132

Actual Behavior

Error: UnknownEndpoint: Inaccessible host: s3.' at port undefined'. This service may not be available in the `' region.

Expected Behavior

App should work fine

Steps to reproduce

Steps:

1.Click on My sketches
2.Verify that the app crashes

[lindapaiste]

Ok there are two things going on here. One is that I think your dev environment is not set up properly with S3. But that brings me to issue two, which is what I'm more concerned with. The whole app should not crash just because an API request failed.

We have a lot of catch clauses that make assumptions about the shape/type of the error variable. This has been on my radar for a while, and there are some instances that I've fixed in pending PRs but I don't know if I've got them all. Maybe I need to create a new issue to track progress (or maybe use this one?).

The problem in the code is right here:

p5.js-web-editor/client/modules/IDE/actions/projects.js

Lines 24 to 32 in 031c3d0

	.catch((error) => {
	const { response } = error;
	dispatch({
	type: ActionTypes.ERROR,
	error: response.data
	});
	dispatch(stopLoader());
	});
	};

error could be any caught error, but this code will only work if error is an object with a property response which is an object. If there is no error.response then the whole app will crash as you are seeing here.

Here's a PR where I fixed a similar problem in a different thunk action, getCollections, by using optional chaining to prevent fatal errors if error.response is undefined.

p5.js-web-editor/client/modules/IDE/actions/collections.js

Lines 27 to 33 in 0c0163b

	.catch((error) => {
	dispatch({
	type: ActionTypes.ERROR,
	error: error?.response?.data
	});
	dispatch(stopLoader());
	});