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(auth-admin): Delegation ui and gql #15943

Merged
merged 38 commits into from
Sep 23, 2024
Merged

feat(auth-admin): Delegation ui and gql #15943

merged 38 commits into from
Sep 23, 2024

Conversation

magnearun
Copy link
Contributor

@magnearun magnearun commented Sep 10, 2024

What

Ui for creating a custom delegation
Function for getting a Zendesk ticket by id
Graphql mution for creating a delegation

Why

For admin to handle creating a custom delegation when received on paper

Screenshots / Gifs

Screenshot 2024-09-10 at 14 36 42

Checklist:

  • I have performed a self-review of my own code
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works
  • Formatting passes locally with my changes
  • I have rebased against main before asking for a review

Summary by CodeRabbit

  • New Features

    • Introduced a new mutation for creating delegation entities via the GraphQL API.
    • Added a dedicated screen for creating delegations in the admin portal.
    • Implemented a new modal for confirming delegation actions.
    • Enhanced delegation creation capabilities with a new service method.
  • User Experience Improvements

    • Improved layout and navigation in the admin interface for easier delegation management.
    • Implemented a structured form for capturing delegation details with real-time validation.
    • Enhanced user messaging with localization support in the confirmation modal.

Copy link
Contributor

coderabbitai bot commented Sep 10, 2024

Walkthrough

This pull request introduces a new method for creating delegation administration requests in the DelegationAdminService, along with a corresponding GraphQL mutation. It also adds a React component for creating delegation entries and a modal for confirming delegation actions. Additionally, it enhances the user interface for managing delegation requests within the administrative portal.

Changes

Files Change Summary
libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.service.ts Added a method createDelegationAdmin for processing delegation creation requests.
libs/portals/admin/delegation-admin/src/components/CreateDelegationConfirmModal.tsx Introduced a modal component for confirming delegation actions with user-friendly messaging.
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.graphql Added a GraphQL mutation CreateDelegation for creating delegation entities and a query Identity for retrieving identity information.
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx Implemented a React component for creating delegation entries, including form handling and submission logic.
libs/portals/admin/delegation-admin/src/screens/DelegationAdminDetails/DelegationAdmin.tsx Added a button for admin users to create a new delegation, utilizing the useAuth hook for permission checks.

Possibly related PRs

Suggested labels

high priority


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?

Share
Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    -- I pushed a fix in commit <commit_id>, please review it.
    -- Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    -- @coderabbitai generate unit testing code for this file.
    -- @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    -- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    -- @coderabbitai read src/utils.ts and generate unit testing code.
    -- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    -- @coderabbitai help me debug CodeRabbit configuration file.

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 using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@datadog-island-is
Copy link

datadog-island-is bot commented Sep 10, 2024

Datadog Report

All test runs af094e0 🔗

4 Total Test Services: 0 Failed, 4 Passed
🔻 Test Sessions change in coverage: 3 decreased, 6 no change

Test Services
Service Name Failed Known Flaky New Flaky Passed Skipped Total Time Code Coverage Change Test Service View
api 0 0 0 4 0 2.94s 1 no change Link
api-domains-auth-admin 0 0 0 18 0 12.95s 1 decreased (-0.96%) Link
api-domains-communications 0 0 0 5 0 30.62s 1 decreased (-0.05%) Link
judicial-system-web 0 0 0 338 0 1m 15.14s 1 no change Link

🔻 Code Coverage Decreases vs Default Branch (3)

  • clients-zendesk - jest 53.63% (-3.65%) - Details
  • api-domains-auth-admin - jest 48.32% (-0.96%) - Details
  • api-domains-communications - jest 49.2% (-0.05%) - Details

Copy link

codecov bot commented Sep 10, 2024

Codecov Report

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

Project coverage is 36.63%. Comparing base (d29ae49) to head (00d51d2).
Report is 1 commits behind head on main.

Files with missing lines Patch % Lines
.../lib/delegationAdmin/dto/createDelegation.input.ts 0.00% 13 Missing ⚠️
...c/lib/delegationAdmin/delegation-admin.resolver.ts 0.00% 6 Missing ⚠️
...rc/lib/delegationAdmin/delegation-admin.service.ts 0.00% 2 Missing ⚠️
Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##             main   #15943      +/-   ##
==========================================
- Coverage   36.63%   36.63%   -0.01%     
==========================================
  Files        6748     6749       +1     
  Lines      138831   138852      +21     
  Branches    39455    39457       +2     
==========================================
  Hits        50863    50863              
- Misses      87968    87989      +21     
Flag Coverage Δ
api 3.39% <ø> (ø)
api-domains-auth-admin 48.86% <0.00%> (-1.04%) ⬇️
web 1.84% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines Coverage Δ
...rc/lib/delegationAdmin/delegation-admin.service.ts 0.00% <0.00%> (ø)
...c/lib/delegationAdmin/delegation-admin.resolver.ts 0.00% <0.00%> (ø)
.../lib/delegationAdmin/dto/createDelegation.input.ts 0.00% <0.00%> (ø)

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update d29ae49...00d51d2. Read the comment docs.

@GunnlaugurG GunnlaugurG changed the title feat(auth-admin):delegation ui and gql feat(auth-admin): Delegation ui and gql Sep 11, 2024
Copy link
Member

@GunnlaugurG GunnlaugurG left a comment

Choose a reason for hiding this comment

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

Great job, minor comments .. One thing this PR is missing tho. According to the design there is also a button to create a new delegation from '/delegation-admin/:nationalId'. That button should open this page with the toNationalId preffiled.

@GunnlaugurG GunnlaugurG marked this pull request as ready for review September 11, 2024 21:04
@GunnlaugurG GunnlaugurG requested review from a team as code owners September 11, 2024 21:05
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

Outside diff range and nitpick comments (2)
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (1)

1-93: Partial adherence to additional instructions.

The file partially adheres to the additional instructions:

  • It uses TypeScript for defining types and exporting them.
  • However, it does not contain any reusable components or hooks.
  • The instructions related to tree-shaking and bundling are not applicable to this specific file.
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx (1)

36-41: Consider using dynamic options for the type field.

The type field currently uses hardcoded options defined in the accessTypeOptions array. If these options are meant to be dynamic and fetched from an API or configuration, consider updating the implementation to load the options dynamically.

Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL

Commits

Files that changed from the base of the PR and between 1cc4845 and fee4601.

Files selected for processing (11)
  • libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.resolver.ts (2 hunks)
  • libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.service.ts (2 hunks)
  • libs/api/domains/auth-admin/src/lib/delegationAdmin/dto/createDelegation.input.ts (1 hunks)
  • libs/clients/zendesk/src/lib/zendesk.service.ts (4 hunks)
  • libs/portals/admin/delegation-admin/src/lib/messages.ts (1 hunks)
  • libs/portals/admin/delegation-admin/src/lib/paths.ts (1 hunks)
  • libs/portals/admin/delegation-admin/src/module.tsx (2 hunks)
  • libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (1 hunks)
  • libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.graphql (1 hunks)
  • libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx (1 hunks)
  • libs/portals/admin/delegation-admin/src/screens/Root.tsx (3 hunks)
Additional context used
Path-based instructions (11)
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.graphql (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/lib/paths.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/api/domains/auth-admin/src/lib/delegationAdmin/dto/createDelegation.input.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.service.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/module.tsx (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/screens/Root.tsx (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.resolver.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/clients/zendesk/src/lib/zendesk.service.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/lib/messages.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
Additional comments not posted (28)
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.graphql (2)

1-5: LGTM!

The GraphQL mutation definition for creating a delegation looks good and follows the correct syntax.


1-5: Verify the input type and mutation implementation.

Please ensure the following:

  1. The CreateDelegationInput input type is properly defined with all the necessary fields.
  2. The authCreateDelegation mutation is implemented correctly in the backend to handle the delegation creation.
  3. Consider returning additional fields besides the id if needed by the client.
libs/portals/admin/delegation-admin/src/lib/paths.ts (1)

4-4: LGTM!

The code changes are approved.

The new path CreateDelegation is correctly defined in the DelegationAdminPaths enum and follows the existing naming convention.

Ensure that the corresponding route handler and UI components are implemented for this path, and the path is correctly used for navigation within the application.

Also, confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices.
libs/api/domains/auth-admin/src/lib/delegationAdmin/dto/createDelegation.input.ts (1)

1-25: LGTM!

The CreateDelegationInput class is well-defined and follows best practices:

  • It uses TypeScript for defining the class and its fields, ensuring type safety.
  • It leverages NestJS's @InputType decorator to mark the class as a GraphQL input type, making it reusable in GraphQL mutations.
  • It utilizes class-validator decorators for input validation, ensuring data integrity.
  • The fields are appropriately typed and marked as required or optional, providing clear expectations for the input data.

The code is clean, readable, and adheres to the project's coding standards.

libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.service.ts (2)

44-44: LGTM: The method signature and return type are appropriate.

The createDelegationAdmin method has the correct signature and return type for handling the creation of delegation administration requests.


45-45: Return only national IDs for to and from fields.

As mentioned in the previous comment, the createDelegationAdmin method should only return the national IDs for the to and from fields, and let the field resolvers resolve them to the actual identities.

Modify the mock response to return only the national IDs:

- from: {
-   name: 'foo',
-   nationalId: '221290-22169',
-   type: 'company',
- },
+ from: '221290-22169',
- to: {
-   name: 'bar', 
-   nationalId: '221290-22169',
-   type: 'company',  
- },
+ to: '221290-22169',

Apply the same change when implementing the actual logic for creating a delegation.

libs/portals/admin/delegation-admin/src/module.tsx (2)

13-15: LGTM!

The code segment adheres to the lazy loading pattern for optimized performance and the component is properly typed as a React component.


44-49: LGTM, but verify the reusability of the createDelegationAction and CreateDelegationScreen components.

The route is properly defined with a name, path, element, and action. It enhances the module's capabilities by allowing delegation creation directly from the admin interface.

However, please ensure that the createDelegationAction and CreateDelegationScreen components are reusable across different NextJS apps and adhere to effective tree-shaking and bundling practices.

libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (3)

17-47: LGTM!

The schema definition looks good and follows best practices:

  • Using the zod library for validation is a good choice.
  • The fields are properly typed and validated.
  • The kennitala library is used for validating Icelandic national IDs.
  • The validTo field is correctly validated to be a future date.

49-54: LGTM!

The CreateDelegationResult type definition is correct and follows the expected structure.


56-93: LGTM!

The createDelegationAction function implementation looks good and follows best practices:

  • It properly validates the form data using the defined schema.
  • It handles both success and failure cases.
  • It uses a GraphQL mutation to create the delegation.
  • It redirects on success and returns an error object on failure.
libs/portals/admin/delegation-admin/src/screens/Root.tsx (5)

4-10: LGTM!

The new imports are necessary for the added functionality and layout changes.


14-14: LGTM!

The new import is necessary for the added navigation functionality.


23-23: LGTM!

The navigate constant is necessary for the added navigation functionality.


43-85: LGTM, but verify the admin access.

The layout and functionality changes are approved:

  • The new grid layout improves the responsiveness and organization of the UI elements.
  • The new Button component enhances the user interaction by providing a clear action for creating new delegations.
  • The form changes ensure it fits within the new grid structure.

As mentioned in the previous comment, ensure that the delegation creation functionality is only available to users with the admin scope for delegations (@admin.island.is/delegation-system:admin). You can use the useAuth hook to check the user's scopes:

import { AdminPortalScope } from '@island.is/auth/scopes'

const { userInfo } = useAuth()

const hasAdminAccess = userInfo?.scopes.includes(
    AdminPortalScope.delegationSystemAdmin,
)

Then, conditionally render the Button component based on the hasAdminAccess variable.


Line range hint 1-90: LGTM!

The component adheres to the following guidelines:

  • Reusability: The component imports and uses reusable components and hooks from other libraries.
  • TypeScript usage: The component uses TypeScript for defining props and types.
  • Bundling practices: The component follows effective tree-shaking and bundling practices by importing only the necessary components and hooks.
libs/api/domains/auth-admin/src/lib/delegationAdmin/delegation-admin.resolver.ts (1)

70-76: LGTM!

The createDelegationSystem mutation method in the DelegationAdminResolver class is implemented correctly:

  • It is annotated with the @Mutation decorator, indicating it's a GraphQL mutation.
  • It accepts the input parameter of type CreateDelegationInput for type safety and validation.
  • It retrieves the authenticated user using the @CurrentUser() decorator, ensuring only authorized users can create delegations.
  • It delegates the creation logic to the createDelegationAdmin service method, following the single responsibility principle.

The code changes are approved.

libs/clients/zendesk/src/lib/zendesk.service.ts (4)

Line range hint 8-13: LGTM!

The SubmitTicketInput type is well-defined and follows TypeScript best practices by clearly specifying optional and required properties.


21-24: LGTM!

The Ticket type is well-defined and follows TypeScript best practices by clearly specifying the properties.


129-129: LGTM!

The submitTicket method is correctly using the updated SubmitTicketInput type for its parameter.


155-170: LGTM!

The getTicket method is well-implemented and follows best practices:

  • It uses the Ticket type for the return value, ensuring type safety.
  • It handles errors appropriately by logging them and throwing a new error with a descriptive message.
  • It uses async/await syntax for better readability and error handling.
libs/portals/admin/delegation-admin/src/lib/messages.ts (4)

44-47: The comment from the previous review is still valid:

This already exists here above, but feel free to remove that since it is not being used


48-51: LGTM!

The message definition for delegationAdminCreateNewDelegationDescription looks good.


52-55: The comment from the previous review is still valid:

re-use the previous variable for "Stofn nytt umbod" since these values will always be the same


56-119: LGTM!

The added message definitions from line 56 to 119 look good. They cover various aspects of the delegation management functionality and provide clear and concise descriptions. The messages follow a consistent naming convention and enhance the user experience by providing localized labels, placeholders, and error messages.

libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx (3)

1-25: Imports look good!

The imports are well-organized, follow a consistent pattern, and only include what's necessary for the component.


26-183: Component structure and implementation look solid!

The CreateDelegationScreen component is well-structured and follows good practices:

  • It uses a clear layout with Grid components.
  • It handles form state using React hooks.
  • It delegates form submission to an action file.
  • It uses localized messages for labels and error messages.
  • It conditionally renders fields based on state.
  • It uses InputMask for formatting national IDs.
  • It displays a global error message on submission failure.

Overall, the component is implemented in a clean and maintainable way.


51-179: Verify error handling and field-specific error messages.

The component displays a global error message if the form submission fails, which is good. However, it's important to ensure that field-specific error messages are properly displayed for each form field.

Please verify that the errorMessage prop is correctly set for each form field and that the corresponding error messages are displayed when the actionData contains field-specific errors.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

Outside diff range and nitpick comments (1)
libs/portals/admin/delegation-admin/src/components/CreateDelegationConfirmModal.tsx (1)

62-85: Use optional chaining for safer prop access.

The rendering logic for identity cards is correct and handles missing data gracefully. However, as suggested by the static analysis hints, consider using optional chaining when accessing properties of fromIdentity and toIdentity to avoid potential errors if these props are null or undefined.

Apply this diff to use optional chaining:

-{fromIdentity && fromIdentity.name && fromIdentity.nationalId && (
+{fromIdentity?.name && fromIdentity?.nationalId && (
   <IdentityCard
     label={formatMessage(m.fromNationalId)}
     title={fromIdentity.name}
     description={formatNationalId(fromIdentity.nationalId)}
     color="blue"
   />
 )}
-{toIdentity && toIdentity.name && toIdentity.nationalId && (
+{toIdentity?.name && toIdentity?.nationalId && (
   <IdentityCard
     label={formatMessage(m.toNationalId)}
     title={toIdentity.name}
     description={formatNationalId(toIdentity.nationalId)}
     color="purple"
   />
 )}
Tools
Biome

[error] 69-69: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 77-77: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL

Commits

Files that changed from the base of the PR and between a80c2bb and 6d546c9.

Files selected for processing (6)
  • libs/portals/admin/delegation-admin/src/components/CreateDelegationConfirmModal.tsx (1 hunks)
  • libs/portals/admin/delegation-admin/src/lib/messages.ts (1 hunks)
  • libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (1 hunks)
  • libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx (1 hunks)
  • libs/portals/admin/delegation-admin/src/screens/DelegationAdminDetails/DelegationAdmin.tsx (2 hunks)
  • libs/portals/admin/delegation-admin/src/screens/Root.tsx (3 hunks)
Files skipped from review as they are similar to previous changes (1)
  • libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.tsx
Additional context used
Path-based instructions (5)
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/screens/Root.tsx (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/screens/DelegationAdminDetails/DelegationAdmin.tsx (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/lib/messages.ts (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
libs/portals/admin/delegation-admin/src/components/CreateDelegationConfirmModal.tsx (1)

Pattern libs/**/*: "Confirm that the code adheres to the following:

  • Reusability of components and hooks across different NextJS apps.
  • TypeScript usage for defining props and exporting types.
  • Effective tree-shaking and bundling practices."
Biome
libs/portals/admin/delegation-admin/src/components/CreateDelegationConfirmModal.tsx

[error] 69-69: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 77-77: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

Additional comments not posted (30)
libs/portals/admin/delegation-admin/src/screens/CreateDelegation/CreateDelegation.action.ts (1)

1-94: LGTM! The code segment is well-structured and follows best practices.

The code segment implementing the functionality for creating delegations within the administrative portal is well-designed and adheres to the project's coding standards. Here are some key strengths:

  1. The use of the zod library for schema validation ensures data integrity and prevents invalid data from being processed.
  2. The custom validation for the validTo field is a nice addition to enforce future dates only, enhancing the robustness of the validation process.
  3. The createDelegationAction function is a wrapped action function, which follows a consistent pattern in the codebase and handles form submission, validation, and mutation in a clean and readable manner.
  4. The error handling is comprehensive, returning validation errors or a global error flag in case of mutation failure, providing appropriate feedback to the user.
  5. The code segment adheres to the reusability, TypeScript usage, and effective bundling practices mentioned in the additional instructions, ensuring consistency and maintainability.

Overall, the code segment is well-implemented and aligns with the PR objectives of introducing functionality for creating delegations within the administrative portal.

libs/portals/admin/delegation-admin/src/screens/Root.tsx (5)

4-10: LGTM!

The new imports are relevant and necessary for the component refactor.


14-16: LGTM!

The new imports are relevant and necessary for the component refactor.


25-30: LGTM!

The code changes address the past review comment by checking for the AdminPortalScope.delegationSystemAdmin scope before rendering the delegation creation button.


51-68: LGTM!

The component layout refactor using the grid system improves the UI responsiveness and organization. The delegation creation button enhances the user experience and is correctly rendered based on the user's admin access.


69-93: LGTM!

The search form is correctly integrated into the new grid layout, and the AsyncSearchInput component usage remains unchanged, preserving the search functionality, error handling, and loading states.

libs/portals/admin/delegation-admin/src/screens/DelegationAdminDetails/DelegationAdmin.tsx (2)

27-31: LGTM!

The code segment correctly checks if the user has the delegationSystemAdmin scope using the useAuth hook and stores the result in the hasAdminAccess variable. This variable is used later in the component to conditionally render the "Create New Delegation" button.


36-64: LGTM!

The code segment correctly renders a grid row with two columns:

  1. The first column displays the delegation admin's name and national ID using the IntroHeader component.
  2. The second column conditionally renders a "Create New Delegation" button based on the user's admin access.

The button's click handler navigates to the delegation creation path with the fromNationalId query parameter set to the current delegation admin's national ID.

The grid layout ensures that the button is properly aligned and responsive on different screen sizes.

libs/portals/admin/delegation-admin/src/lib/messages.ts (19)

44-47: LGTM!

The message definition for the description of creating a new delegation is clear and follows the existing format.


48-51: LGTM!

The message definition for the label of the "from" national ID field is clear and follows the existing format.


52-55: LGTM!

The message definition for the label of the "to" national ID field is clear and follows the existing format.


56-59: LGTM!

The message definition for the "cancel" action is clear and follows the existing format.


60-63: LGTM!

The message definition for the "create" action is clear and follows the existing format.


64-67: LGTM!

The message definition for the "no end date" option is clear and follows the existing format.


68-71: LGTM!

The message definition for the "valid to" label is clear and follows the existing format.


72-75: LGTM!

The message definition for the "type" label is clear and follows the existing format.


76-79: LGTM!

The message definition for the "general" type option is clear and follows the existing format.


80-83: LGTM!

The message definition for the "reference ID" label is clear and follows the existing format.


84-87: LGTM!

The message definition for the default error message is clear and follows the existing format.


88-91: LGTM!

The message definition for the "valid to" error message is clear and follows the existing format.


92-95: LGTM!

The message definition for the "from" national ID required error message is clear and follows the existing format.


96-99: LGTM!

The message definition for the "to" national ID required error message is clear and follows the existing format.


100-103: LGTM!

The message definition for the "from" national ID invalid error message is clear and follows the existing format.


104-107: LGTM!

The message definition for the "to" national ID invalid error message is clear and follows the existing format.


108-111: LGTM!

The message definition for the "reference ID required" error message is clear and follows the existing format.


112-115: LGTM!

The message definition for the "grant identity" error message is clear and follows the existing format.


116-119: LGTM!

The message definition for the "create delegation confirm modal" title is clear and follows the existing format.

libs/portals/admin/delegation-admin/src/components/CreateDelegationConfirmModal.tsx (3)

1-49: LGTM!

The component props and state management are properly set up. The usage of hooks for localization, responsive design, and dynamic shadow enhances the user experience.


86-115: LGTM!

The rendering logic for delegation type and dates is correct and handles missing data gracefully. The usage of the IdentityCard component ensures a consistent presentation of the information, and the localization of labels and messages enhances the user experience.


118-132: LGTM!

The modal footer and confirmation actions are properly implemented. The usage of the DelegationsFormFooter component ensures a consistent and user-friendly footer design, and the sticky positioning improves usability by keeping the actions always visible. The localization of button labels and icons enhances the user experience.

Copy link
Member

@GunnlaugurG GunnlaugurG left a comment

Choose a reason for hiding this comment

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

Great job, minor comments, mostly nit

@magnearun magnearun added the automerge Merge this PR as soon as all checks pass label Sep 20, 2024
Copy link
Member

@GunnlaugurG GunnlaugurG left a comment

Choose a reason for hiding this comment

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

🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
automerge Merge this PR as soon as all checks pass
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants