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

feat: Add loading state to ImageGallery (#3462) #4084

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

johannes-ross
Copy link
Contributor

PR Checklist

PR Type

What kind of change does this PR introduce?

Feature (adds functionality)

What is the current behavior?

Images loading in are displayed while they are uncompleted.

What is the new behavior?

When Images load in, there is now the Applications Load Spinner.

Does this PR introduce a breaking change?

No

Git Issues

Closes #3462

Additional Information

I've decided to move the Loadingspinner logic for the thumbnails into their own component, for a couple of reasons:

  1. Keep the ImageGallery state as small as possible (to prevent rerenders)
  2. Prevent rerender data loss, when images load at the exact same time (which is the main Reason)
  3. Make the ImageGallery tighter

packages/components/src/MapFilterList/MapFilterList.tsx and packages/components/src/MemberTypeVerticalList/MemberTypeVerticalList.client.tsx I've only noticed now. I'm guessing they got in while linting/formatting (yarn format && yarn lint).

@johannes-ross johannes-ross requested a review from a team as a code owner January 16, 2025 19:21
Copy link

cypress bot commented Jan 16, 2025

onearmy-community-platform    Run #6784

Run Properties:  status check passed Passed #6784  •  git commit 2548f750d6: feat: Add loading state to ImageGallery (#3462)
Project onearmy-community-platform
Branch Review pull/4084
Run status status check passed Passed #6784
Run duration 05m 34s
Commit git commit 2548f750d6: feat: Add loading state to ImageGallery (#3462)
Committer Johannes Roß
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 2
Tests that did not run due to a developer annotating a test with .skip  Pending 0
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 81
View all changes introduced in this branch ↗︎

@benfurber benfurber added the Review allow-preview ✅ Has received manual check for malicious code and can be safely built for preview label Jan 17, 2025
@benfurber benfurber force-pushed the add-loading-state-to-ImageGallery-3462 branch from 6c0c3e1 to db90f95 Compare January 17, 2025 11:05
Copy link
Member

@benfurber benfurber left a comment

Choose a reason for hiding this comment

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

Nice one, @johannes-ross. I think this works really well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Review allow-preview ✅ Has received manual check for malicious code and can be safely built for preview
Projects
Status: 🆕 New
Development

Successfully merging this pull request may close these issues.

Add loading state to ImageGallery
2 participants