mirror of
https://github.com/SigNoz/signoz.git
synced 2026-10-07 10:40:42 +01:00
8fa9178b6c
<!--A few plain bullets saying what changed and why, for a reviewer skimming it - not a wall of text, not a restatement of the diff, not generated boilerplate.--> #### Description This adds initial support to create stories for pages of our app, the idea is to start using storybooks to test visual changes (such as changing components, or any colors), instead of using manual testing we can automate with tools such as Chromatic. This initial support focus in add support for basic controls, such as: - license - authz - app shell (banner of the licenses) As initial story, I focused in the home page, there's a lot of things to improve (such as mock of data), and still need to add more testing around how it will behave with pages with nuqs or pages without auth. Any navigation you do inside this page will be blocked, in theory, you can also create stories for specific components but I don't think that worth the value, instead, you can create story of the whole page and add controls over the state of a specific component. I added claude skill to help us adopt this more easily across the codebase. I also combined the providers to avoid drift between what we are using in prod and what we have for storybook, so the change was just to move/reuse the providers without changing the order of the providers. <!--Reference issues using `Closes #issue-number` to enable automatic closure on merge. --> #### Issues closed by this PR Closes https://github.com/SigNoz/engineering-pod/issues/5951 <!--If applicable, include screenshots or screen recordings that clearly show the behavior before the change and the result after the change. --> #### Screenshots / Screen Recordings https://github.com/user-attachments/assets/e0e62022-0b3a-4fbe-80e7-ef62667f1873 About the change of the providers on src/index.tsx, here's the before: <img width="1196" height="1217" alt="screenshot-2026-09-04_10-51-13" src="https://github.com/user-attachments/assets/e38bd4b8-797c-4d6f-9404-94606d9b7077" /> And after: <img width="1193" height="1215" alt="screenshot-2026-09-04_10-48-24" src="https://github.com/user-attachments/assets/4e5d8e39-a343-4038-87d8-4adeea7f5b73" />
4 lines
125 B
Plaintext
4 lines
125 B
Plaintext
*.css linguist-detectable=false
|
|
*.stories.mocks.tsx linguist-generated=true
|
|
**/__story_mockdata__/** linguist-generated=true
|