:sparkles: Repurpose report post modal and re-use for list reporting (#1070)

* :sparkles: Repupose report post modal and re-use for list reporting

* :sparkles: Allow reporting a feed generator

* :sparkles: :recycle: Refactor report modal into one shared component for reporting different collections

* :white_check_mark: Adjust report option selector in tests

* :white_check_mark: Add test for list reporting

* :recycle: :sparkles: Refactor reason options and add options for list and feedgen

* :broom: Cleanup remaining todo

* Fix to mutelist react keys

* Fix regression from rebase

* Improve customfeed mobile header

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>

2 files changed, 20 insertions, 0 deletions

diff --git a/src/view/com/lists/ListActions.tsx b/src/view/com/lists/ListActions.tsx
index ee5a2afcb..353338198 100644
--- a/src/view/com/lists/ListActions.tsx
+++ b/src/view/com/lists/ListActions.tsx
@@ -11,6 +11,7 @@ export const ListActions = ({
   isOwner,
   onPressDeleteList,
   onPressShareList,
+  onPressReportList,
   reversed = false, // Default value of reversed is false
 }: {
   isOwner: boolean
@@ -19,6 +20,7 @@ export const ListActions = ({
   onPressEditList?: () => void
   onPressDeleteList?: () => void
   onPressShareList?: () => void
+  onPressReportList?: () => void
   reversed?: boolean // New optional prop
 }) => {
   const pal = usePalette('default')
@@ -64,6 +66,17 @@ export const ListActions = ({
       onPress={onPressShareList}>
       <FontAwesomeIcon icon={'share'} style={[pal.text]} />
     </Button>,
+    !isOwner && (
+      <Button
+        key="reportListBtn"
+        testID="reportListBtn"
+        type="default"
+        accessibilityLabel="Report list"
+        accessibilityHint=""
+        onPress={onPressReportList}>
+        <FontAwesomeIcon icon={'circle-exclamation'} style={[pal.text]} />
+      </Button>
+    ),
   ]
 
   // If reversed is true, reverse the array to reverse the order of the buttons
diff --git a/src/view/com/lists/ListItems.tsx b/src/view/com/lists/ListItems.tsx
index 188518ea5..94e22f35e 100644
--- a/src/view/com/lists/ListItems.tsx
+++ b/src/view/com/lists/ListItems.tsx
@@ -45,6 +45,7 @@ export const ListItems = observer(
     onPressEditList,
     onPressDeleteList,
     onPressShareList,
+    onPressReportList,
     renderEmptyState,
     testID,
     headerOffset = 0,
@@ -57,6 +58,7 @@ export const ListItems = observer(
     onPressEditList: () => void
     onPressDeleteList: () => void
     onPressShareList: () => void
+    onPressReportList: () => void
     renderEmptyState?: () => JSX.Element
     testID?: string
     headerOffset?: number
@@ -169,6 +171,7 @@ export const ListItems = observer(
               onPressEditList={onPressEditList}
               onPressDeleteList={onPressDeleteList}
               onPressShareList={onPressShareList}
+              onPressReportList={onPressReportList}
             />
           ) : null
         } else if (item === ERROR_ITEM) {
@@ -208,6 +211,7 @@ export const ListItems = observer(
         onPressEditList,
         onPressDeleteList,
         onPressShareList,
+        onPressReportList,
         onPressTryAgain,
         onPressRetryLoadMore,
       ],
@@ -267,6 +271,7 @@ const ListHeader = observer(
     onPressEditList,
     onPressDeleteList,
     onPressShareList,
+    onPressReportList,
   }: {
     list: AppBskyGraphDefs.ListView
     isOwner: boolean
@@ -274,6 +279,7 @@ const ListHeader = observer(
     onPressEditList: () => void
     onPressDeleteList: () => void
     onPressShareList: () => void
+    onPressReportList: () => void
   }) => {
     const pal = usePalette('default')
     const store = useStores()
@@ -319,6 +325,7 @@ const ListHeader = observer(
                 onPressEditList={onPressEditList}
                 onToggleSubscribed={onToggleSubscribed}
                 onPressShareList={onPressShareList}
+                onPressReportList={onPressReportList}
               />
             )}
           </View>