feat(heureka): adds pagination for component instances on a service details panel

[hodanoori]

Summary

This PR adds pagination to the list of component instances for a selected service on the service details page.

Changes Made

• Separated the GraphQL query for retrieving the list of component instances from the query for fetching service list data.
• Added a new ComponentInstanceList component to encapsulate the code for displaying component instances and handling its pagination.
• Included ComponentInstancesOfService in the global store slice’s view list to set initial query options, with a default first: 8 parameter to display a maximum of 8 component instances per page, minimizing the need for scrolling within the panel.
• Renamed "name"to "ccrn" for "Services," "Components," and "Support Group" entities in all graphql queries.

Related Issues

• https://github.com/cloudoperators/heureka/issues/337

Testing Instructions

1. npm i
2. npm run TASK

Checklist

• [x] I have performed a self-review of my code.
• [x] I have commented my code, particularly in hard-to-understand areas.
• [x] I have added tests that prove my fix is effective or that my feature works.
• [x] New and existing unit tests pass locally with my changes.
• [x] I have made corresponding changes to the documentation (if applicable).
• [x] My changes generate no new warnings or errors.

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 9a7fc60d85d6dafcfb6ef00ac5acf024e8671d54

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

| Name | Type | | ----------------------------------- | ----- | | @cloudoperators/juno-app-heureka | Minor | | @cloudoperators/juno-app-greenhouse | Patch |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[hodanoori]

• closes cloudoperators/heureka#337

[github-actions[bot]]

PR Preview Action v1.4.8 :---: Preview removed because the pull request was closed. 2024-11-08 14:46 UTC

[hodanoori]

1. Maybe you do not need useMemo in places, but I am not sure please let me know what do you think
2. Would be nice to write some tests if it necessary for the components that you introduce.

Thanks for your review. I removed useMemos and added a test for the newly added component. Please have a look here again.

[hodanoori]

lgtm but please take my suggestions into account for the future.

Good Idea, I'll create a new PR for it.

[hodanoori]

I have a few questions regarding mocking, especially if start mocking our own behaviour, it means that the component use this behaviour wrong, kinda a good sign to rethink the state lifecycle.

I do not get your point, Those mocks are belonging to other components which has their own tests.

[hodanoori]

I have a few questions regarding mocking, especially if start mocking our own behaviour, it means that the component use this behaviour wrong, kinda a good sign to rethink the state lifecycle.

I separated the pagination component and added a test for that component. Please have a look there again.