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.

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

Photo upload #1755

Merged
merged 29 commits into from
Apr 5, 2023
Merged

Photo upload #1755

merged 29 commits into from
Apr 5, 2023

Conversation

TheSlimvReal
Copy link
Collaborator

@TheSlimvReal TheSlimvReal commented Mar 7, 2023

see issue: #1569

Visible/Frontend Changes

  • Component allows to display and upload photos

Architectural/Backend Changes

@github-actions
Copy link

github-actions bot commented Mar 7, 2023

Deployed to https://pr-1755.aam-digital.net/

@TheSlimvReal TheSlimvReal marked this pull request as ready for review March 30, 2023 09:01
@TheSlimvReal TheSlimvReal requested a review from sleidig March 30, 2023 09:01
@TheSlimvReal
Copy link
Collaborator Author

TheSlimvReal commented Mar 30, 2023

TODO:

  • Check offline functionality and maybe not request pictures every time (when they are cached)
  • Restrict file types
  • Clicking on photo should increase it

Copy link
Member

@sleidig sleidig left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

UX looks good to me 👍

  • in offline mode photos are currently not cached/displayed

src/app/child-dev-project/children/model/child.ts Outdated Show resolved Hide resolved
src/app/features/file/couchdb-file.service.ts Outdated Show resolved Hide resolved
private reportProgress(message: string, obs: Observable<HttpEvent<any>>) {
loadFile(entity: Entity, property: string): Observable<SafeUrl> {
const path = `${entity.getId(true)}/${property}`;
if (!this.cache[path]) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what happens if the file is updated on another device and synced? Can/should we subscribe to entity updates somewhere to invalidate the cache in such a case?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For new files (no previous value) this works as expected. For the other cases its a general caching question (also across reloads) when and how we get updates. At the moment the limit is the ngsw config not so much this cache here.

Copy link
Collaborator Author

@TheSlimvReal TheSlimvReal Apr 5, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

final approach ->staleWhileRevalidate (with no special in-memory cache handling).
This needs up to 2 reloads until the new photo is shown (1st to get the update, 2nd to serve it)

# Conflicts:
#	src/app/child-dev-project/children/child-block/child-block.component.ts
#	src/app/core/entity-components/entity-utils/dynamic-form-components/edit-component.ts
#	src/app/core/entity-components/entity-utils/dynamic-form-components/edit-photo/edit-photo.component.ts
#	src/app/features/file/edit-file/edit-file.component.ts
"urls": [
"**/child-photos/**"
"**/app-attachments/**/**"
],
"cacheConfig": {
"maxSize": 500,
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do these values (size 500 max age 10 days) still make sense? This means users will have an old image for up to 10 days.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if I understand the docs correctly, after remaining 10 days offline the image will not be displayed at all anymore ("considered invalid and eviced": https://angular.io/guide/service-worker-config#maxage)? In that sense, a big maxAge makes sense for offline support.

Maybe we should change this to the mentioned "staleWhileRevalidate" strategy though? In combination with our in-memory cache that could be a better fit?

Copy link
Member

@sleidig sleidig left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Offline photos also work now and things look good 💯

Only in offline mode a ton of errors and failed requests show in the console. I guess they don't end up in sentry (because they can't be sent without internet?) but for debugging this might pose some pain. Not sure whether we can do anything about it?

@sonarcloud
Copy link

sonarcloud bot commented Apr 5, 2023

SonarCloud Quality Gate failed.    Quality Gate failed

Bug B 1 Bug
Vulnerability A 0 Vulnerabilities
Security Hotspot E 2 Security Hotspots
Code Smell A 1 Code Smell

No Coverage information No Coverage information
0.4% 0.4% Duplication

@TheSlimvReal TheSlimvReal merged commit 07b315b into master Apr 5, 2023
@TheSlimvReal TheSlimvReal deleted the photo_upload branch April 5, 2023 17:10
@aam-digital-ci
Copy link
Collaborator

🎉 This PR is included in version 3.20.0-master.3 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

@aam-digital-ci
Copy link
Collaborator

🎉 This PR is included in version 3.20.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants