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

PM-14051-storybook-implementation #12840

Merged
merged 12 commits into from
Jan 15, 2025
Merged

Conversation

dan-livefront
Copy link
Collaborator

@dan-livefront dan-livefront commented Jan 13, 2025

🎟️ Tracking

https://bitwarden.atlassian.net/browse/PM-14051

📔 Objective

Currently, our instance of Storybook does not support rendering Lit components. To address this, a temporary separate instance of Storybook has been created specifically for Lit component stories. This setup will remain in place until the two instances can be merged into a single, unified environment.

To ensure the current Storybook instance retains its original functionality without interference, the Lit component stories have been named with the .lit-stories.ts suffix, deviating from the usual .stories naming convention. This approach allows each Storybook instance to exclusively recognize its intended set of stories.

Additionally, each story has been organized into its own directory within a dedicated stories folder. This structure is designed to facilitate the addition of documentation for each story in an upcoming PR.

Note: Followed docs for SB and was required to add web components package.

📸 Screenshots

Screenshot 2025-01-14 at 3 27 43 PM

⏰ Reminders before review

  • Contributor guidelines followed
  • All formatters and local linters executed and passed
  • Written new unit and / or integration tests where applicable
  • Protected functional changes with optionality (feature flags)
  • Used internationalization (i18n) for all UI strings
  • CI builds passed
  • Communicated to DevOps any deployment requirements
  • Updated any necessary documentation (Confluence, contributing docs) or informed the documentation team

🦮 Reviewer guidelines

  • 👍 (:+1:) or similar for great changes
  • 📝 (:memo:) or ℹ️ (:information_source:) for notes or general info
  • ❓ (:question:) for questions
  • 🤔 (:thinking:) or 💭 (:thought_balloon:) for more open inquiry that's not quite a confirmed issue and could potentially benefit from discussion
  • 🎨 (:art:) for suggestions / improvements
  • ❌ (:x:) or ⚠️ (:warning:) for more significant problems or concerns needing attention
  • 🌱 (:seedling:) or ♻️ (:recycle:) for future improvements or indications of technical debt
  • ⛏ (:pick:) for minor or nitpick changes

-Initial stories and folder structure
Copy link
Contributor

github-actions bot commented Jan 13, 2025

Logo
Checkmarx One – Scan Summary & Details286f7ebe-3c8c-4156-8f3a-d950f144d3af

Fixed Issues (173)

Great job! The following issues were fixed in this Pull Request

Severity Issue Source File / Package
MEDIUM Client_Privacy_Violation /bitwarden_license/bit-web/src/app/tools/access-intelligence/org-at-risk-apps-dialog.component.html: 15
MEDIUM Client_Privacy_Violation /bitwarden_license/bit-web/src/app/tools/access-intelligence/org-at-risk-members-dialog.component.html: 17
MEDIUM Client_Privacy_Violation /libs/tools/generator/components/src/username-generator.component.html: 3
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 467
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/desktop/src/vault/app/vault/view.component.html: 494
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /libs/vault/src/components/download-attachment/download-attachment.component.ts: 29
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /libs/vault/src/components/download-attachment/download-attachment.component.ts: 29
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 78
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103
MEDIUM Client_Privacy_Violation /apps/web/src/app/vault/individual-vault/view.component.ts: 103

More results are available on the CxOne platform

Copy link

codecov bot commented Jan 13, 2025

Codecov Report

Attention: Patch coverage is 0% with 117 lines in your changes missing coverage. Please review.

Project coverage is 34.33%. Comparing base (494d349) to head (521ab24).
Report is 2 commits behind head on main.

✅ All tests successful. No failed tests found.

Files with missing lines Patch % Lines
.../components/lit-stories/icons/icons.lit-stories.ts 0.00% 23 Missing ⚠️
...autofill/content/components/.lit-storybook/main.ts 0.00% 15 Missing ⚠️
...s/lit-stories/ciphers/cipher-action.lit-stories.ts 0.00% 7 Missing ⚠️
...nts/lit-stories/ciphers/cipher-icon.lit-stories.ts 0.00% 7 Missing ⚠️
...ories/ciphers/cipher-indicator-icon.lit-stories.ts 0.00% 7 Missing ⚠️
...nents/lit-stories/notification/body.lit-stories.ts 0.00% 7 Missing ⚠️
...s/lit-stories/buttons/action-button.lit-stories.ts 0.00% 6 Missing ⚠️
...ts/lit-stories/buttons/badge-button.lit-stories.ts 0.00% 6 Missing ⚠️
...ts/lit-stories/buttons/close-button.lit-stories.ts 0.00% 6 Missing ⚠️
...nts/lit-stories/buttons/edit-button.lit-stories.ts 0.00% 6 Missing ⚠️
... and 5 more
Additional details and impacted files
@@            Coverage Diff             @@
##             main   #12840      +/-   ##
==========================================
- Coverage   34.38%   34.33%   -0.05%     
==========================================
  Files        2950     2965      +15     
  Lines       90418    90535     +117     
  Branches    16974    16977       +3     
==========================================
  Hits        31087    31087              
- Misses      56867    56984     +117     
  Partials     2464     2464              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Copy link
Contributor

@jprusik jprusik left a comment

Choose a reason for hiding this comment

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

LGTM; nice work!

@dan-livefront dan-livefront marked this pull request as ready for review January 15, 2025 18:44
@dan-livefront dan-livefront requested a review from a team as a code owner January 15, 2025 18:44
@dan-livefront dan-livefront merged commit 99937e5 into main Jan 15, 2025
84 checks passed
@dan-livefront dan-livefront deleted the PM-14051-storybook-implementation branch January 15, 2025 19:13
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.

2 participants