(Chore) Refactor Service metrics extension slot

[ODORA0]

Requirements

• This PR has a title that briefly describes the work done including a conventional commit type prefix and a Jira ticket number if applicable. See existing PR titles for inspiration.

For changes to apps

• My work conforms to the OpenMRS 3.0 Styleguide and design documentation.

If applicable

• My work includes tests or is validated by existing tests.

Summary

There was an issue loading the billing service metrics that would cause so many queries to the endpoint /billableService? until it crashes, breaking the metrics dashboard as well. This PR resolves that by refactoring the way the extension slot for the service metrics component is injected

Screenshots

Screen.Recording.2024-02-15.at.12.40.57.mov

Related Issue

Other

[CynthiaKamau]

Thanks @ODORA0 , perhaps you should have moved the extension you created from the ServiceMetrics component to the DashboardComponent :

<main className={styles.container}>
      <ServiceMetrics />
      <main className={styles.servicesTableContainer}>
        <BillableServices />
      </main>
    </main>

[CynthiaKamau]

Thanks @ODORA0 , perhaps you should have moved the extension you created from the ServiceMetrics component to the DashboardComponent :

<main className={styles.container}>
      <ServiceMetrics />   // here <ExtensionSlot name="billing-home-tiles-slot" />
      <main className={styles.servicesTableContainer}>
        <BillableServices />
      </main>
    </main>

You are calling the extension within the component thats the extension

[CynthiaKamau]

you dont need ServiceMetrics component since its now rendered throught the extension

[ODORA0]

Ooh yeah, done!

[pirupius]

The case in the index.ts doesn't match this one

[pirupius]

Align this with what u have in the routes.json

[pirupius]

This doesn't look right. Remove the React.memo from here and you can use it in the logic for calculating the tile cards