New reporting flow (#7832)

* Add option to align web dialogs to top

* Add new wait util

* Pipe through feed view to feed components

* Reset unneeded change to main

* Copy over fresh report dialog based on old

* Hack in temp testing data

* Swap in new dialog in all cases but chat

* Cleanup

* Add load and initial error state

* Fill in states

* Add copyright link

* Handle single labeler case

* Comment out debug code

* Improve centering of type in circles

* Open details if Other is selected

* Remove debug code

* Tweak colors

* Bump SDK

* Tweak Admonition for better x-platform styles

* Add retry button

* Add close button

* Remove todo not covered in this PR

* Translate Retry

1 files changed, 18 insertions, 10 deletions

diff --git a/src/components/Admonition.tsx b/src/components/Admonition.tsx
index 8b01a8aba..8df4934be 100644
--- a/src/components/Admonition.tsx
+++ b/src/components/Admonition.tsx
@@ -2,6 +2,7 @@ import React from 'react'
 import {StyleProp, View, ViewStyle} from 'react-native'
 
 import {atoms as a, useBreakpoints, useTheme} from '#/alf'
+import {Button as BaseButton, ButtonProps} from '#/components/Button'
 import {CircleInfo_Stroke2_Corner0_Rounded as ErrorIcon} from '#/components/icons/CircleInfo'
 import {Eye_Stroke2_Corner0_Rounded as InfoIcon} from '#/components/icons/Eye'
 import {Leaf_Stroke2_Corner0_Rounded as TipIcon} from '#/components/icons/Leaf'
@@ -49,22 +50,29 @@ export function Text({
   return (
     <BaseText
       {...rest}
-      style={[
-        a.flex_1,
-        a.text_sm,
-        a.leading_snug,
-        {
-          paddingTop: 1,
-        },
-        style,
-      ]}>
+      style={[a.flex_1, a.text_sm, a.leading_snug, a.pr_md, style]}>
       {children}
     </BaseText>
   )
 }
 
+export function Button({
+  children,
+  ...props
+}: Omit<ButtonProps, 'size' | 'variant' | 'color'>) {
+  return (
+    <BaseButton size="tiny" variant="outline" color="secondary" {...props}>
+      {children}
+    </BaseButton>
+  )
+}
+
 export function Row({children}: {children: React.ReactNode}) {
-  return <View style={[a.flex_row, a.gap_sm]}>{children}</View>
+  return (
+    <View style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
+      {children}
+    </View>
+  )
 }
 
 export function Outer({