Skip labeler selection for Bluesky-only cases

src/components/moderation/ReportDialog/index.tsx

@@ -113,6 +113,13 @@ function Inner(props: ReportDialogProps) {
   const [isPending, setPending] = React.useState(false)
   const [isSuccess, setSuccess] = React.useState(false)
 
+  // some reasons ONLY go to Bluesky
+  const isBskyOnlyReason = state?.selectedOption?.reason
+    ? BSKY_LABELER_ONLY_REPORT_REASONS.has(state.selectedOption.reason)
+    : false
+  // some subjects (chats) only go to Bluesky
+  const isBskyOnlySubject = props.subject.type === 'convoMessage'
+
   /**
    * Labelers that support this `subject` and its NSID collection
    */
@@ -139,12 +146,6 @@ function Inner(props: ReportDialogProps) {
       })
       .filter(l => {
         if (!state.selectedOption) return false
-        // some reasons ONLY go to Bluesky
-        const isBskyOnlyReason = BSKY_LABELER_ONLY_REPORT_REASONS.has(
-          state.selectedOption.reason,
-        )
-        // some subjects (chats) only go to Bluesky
-        const isBskyOnlySubject = props.subject.type === 'convoMessage'
         if (isBskyOnlyReason || isBskyOnlySubject) {
           return l.creator.did === BSKY_LABELER_DID
         }
@@ -159,10 +160,25 @@ function Inner(props: ReportDialogProps) {
           )
         )
       })
-  }, [props, allLabelers, state.selectedOption])
+  }, [
+    props,
+    allLabelers,
+    state.selectedOption,
+    isBskyOnlyReason,
+    isBskyOnlySubject,
+  ])
   const hasSupportedLabelers = !!supportedLabelers.length
   const hasSingleSupportedLabeler = supportedLabelers.length === 1
 
+  /**
+   * We skip the select labeler step if there's only one possible labeler, and
+   * that labeler is Bluesky (which is the case for chat reports and certain
+   * reason types). We'll use this below to adjust the indexing and skip the
+   * step in the UI.
+   */
+  const isAlwaysBskyLabeler =
+    hasSingleSupportedLabeler && (isBskyOnlyReason || isBskyOnlySubject)
+
   const onSubmit = React.useCallback(async () => {
     dispatch({type: 'clearError'})
 
@@ -376,6 +392,17 @@ function Inner(props: ReportDialogProps) {
           ) : null}
         </StepOuter>
 
+        {isAlwaysBskyLabeler ? (
+          <ActionOnce
+            check={() => !state.selectedLabeler}
+            callback={() => {
+              dispatch({
+                type: 'selectLabeler',
+                labeler: supportedLabelers[0],
+              })
+            }}
+          />
+        ) : (
           <StepOuter>
             <StepTitle
               index={3}
@@ -442,8 +469,8 @@ function Inner(props: ReportDialogProps) {
                       // should never happen in our app
                       <Admonition.Admonition type="warning">
                         <Trans>
-                        Unfortunately, none of your subscribed labelers supports
+                          Unfortunately, none of your subscribed labelers
-                        this report type.
+                          supports this report type.
                         </Trans>
                       </Admonition.Admonition>
                     )}
@@ -452,12 +479,17 @@ function Inner(props: ReportDialogProps) {
               </>
             )}
           </StepOuter>
+        )}
 
         <StepOuter>
           <StepTitle
-            index={4}
+            index={isAlwaysBskyLabeler ? 3 : 4}
             title={_(msg`Submit report`)}
-            activeIndex1={state.activeStepIndex1}
+            activeIndex1={
+              isAlwaysBskyLabeler
+                ? state.activeStepIndex1 - 1
+                : state.activeStepIndex1
+            }
           />
           {state.activeStepIndex1 === 4 && (
             <>