about summary refs log tree commit diff
path: root/src/view/com/modals
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/modals')
-rw-r--r--src/view/com/modals/AltImageRead.tsx4
-rw-r--r--src/view/com/modals/Confirm.tsx27
2 files changed, 26 insertions, 5 deletions
diff --git a/src/view/com/modals/AltImageRead.tsx b/src/view/com/modals/AltImageRead.tsx
index 4dde8f58b..985477287 100644
--- a/src/view/com/modals/AltImageRead.tsx
+++ b/src/view/com/modals/AltImageRead.tsx
@@ -34,8 +34,8 @@ export function Component({altText}: Props) {
         testID="altTextImageSaveBtn"
         onPress={onPress}
         accessibilityRole="button"
-        accessibilityLabel="Save"
-        accessibilityHint="Save alt text">
+        accessibilityLabel="Done"
+        accessibilityHint="Closes alt text modal">
         <LinearGradient
           colors={[gradients.blueLight.start, gradients.blueLight.end]}
           start={{x: 0, y: 0}}
diff --git a/src/view/com/modals/Confirm.tsx b/src/view/com/modals/Confirm.tsx
index c508c2d3a..11e1a6334 100644
--- a/src/view/com/modals/Confirm.tsx
+++ b/src/view/com/modals/Confirm.tsx
@@ -19,10 +19,12 @@ export function Component({
   title,
   message,
   onPressConfirm,
+  onPressCancel,
 }: {
   title: string
   message: string | (() => JSX.Element)
   onPressConfirm: () => void | Promise<void>
+  onPressCancel?: () => void | Promise<void>
 }) {
   const pal = usePalette('default')
   const store = useStores()
@@ -69,12 +71,23 @@ export function Component({
           style={[styles.btn]}
           accessibilityRole="button"
           accessibilityLabel="Confirm"
-          // TODO: This needs to be updated so that modal roles are clear;
-          // Currently there is only one usage for the confirm modal: post deletion
-          accessibilityHint="Confirms a potentially destructive action">
+          accessibilityHint="">
           <Text style={[s.white, s.bold, s.f18]}>Confirm</Text>
         </TouchableOpacity>
       )}
+      {onPressCancel === undefined ? null : (
+        <TouchableOpacity
+          testID="cancelBtn"
+          onPress={onPressCancel}
+          style={[styles.btnCancel, s.mt10]}
+          accessibilityRole="button"
+          accessibilityLabel="Cancel"
+          accessibilityHint="">
+          <Text type="button-lg" style={pal.textLight}>
+            Cancel
+          </Text>
+        </TouchableOpacity>
+      )}
     </View>
   )
 }
@@ -104,4 +117,12 @@ const styles = StyleSheet.create({
     marginHorizontal: 44,
     backgroundColor: colors.blue3,
   },
+  btnCancel: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: 32,
+    padding: 14,
+    marginHorizontal: 20,
+  },
 })