-
Notifications
You must be signed in to change notification settings - Fork 492
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.
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
Bust cover image cache after uploading a new image #8489
Bust cover image cache after uploading a new image #8489
Conversation
✅ Deploy Preview for care-ohc ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
Converting back to draft as I just saw the comment about cache invalidation #8480 (comment) |
- Refresh cover image on page, right after save - Previously required page reload for changes to show up on page
facilityFetch(); | ||
fetchImage(); | ||
setCoverImageEdited(true); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we wait till the fetch image is done (in the loading state itself of the image edit modal) before running facility fetch?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yes, but ensure the loading state is shown in the image edit modal till it completes.
const [coverImageLoaded, setCoverImageLoaded] = useState(false); | ||
const [coverImageUrl, setCoverImageUrl] = useState<string | undefined>(""); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
And these unnecessay useStates too could be removed that way.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Well, coverImageLoaded is set based on the image load (addressing #8480 (comment)). Can remove the second one though.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
but that state is being used only to decide whether the tooltip should be shown or not right? but when we are going to remove the tooltip anyhow, this state is not needed in the first place right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
but that state is being used only to decide whether the tooltip should be shown or not right? but when we are going to remove the tooltip anyhow, this state is not needed in the first place right?
Yep, but are we removing the tool tip entirely? I thought it was to remove tool tip on successful image load.
yes, but ensure the loading state is shown in the image edit modal till it completes.
Hmm, well the modal closes immediately, so shouldn't be an issue. On a side note, we could use the tool tip here (and remove the coverImageLoaded state).
imageUrl += "?" + Date.now(); | ||
setCoverImageUrl(imageUrl); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's not add query params. We know for sure that it always fetches the latest image with query params present. There's no need to perform the vary header method when giving query params right.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Will remove 👍 I added query params since fetch/vary header behavior wasn't consistent on Firefox (though it's fine on Safari).
credentials: "include", | ||
mode: "no-cors", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
are these headers required? how does this differ from with and without these?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
credentials isn't required, mode is though; was getting 502 error for the fetch call without it.
with ohcnetwork/care#2472 |
Proposed Changes
@ohcnetwork/care-fe-code-reviewers
Merge Checklist