Enhanced UX for surfacing who locked files better

Context

See #545279 (comment 3554681683)

In #4623 (closed), a design proposal was made for a popover which would surface who locked files better, however design feedback from #545279 (comment 2521855081) led to the final design proposal in #545279 (comment 3554681683).

Ideal proposal	Screen
User icon with lock icon overlaid	+ Combination of user icon and lock communicates visually the file is locked, and the user who locked it in an elegant way + Clicking affordance is clear + Text description for accessibility - Icon overlaid on user icon is not a Pajamas component, and is only used in 1 other place (user profile icon with emoji status). Custom front-end needed.

Realistic proposal	Screen
File lock: User icon next to Locked label	User has permission to unlock: User does NOT have permission to unlock: + Combination of user icon and Locked text label communicates file is locked and by who + Clicking affordance is clear + Text description for accessibility - No lock icon to visually communicate without reading text
Directory lock	To address upstream/downstream locked directories, we can: Surface an alert inside the disclosure Change the button to allow users to navigate to the relevant locked file Simplify the alert text

Temporary development solution

To solve the immediate user need in #4623 (closed), a tooltip with the username of the user who locked the file was added in !186291 (merged) while design feedback was being iterated on.

This was not a huge priority, as the immediate user need was solved, Locking in the UI is only available for Premium/Ultimate customers, and is not heavily used. The final state should be iterated towards when resourcing becomes available.