Fix missing reading colors in qiraat ReadersPanel when reader overlaps readings

[Mubashir78]

Fixes #3286

Summary

When a junction has reader-level overlap (a reader appearing in multiple reading colors) and no transmitter-level disambiguation, the Readers panel hides some reading colors because the color lookup uses first-match semantics via readings.find().

For example, on https://quran.com/2:245/qiraat, readers Abū Jaʿfar (6) and Ibn Kathīr (8) appear in both the white reading and the pink reading. Because the white reading appeared first in the payload, both readers were assigned white, hiding the pink color entirely from the panel.

Changes

ReadersPanel/index.tsx: Added a readerColorMap that:

1. Assigns unambiguous readers (matching exactly one reading) first
2. For ambiguous readers, prefers a candidate color not yet used by another reader
3. Falls back to first-match only when all candidate colors are already represented

ReaderItem.tsx: Added an optional readerColor prop. When provided, it takes priority over the inherited first-match fallback in getTransmitterColor, allowing the parent panel to control the color assignment.

Result

All reading colors now appear in the Readers panel even when readers overlap across multiple readings. The fix is not specific to 2:245 and applies to all verses with the same ambiguous reader-level mapping pattern (6:145, 7:161, 10:35, 12:23, 18:44, 19:25, 20:63, 22:39).

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 71d8d9c99f

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

[chatgpt-codex-connector]

Route reassigned tags to the same reading

When a reader appears in multiple readings and the new readerColorMap chooses a later unused candidate, inherited transmitter tags are now colored for that later reading, but handleTransmitterClick still falls back to selectedJuncture.readings.find(reading.matrix?.readers?.includes(...)) in StudyModeQiraatTab/index.tsx, which scrolls to the first candidate instead. In the overlap case this makes a tag visually point to one reading while clicking it scrolls to a different card, so the click target should use the same disambiguation result as the color assignment.

Useful? React with 👍 / 👎.

[Mubashir78]

Fixed.