Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Category label is not updated after adding one category #481

Closed
MrOrz opened this issue Apr 9, 2022 · 3 comments · Fixed by #575
Closed

Category label is not updated after adding one category #481

MrOrz opened this issue Apr 9, 2022 · 3 comments · Fixed by #575
Labels
bug good first issue help wanted

Comments

@MrOrz
Copy link
Member

MrOrz commented Apr 9, 2022 •
edited
Loading

After adding a category, currently there is no any visual feedback that tells the user that the category is added.

no-response

Current workaround: refresh the whole page
Expected: UI should show that the category is added immediately (or shortly after API response)
@marcussfu
Copy link
Contributor

I want to fix the issue.

@jiru
Copy link
Contributor

jiru commented Jul 23, 2024 •
edited
Loading

Working on this.
I think this bug was introduced by cf550a0.
Console shows this error:

Invariant Violation: Can't find field articleCategories on object {
  "id": "91m530brhhfo",
  "text": ...
  ...
  "articleCategories({\"statuses\":[\"NORMAL\"]})": [
    {
      "type": "id",
      "generated": false,
      "id": "ArticleCategory:91m530brhhfo__oT2o7nEBrIRcahlYKQoM",
      "typename": "ArticleCategory"
    }
  ],
  "stats": [
    ...
  ],
  "user": {
    ...
  }
}

cache.readFragment() (called in components/ArticleCategories/CategoryOption.js) throws an error because the key of the categories array in cache is articleCategories({"statuses":["NORMAL"]}) instead of the expected articleCategories.

To work around the problem, I suggest we always fetch all categories (remove statuses filter in query) and instead we change the display of categories according to whether the user is blocked and category status equals BLOCKED.

jiru added a commit to jiru/rumors-site that referenced this issue Jul 23, 2024
@jiru
Fix UI when adding categories to articles
adb920f 
Closes cofacts#481.

The reason the UI was not refreshed was a regression introduced by cf550a0.
Adding the argument "(statuses: $articleCategoryStatuses)" changes the key used by InMemoryCache
from "articleCategories" to "articleCategories({"statuses":["NORMAL"]})".
This results in cache.readFragment() (called in components/ArticleCategories/CategoryOption.js throwing this error:
```
Invariant Violation: Can't find field articleCategories on object {
  "id": ...,
  "text": ...
  ...
  "articleCategories({\"statuses\":[\"NORMAL\"]})": [
    {
      "type": "id",
      "generated": false,
      "id": "ArticleCategory:...__...",
      "typename": "ArticleCategory"
    }
  ],
  "stats": [
    ...
  ],
  "user": {
    ...
  }
}
```

This commits solves this issue by forcing the key to be "articleCategories".

The technique of using an @connection directive is documented here:
https://www.apollographql.com/docs/react/data/directives/#connection
@jiru jiru mentioned this issue Jul 23, 2024
Merged
@jiru
Copy link
Contributor

jiru commented Jul 23, 2024

Eventually I found a simpler way to solve the problem; please have look at my PR 🙂

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug good first issue help wanted
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix UI when adding categories to articles jiru/rumors-site
3 participants
@MrOrz @jiru @marcussfu