PacktPublishing / Rapid-Application-Development-with-AWS-Amplify

Rapid Application Development with AWS Amplify, published by Packt
MIT License
32 stars 25 forks source link

unsubscribe function #1

Open misbell opened 3 years ago

misbell commented 3 years ago
  if (createSubscription.unsubscribe != undefined) { 
    createSubscription.unsubscribe();
  };

  if (updateSubscription.unsubscribe != undefined) { 
    updateSubscription.unsubscribe();
  }

  if (deleteSubscription.unsubscribe != undefined) {  
    deleteSubscription.unsubscribe();
  }

you really need this during development

otherwise errors all the time

misbell commented 3 years ago

(this is all working chapter 5)

also various errors:

1 "setting timer for a long period of time" error on Android

2 create works fine, but neither post nor delete do:

LOG error upating post: {"data": {"updatePost": null}, "errors": [{"data": null, "errorInfo": null, "errorType": "DynamoDB:ConditionalCheckFailedException", "locations": [Array], "message": "The conditional request failed (Service: DynamoDb, Status Code: 400, Request ID: 84FAU2D14K19UU4VDFNPCLKBV7VV4KQNSO5AEMVJF66Q9ASUAAJG, Extended Request ID: null)", "path": [Array]}]}

LOG deleting post 19d3408a-36c4-4f37-a222-9525012c0c15 LOG error deleting post: {"data": null, "errors": [{"locations": null, "message": "The variables input contains a field name 'id' that is not defined for input object type 'DeletePostInput' ", "path": null}]}

3 often id/key errors

I'll post my code. I used styled-components instead of Stylesheet, which few React Native developers use these days.

misbell commented 3 years ago

updating post {"content": "Hurricane Ida runs along the East Coast", "createdAt": "2021-09-05T17:15:59.932Z", "id": "", "title": "Climate change ok", "updatedAt": "2021-09-05T17:16:39.903Z"}

doesn't seem to be an id associated with it.

misbell commented 3 years ago

Warning: Each child in a list should have a unique "key" prop.

also getting this error when I start the app

I am guessing because there are no id's in the record I've created

misbell commented 3 years ago

created post {"data": {"createPost": {"content": "the new governor", "createdAt": "2021-09-06T00:13:49.869Z", "id": "30c10391-45a0-456b-b155-72be26aa311b", "title": "Nancy Hochul", "updatedAt": "2021-09-06T00:13:49.869Z"}}}

well, there's the ID big as life when i create the post. what the heck is happening to it???

misbell commented 3 years ago

by substituting result here: setPosts([...posts, result] as SetStateAction<never[]>);

I now get an id in the update attempt

LOG updating post {"content": "it's almost out of water", "createdAt": "2021-09-06T00:21:56.162Z", "id": "54d943a3-0cdc-4ef4-bb72-9f3ba133e5de", "title": "Colorado river crisis update", "updatedAt": "2021-09-06T00:21:56.162Z"}

but the update still fails

LOG error upating post: {"data": {"updatePost": null}, "errors": [{"data": null, "errorInfo": null, "errorType": "DynamoDB:ConditionalCheckFailedException", "locations": [Array], "message": "The conditional request failed (Service: DynamoDb, Status Code: 400, Request ID: 8EMBNJQ1HUREQDT50VL6RE00PVVV4KQNSO5AEMVJF66Q9ASUAAJG, Extended Request ID: null)", "path": [Array]}]}

so i guess the id didn't matter...

misbell commented 3 years ago

also: "Possible Unhandled Promise Rejection(id: 0) when I start the app.

misbell commented 3 years ago

So...lots of problems with the code as written, in a React Native app. Not to diminish the book--it's a good book and I've learned a lot from it. I get 'the general idea' in a nice form, and I'm sure I'll be able to chase down a lot of the problems. But even so...be nice if this worked a bit better.

misbell commented 3 years ago

in ch6, for ImagePickerResponse, 'response.uri' - uri is not a property on ImageResponsePicker.

misbell commented 3 years ago

FYI, this worked for the response picker. uri is a keyed value pair as an object in the response.assets array.

   let assets = response.assets
      let uriAsset: Asset = assets[0];

      for (var i = 0; i < assets.length; i++) {
        if (assets[i].name === "uri") {
          uriAsset = assets[i];
        }
      }

      setImg(uriAsset.uri as string);
      if (uriAsset.uri as string) {
        const file: any = uriAsset.uri;
misbell commented 3 years ago

The post with photo works nicely as long as I don't include:

return () => {
   if (createSubscription.unsubscribe != undefined) {
     createSubscription.unsubscribe();
   };

   if (updateSubscription.unsubscribe != undefined) {
     updateSubscription.unsubscribe();
   }

   if (deleteSubscription.unsubscribe != undefined) {
     deleteSubscription.unsubscribe();
   }

 };

When I do include that, then:

LOG fetching posts ERROR Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

it looks like unsubscribing has a side effect? or like some task isn't complete yet?

misbell commented 3 years ago
Screen Shot 2021-09-06 at 3 53 43 PM Screen Shot 2021-09-06 at 3 54 10 PM

but not too shabby for a first try. I'd like to work with you to clean up the code in this book, though. I'm around this week.

rchamarthi commented 1 year ago

Thanks @misbell for posting the issues and the solutions you found that worked. I am faced some of the same issues... I wish your changes were merged into the actual code to have a more up to date reference.