Query and render commit details (expandable section)
### Description This is part of a bigger effort to [refactor the repository Commit list](https://gitlab.com/groups/gitlab-org/-/epics/17482). As part of this issue we should implement an expandable section for commit details. Upon expanding, we should query and render the commit details. [:art: Figma](https://www.figma.com/design/eq2nf3B8MhB9xKrC0VzbPf/branch/3jjv6jJrQBKnrW4yxm6XRe/Repository?m=auto&node-id=6706-43335&t=sZ3zOzKXowYM9DzY-1) <table> <tr> <th></th> <th>Screen</th> <th>Notes</th> </tr> <tr> <td>Commit drawer</td> <td> ![1.2 Proposal - expanded.jpg](/uploads/fe0a21042bcf9313d67a076736247352/1.2_Proposal_-_expanded.jpg) ![1.3 Proposal - expanded hover popovers.jpg](/uploads/c1682802210175ea23f6010a0e063723/1.3_Proposal_-_expanded_hover_popovers.jpg) </td> <td> * Grid layout was designed by the Workspaces team ([Figma](https://www.figma.com/design/COHvi595X2r7t8oXpBfxvj/--16787--Improve-Workspace-Failure-Visibility-and-Troubleshooting?node-id=4271-4566&t=bQdZR20Re622BHZw-1)). There can be some development coordination between teams to reuse layouts. * Similar MR badge is being used in the `Code` \> `Branches` page. * Hovering over the MR badge will trigger the MR popover (hover here example https://gitlab.com/gitlab-org/gitlab/-/merge_requests/168363). * Hovering over a username will trigger the user popover. * The message field should be truncated at about 450 characters. (i.e. display an ellipsis when messages are very long). https://gitlab.com/groups/gitlab-org/-/epics/17482#note_2567908976 * Please add analytics on the Expand/Collapse drawer, so we understand how often users are clicking to expand details of a commit. </td> </tr> <tr> <td>Commit drawer overflow</td> <td> ![1.4 Proposal - overflow.jpg](/uploads/78df6d8719305e01aa0c9e7b9c3767ba/1.4_Proposal_-_overflow.jpg) </td> <td> Any overflow content inside a commits detail drawer should wrap onto the next line. For overflowing users in `Merged/Approved/Reviewed/Co-authored by`: * Show 2 lines of content (if you need a number, somewhere in the range of 6 - 10 usernames is fine. Feel free to adjust as you see fit.) * If there are additional usernames, show a `+#` badge showing the number of overflowed elements. On hover, the badge will say `# more <approvers/reviewers/co-authors>`. * https://gitlab.com/groups/gitlab-org/-/epics/17482#note_2567908976 </td> </tr> </table> ### Mobile **_\< TBD @alyssatrinh \>_**
issue