Skip to content

Expand Overview stories with empty, loading, and error states #3412

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

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

1012Charan
Copy link

@1012Charan 1012Charan commented May 31, 2025

Adds 3 Storybook stories for the Overview component:

  • EmptyState (shows the UI when there's no data available)
  • LoadingState (shows a spinner while data is being fetched)
  • ErrorState (simulates when data fails to load)

Screenshots for new stories :
EmptyState
Image 20-06-25 at 3 20 PM
LoadingState
Image 20-06-25 at 3 20 PM (1)
ErrorState
Image 20-06-25 at 3 21 PM

Note: I noticed that the Empty, Loading, and Error states all look quite similar in Storybook — they seem to show the same fallback message or UI. I'm assuming this is expected because the Overview component handles these cases in a similar way with mock data, but please let me know if I might have missed something!

Copy link

linux-foundation-easycla bot commented May 31, 2025

CLA Signed

The committers listed above are authorized under a signed CLA.

@k8s-ci-robot
Copy link
Contributor

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: 1012Charan
Once this PR has been reviewed and has the lgtm label, please assign sniok for approval. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@k8s-ci-robot k8s-ci-robot added the cncf-cla: no Indicates the PR's author has not signed the CNCF CLA. label May 31, 2025
@k8s-ci-robot
Copy link
Contributor

Welcome @1012Charan!

It looks like this is your first PR to kubernetes-sigs/headlamp 🎉. Please refer to our pull request process documentation to help your PR have a smooth ride to approval.

You will be prompted by a bot to use commands during the review process. Do not be afraid to follow the prompts! It is okay to experiment. Here is the bot commands documentation.

You can also check if kubernetes-sigs/headlamp has its own contribution guidelines.

You may want to refer to our testing guide if you run into trouble with your tests not passing.

If you are having difficulty getting your pull request seen, please follow the recommended escalation practices. Also, for tips and tricks in the contribution process you may want to read the Kubernetes contributor cheat sheet. We want to make sure your contribution gets all the attention it needs!

Thank you, and welcome to Kubernetes. 😃

@k8s-ci-robot k8s-ci-robot added size/M Denotes a PR that changes 30-99 lines, ignoring generated files. cncf-cla: yes Indicates the PR's author has signed the CNCF CLA. and removed cncf-cla: no Indicates the PR's author has not signed the CNCF CLA. labels May 31, 2025
Copy link
Contributor

Choose a reason for hiding this comment

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

Thanks @1012Charan . Can you adapt the commit title to be more consistent with our current format:
frontend: Expand Overview stories with empty, loading, and error states

Copy link
Author

Choose a reason for hiding this comment

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

Thanks @joaquimrocha, I've updated the commit message as suggested. Please let me know if anything else is needed.

@1012Charan 1012Charan force-pushed the add-overview-story-variants branch from 0b42c67 to 752234f Compare June 12, 2025 12:16
Copy link
Contributor

@skoeva skoeva left a comment

Choose a reason for hiding this comment

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

Looks solid, would be nice to have screenshots in the description for the new stories

Also good to rebase against main to pull the latest changes

@1012Charan
Copy link
Author

Thanks for the suggestion @skoeva! I've updated this branch added the screenshots, but I noticed that all three states — Empty, Loading, and Error — look almost the same in Storybook. I’m not sure if that’s okay or if I might have missed something, so please let me know if any changes are needed!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cncf-cla: yes Indicates the PR's author has signed the CNCF CLA. size/M Denotes a PR that changes 30-99 lines, ignoring generated files.
Projects
Development

Successfully merging this pull request may close these issues.

4 participants