chore(service-portal): No scope notifications #15053
Conversation
thordurhhh
added
the
deprecated:automerge
WalkthroughThe updates introduce a new Changes
Sequence Diagram(s) (Beta)sequenceDiagram
participant User
participant ServicePortal
participant AuthService
participant DocumentsEmpty
User->>ServicePortal: Access Dashboard
ServicePortal->>AuthService: Fetch User Info
AuthService-->>ServicePortal: Return User Info
ServicePortal->>DocumentsEmpty: Render DocumentsEmpty with hasDelegationAccess
DocumentsEmpty-->>User: Display appropriate message and icon
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
Datadog ReportAll test runs ✅ 68 Total Test Services: 0 Failed, 66 Passed Test ServicesThis report shows up to 10 services
🔻 Code Coverage Decreases vs Default Branch (4) |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #15053 +/- ##
==========================================
- Coverage 37.13% 37.13% -0.01%
==========================================
Files 6396 6395 -1
Lines 130148 130161 +13
Branches 37131 37149 +18
==========================================
+ Hits 48334 48336 +2
- Misses 81814 81825 +11
Flags with carried forward coverage won't be shown. Click here to find out more. see 6 files with indirect coverage changes Continue to review full report in Codecov by Sentry.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Outside diff range and nitpick comments (2)
apps/service-portal/src/components/Notifications/Notifications.css.ts (1)
16-26: Add comments to describe the purpose of thenoScopestyles.It would be beneficial to add comments explaining the purpose of the
noScopestyles, especially since they are related to the disabled state of buttons. This can help maintainers understand the context and usage of these styles quickly.apps/service-portal/src/components/Notifications/NotificationButton.tsx (1)
Line range hint
19-61: Refactor to improve readability and maintainability.Consider destructuring
propsdirectly in the function parameter to clean up the component's body and improve readability:- const NotificationButton = ({ setMenuState, showMenu = false, disabled }: Props) => { + const NotificationButton: React.FC<Props> = ({ setMenuState, showMenu = false, disabled }) => {This change makes it clear that
NotificationButtonis a functional component and improves the clarity of props usage.
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (7)
- apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.css.ts (1 hunks)
- apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx (1 hunks)
- apps/service-portal/src/components/Header/Header.tsx (4 hunks)
- apps/service-portal/src/components/Layout/FullWidthLayout.tsx (2 hunks)
- apps/service-portal/src/components/Notifications/NotificationButton.tsx (2 hunks)
- apps/service-portal/src/components/Notifications/Notifications.css.ts (1 hunks)
- apps/service-portal/src/screens/Dashboard/Dashboard.tsx (2 hunks)
Files skipped from review due to trivial changes (1)
- apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.css.ts
Additional context used
Path-based instructions (6)
apps/service-portal/src/components/Notifications/Notifications.css.ts (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/service-portal/src/components/Notifications/NotificationButton.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/service-portal/src/components/Layout/FullWidthLayout.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/service-portal/src/components/Header/Header.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/service-portal/src/screens/Dashboard/Dashboard.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
Biome
apps/service-portal/src/components/Notifications/NotificationButton.tsx
[error] 8-9: All these imports are only used as types.
apps/service-portal/src/components/Layout/FullWidthLayout.tsx
[error] 1-1: Some named imports are only used as types.
[error] 16-17: All these imports are only used as types.
apps/service-portal/src/components/Header/Header.tsx
[error] 50-50: Do not use template literals if interpolation and special-character handling are not needed.
[error] 47-47: This hook does not specify all of its dependencies: featureFlagClient.getValue
apps/service-portal/src/screens/Dashboard/Dashboard.tsx
[error] 70-70: Change to an optional chain.
[error] 83-83: Template literals are preferred over string concatenation.
[error] 1-1: The default import and some named imports are only used as types.
[error] 56-56: This hook does not specify all of its dependencies: IS_COMPANY
[error] 56-56: This hook specifies more dependencies than necessary: location
[error] 75-154: This block statement doesn't serve any purpose and can be safely removed.
[error] 83-83: Avoid using the index of an array as key property in an element.
Additional comments not posted (3)
apps/service-portal/src/components/Layout/FullWidthLayout.tsx (1)
Line range hint
22-67: Verify the new authentication and scope checks.Ensure that the new authentication logic and scope checks introduced in
FullWidthLayout.tsxare consistently implemented across the application. This script searches for usage patterns to verify consistency.Verification successful
The search results indicate that both
useAuthandDocumentsScopeare widely used across the codebase. The new authentication and scope checks introduced inFullWidthLayout.tsxappear to be consistent with other parts of the application.
useAuthis used in various components and hooks across multiple modules.DocumentsScopeis used in several modules, including service-portal, documents, notifications, and user-profile.Given the extensive usage and consistent pattern, the new authentication and scope checks in
FullWidthLayout.tsxseem to be correctly implemented.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify that the new authentication and scope checks are correctly implemented across the application. # Test: Search for usage of `useAuth` and `DocumentsScope` to ensure they are correctly implemented. rg --type typescript $'useAuth' rg --type typescript $'DocumentsScope'Length of output: 138
Script:
#!/bin/bash # Description: Verify that the new authentication and scope checks are correctly implemented across the application. # Test: Search for usage of `useAuth` and `DocumentsScope` to ensure they are correctly implemented. rg 'useAuth' --glob '*.ts' --glob '*.tsx' rg 'DocumentsScope' --glob '*.ts' --glob '*.tsx'Length of output: 22450
apps/service-portal/src/components/Header/Header.tsx (1)
Line range hint
29-134: Check the implementation of feature flags and conditional rendering.Ensure that the feature flags and conditional rendering logic in
Header.tsxare correctly implemented and tested across the application. This script searches for usage patterns to verify consistency.Verification successful
The search results indicate that the
featureFlagClientandenableNotificationFlagare used in multiple places across the codebase, including theHeader.tsxfile. The implementation of feature flags and conditional rendering logic appears to be consistent with the usage patterns found.
featureFlagClientis used to fetch feature flag values asynchronously.enableNotificationFlagis used for conditional rendering based on the feature flag value.The implementation in
Header.tsxaligns with these patterns, ensuring that the feature flag is checked and the UI is conditionally rendered based on its value.
apps/service-portal/src/components/Header/Header.tsx:
featureFlagClientis used to fetch the feature flag value.enableNotificationFlagis used to conditionally render theNotificationButton.This confirms that the feature flags and conditional rendering logic are correctly implemented in the
Header.tsxfile.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify that the feature flags and conditional rendering logic are correctly implemented and tested. # Test: Search for usage of `featureFlagClient` and conditional rendering logic to ensure they are correctly implemented. rg --type typescript $'featureFlagClient' rg --type typescript $'enableNotificationFlag'Length of output: 156
Script:
#!/bin/bash # Description: Verify that the feature flags and conditional rendering logic are correctly implemented and tested. # Test: Search for usage of `featureFlagClient` and conditional rendering logic to ensure they are correctly implemented. rg --type ts 'featureFlagClient' rg --type ts 'enableNotificationFlag'Length of output: 9411
apps/service-portal/src/screens/Dashboard/Dashboard.tsx (1)
237-237: Ensure correct conditional rendering based on delegation access.This script checks if the conditional rendering logic based on
hasDelegationAccessinDashboard.tsxis consistently implemented across the application.Verification successful
The search results indicate that
hasDelegationAccessis used in bothDashboard.tsxandDocumentsEmpty.tsxfor conditional rendering. Here are the relevant locations:
apps/service-portal/src/screens/Dashboard/Dashboard.tsx
- Line 237:
<DocumentsEmpty hasDelegationAccess={!!hasDelegationAccess} />- Line 236:
const hasDelegationAccess = userInfo?.scopes?.includes(DocumentsScope.main)- Line 238:
{hasDelegationAccess && (
apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx
- Line 1:
hasDelegationAccess: boolean- Line 2:
export const DocumentsEmpty = ({ hasDelegationAccess }: Props) => {- Line 3:
{hasDelegationAccess- Line 4:
{hasDelegationAccess ? (- Line 5:
hasDelegationAccess- Line 6:
{!hasDelegationAccess && (The conditional rendering based on
hasDelegationAccessappears to be correctly implemented in these files.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify that the conditional rendering based on delegation access is correctly implemented across the application. # Test: Search for usage of `hasDelegationAccess` to ensure it is correctly implemented. rg --type typescript $'hasDelegationAccess'Length of output: 77
Script:
#!/bin/bash # Description: Verify that the conditional rendering based on delegation access is correctly implemented across the application. # Test: Search for usage of `hasDelegationAccess` to ensure it is correctly implemented. rg --type ts 'hasDelegationAccess'Length of output: 1043
apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx
Outdated
Show resolved
Hide resolved
apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx
Outdated
Show resolved
Hide resolved
apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (1)
- apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx
What
Update ui when no scope available for notifications.
Why
Minor adjustments needed in header and dashboard.
Screenshots / Gifs
Checklist:
Summary by CodeRabbit
New Features
DocumentsEmptycomponent to display messages and icons based on delegation access.DocumentsEmptycomponent.Enhancements
Headercomponent to conditionally disable theNotificationButtonbased on user scopes.FullWidthLayoutto check for document delegation access using user scopes.NotificationButtonto support adisabledstate with corresponding styles.Refactor
Dashboardwith the newDocumentsEmptycomponent.