Management Page for Onboarding Service Providers

[jjeroch]

Description: This ticket involves implementing the frontend of the management page for onboarding service providers. The page should include the following functionalities:

1. Callback URL Configuration: Allow service providers to configure callback URLs for receiving notifications and updates from the customer registration process.

2. IDP Record Management: Provide a user-friendly interface for service providers to manage their IDP (Identity Provider) records. This includes adding, editing, and deleting IDP records.

3. Overview/List of Registered Customers: Fetch and display a list of registered customers along with their status. This list should be dynamically updated from the backend.

Figma Design: https://www.figma.com/file/pcHZWXTQJUguIT75QSk9KW/Portal-Designs?type=design&node-id=10225-93156&mode=design&t=VgPxdipkIebDxY3k-0

Tasks:

• [ ] Implement the new page for onboarding service providers - page: /onboardingServiceProvider
• [ ] the page should have a responsive design and work well on different devices and screen sizes
• [ ] Add the callback section (more details to this section on edit are described in the bottom of the ticket)
• [ ] The callback section displays an endpoint (https) or is empty. Depending on the API response
• [ ] The IdP and customer details are displayed in a table with tab function

Design:

---

CallBack URL & Edit function

• [ ] support an overlay form for configuring callback URL, including validation for the URL format.
• [ ] beside the callback url the user needs to configure the client ID and secret
• [ ] use for all fields input pattern validation - those should be already available from previous implementations
• [ ] the overlay is getting displayed if the user clicked on the overlay page on the edit icon of the callback field
• [ ] if the users company has already a callback url defined (response of the GET call) display the details inside the overlay (note - secrets are always only displayed with ***; similar implementation is existing in the idp overlay from Nidhi - a sync might be helpful)

Display the existing Callback URL GET /api/administration/RegistrationStatus/callback

And change of the callback URL POST /api/administration/RegistrationStatus/callback

---

IdP Section

Endoint: GET /api/administration/identityprovider/owncompany/identityproviders

• [ ] Only display IdPs of the Type "MANAGED"
• [ ] Display total number of connectors based on API Response of "MANAGED" idps
• [ ] Display the Alias based on API response "alias"
• [ ] Display the DisplayName based on API response "displayName"
• [ ] The wireframe called "Progress" bar should be called "Status" and display with an chipcard the IdP Status based on API response "enabled". If enabled is "true" display "Active"; otherwise "Inactive"
• [ ] Enable the Action Sub-Menu option where the user can decide between "Activate", "Deactivate", "Delete" and "Edit"..to be recheck with the Product Owner if any logic is needed
• [ ] Enable the button "Add Identity Provider"
• [ ] If the user selects "Add Identity Provider" the overlay (same as used in the IdP create page) is getting displayed with automatic selection of "Managed" IdP
• [ ] Out-of-Scope: do not implement the "Auth Method" - the auth method is always the same

---

Customer Sections

• [ ] Fetch and display a list of registered customers along with their status.
• [ ] Implement pagination or infinite scrolling for the customer list if necessary.
• [ ] Handle any error scenarios, such as failed API requests or invalid data.

[jjeroch]

@lavanya-bmw more details will be needed as part of the refinement. I suggest to start based on the existing information and after the initial functions are implemented lets meet in a meeting and discuss further details

[lavanya-bmw]

@jjeroch -Please provide the API endpoint for 'customer overview' tab -Regarding OSP Identity Provider(IDPs)-Tab 1, the same API endpoint is used in https://portal.dev.demo.catena-x.net/idpmanagement please confirm if I can re-use the same table if possible and design looks as below:

[lavanya-bmw]

[jjeroch]

@jjeroch -Please provide the API endpoint for 'customer overview' tab -Regarding OSP Identity Provider(IDPs)-Tab 1, the same API endpoint is used in https://portal.dev.demo.catena-x.net/idpmanagement please confirm if I can re-use the same table if possible and design looks as below:

@lavanya-bmw yes, the table can get used :)

Regarding the endpoint - I am checking the available implementation right now. Will come back asap.