(feat) O3-5005 add search tab to dispensing home page

[chibongho]

Requirements

• This PR has a title that briefly describes the work done, including the ticket number if there is a ticket.
• My work conforms to the OpenMRS 3.0 Styleguide and design documentation.
• My work includes tests or is validated by existing tests.

Summary

This PR adds a search tab in the dispensing home page. Functionally, this tab is really similar to the "Active prescription" tab. The only difference is that it does not initiate request for data until the user searches for user.

Other changes:

• Refactored out the prescriptions table to it's re-usable across all the tabs
• The "Active prescription" and "All prescription" tabs still have a search bar. However, previously the search bar is shared across those 2 tabs. With this change, each tab has its own search bar.
• The wording in the new search tab deviates slightly from this (old?) mockup for better consistency with the other apps.

Marking this as draft as I'm using a placeholder icon in lieu of the real search icon in pending PR openmrs/openmrs-esm-core#1454. Code-wise, this is ready for review.

Screenshots

See video. Note that patient "Manu" is searched twice, once via pressing the "Enter" key and once by clicking on the "Search" button.

OpenMRS.Mozilla.Firefox.2025-09-15.16-43-51.mp4

Related Issue

https://openmrs.atlassian.net/browse/O3-5005

Other

[github-actions]

Size Change: -42.1 kB (-4.16%)

Total Size: 970 kB

Filename	Size	Change
dist/6411.js	0 B	-43 kB (removed)	🏆

ℹ️ View Unchanged

Filename	Size	Change
dist/1033.js	7.08 kB	0 B
dist/1119.js	1.63 kB	0 B
dist/1197.js	1.63 kB	0 B
dist/1282.js	43.7 kB	0 B
dist/2146.js	1.63 kB	0 B
dist/2177.js	5.14 kB	0 B
dist/2690.js	1.78 kB	0 B
dist/2898.js	6.25 kB	0 B
dist/3041.js	1.53 kB	0 B
dist/3099.js	1.93 kB	0 B
dist/3184.js	11.2 kB	0 B
dist/3414.js	7.02 kB	0 B
dist/3584.js	1.63 kB	0 B
dist/4055.js	1.99 kB	0 B
dist/4099.js	14.9 kB	0 B
dist/4132.js	1.85 kB	0 B
dist/4225.js	255 B	0 B
dist/4300.js	1.67 kB	+42 B (+2.58%)
dist/4335.js	1.63 kB	0 B
dist/4353.js	3.02 kB	0 B
dist/4618.js	1.63 kB	0 B
dist/4652.js	1.89 kB	0 B
dist/4944.js	1.69 kB	0 B
dist/5173.js	1.63 kB	0 B
dist/5241.js	1.63 kB	0 B
dist/5422.js	1.53 kB	0 B
dist/5442.js	1.63 kB	0 B
dist/5661.js	1.98 kB	0 B
dist/5897.js	370 B	0 B
dist/6022.js	1.92 kB	0 B
dist/609.js	7.2 kB	0 B
dist/6468.js	1.91 kB	0 B
dist/6540.js	2.62 kB	0 B
dist/6606.js	255 B	0 B
dist/6679.js	1.87 kB	0 B
dist/67.js	8.46 kB	0 B
dist/6741.js	87.8 kB	0 B
dist/6840.js	1.63 kB	0 B
dist/6841.js	2.2 kB	0 B
dist/6859.js	1.63 kB	0 B
dist/7097.js	1.63 kB	0 B
dist/7159.js	1.63 kB	0 B
dist/723.js	1.63 kB	0 B
dist/7268.js	444 kB	0 B
dist/7556.js	28.6 kB	0 B
dist/7617.js	1.63 kB	0 B
dist/7935.js	15.3 kB	0 B
dist/795.js	2.16 kB	0 B
dist/8163.js	1.63 kB	0 B
dist/8349.js	1.63 kB	0 B
dist/8600.js	6.17 kB	0 B
dist/8618.js	1.63 kB	0 B
dist/8651.js	355 B	0 B
dist/890.js	1.63 kB	0 B
dist/9214.js	2.02 kB	0 B
dist/9538.js	1.86 kB	0 B
dist/9569.js	1.63 kB	0 B
dist/961.js	42.8 kB	0 B
dist/963.js	2.21 kB	0 B
dist/986.js	1.63 kB	0 B
dist/9879.js	1.97 kB	0 B
dist/9895.js	1.63 kB	0 B
dist/9900.js	1.63 kB	0 B
dist/9913.js	1.63 kB	0 B
dist/main.js	148 kB	+862 B (+0.59%)
dist/openmrs-esm-dispensing-app.js	3.8 kB	0 B

_{compressed-size-action}

[pirupius]

I think you forgot to include the translation strings for these

[mogoodrich]

Generally LGTM, though we do need to add the translations @pirupius pointed out.

I didn't see the location filter in the screenshot... is that going away?

[chibongho]

I think you forgot to include the translation strings for these

Thanks, fixed.

I didn't see the location filter in the screenshot... is that going away?

No, still there. I was developing against dev3, which does not have the location filter. Against our backend (kgh-test), it does:

I also removed the tabs array in favor of just hard-coding the tabs in dispensing.component.tsx

[donaldkibet]

Thanks @chibongho, LGTM

This might be slightly beyond the scope of this PR, but could we consider using a stateful URL for filtering Search, Active Prescription, and All Prescription?

For example, if we had a URL like:

dispensing?patientUuid=some-patient-uuid

it would filter prescriptions for that patient across all tabs.

The main purpose is to integrate better with queues — when a patient is queued for pharmacy, the pharmacist shouldn’t need to search again to view their active prescriptions.

[chibongho]

@donaldkibet I think that's a good feature. It probably should be its own ticket, and have some design discussion around:

• should we need a param for which tab to go to
• The current search supports searching by name and patient identifier, but not patient uuid. Is that ok?