Restore right-edge alignment of buttons in the shared AlertModal

[Fried333]

Summary

Paper's Dialog.Actions lays its children out in a flex row with justifyContent: 'flex-end', so a single OK button normally sits flush against the right edge of the dialog. The shared AlertModal in src/components/Alert.js wraps its buttons in a horizontal ScrollView (presumably to handle the many-buttons case), which overrides that layout: a horizontal ScrollView fills its parent's width and aligns its inner content to the start, so every button ends up on the left of the dialog regardless of screen size or button count.

The misalignment is unconditional — every alert in the app is affected — but is most noticeable on narrower phones where the gap between the button and the right edge is wider in absolute pixels.

Fix

Add contentContainerStyle={{ flexGrow: 1, justifyContent: 'flex-end' }} to the ScrollView. When the inner content is narrower than the viewport (the common case — one or two short buttons), the content area now stretches to the full ScrollView width and the buttons stay pinned to the right edge, matching the default Dialog.Actions behaviour. When content does overflow (many buttons or very long labels), flexGrow: 1 becomes a no-op and the ScrollView still scrolls horizontally as intended.

Diff

One file, four lines of diff:

           <Dialog.Actions>
-            <ScrollView horizontal style={{ height: 48 }}>
+            <ScrollView
+              horizontal
+              style={{ height: 48 }}
+              contentContainerStyle={{ flexGrow: 1, justifyContent: 'flex-end' }}
+            >

Test plan

• Built a debug APK with this fix on top of dev and installed on an Android device. Every alert dialog (createAlert-driven) now renders its OK / action button on the right edge of the dialog as the design intended. Multi-button alerts still scroll horizontally when their combined label width exceeds the viewport.
• CI Android + iOS builds pass.
• Maintainer smoke-test on iOS confirms parity.