import { Match , Router , withRouter } from "found" ; import React , { FunctionComponent , useEffect , useMemo } from "react" ; import { graphql } from "react-relay" ; import { getModerationLink , QUEUE_NAME } from "coral-framework/helpers" ; import parseModerationOptions from "coral-framework/helpers/parseModerationOptions" ; import { withRouteConfig } from "coral-framework/lib/router" ; import { Spinner } from "coral-ui/components/v2" ; import { ModerateContainerQueryResponse } from "coral-admin/__generated__/ModerateContainerQuery.graphql" ; import Moderate from "./Moderate" ; interface RouteParams { storyID ? : string ; siteID ? : string ; } interface Props { data : ModerateContainerQueryResponse | null ; router : Router ; match : Match & { params : RouteParams ; } ; } const queueNames = [ "reported" , "pending" , "unmoderated" , "approved" , "rejected" , "review" , ] ; const ModerateContainer = ( { data , match , router , children , } ) => { const allStories = ! match . params . storyID ; const queueName = useMemo ( ( ) => queueNames . find ( ( name ) => match . location . pathname . includes ( name ) ) , [ match . location . pathname ] ) ; useEffect ( ( ) => { if ( ! data || ! data . viewer ) { return ; } if ( ! data . viewer . moderationScopes ?. scoped || ! data . viewer . moderationScopes . sites ) { return ; } const sites = data . viewer . moderationScopes . sites ; const redirect = ( ) => router . push ( getModerationLink ( { queue : queueName , siteID : sites [ 0 ] . id , } ) ) ; if ( data . story ) { if ( ! data . story . site . canModerate ) { redirect ( ) ; return ; } return ; } const { siteID } = parseModerationOptions ( match ) ; if ( ! siteID ) { redirect ( ) ; return ; } if ( ! sites . some ( ( { id } ) => id === siteID ) ) { redirect ( ) ; return ; } } , [ router , match , data , queueName ] ) ; const { section } = parseModerationOptions ( match ) ; if ( ! data ) { return ( < Moderate moderationQueues = { null } story = { null } settings = { null } siteID = { null } section = { section } query = { data } viewer = { null } routeParams = { match . params } queueName = { queueName } allStories = { allStories } > < Spinner /> < /Moderate>); } return ( < Moderate moderationQueues = { data . moderationQueues } story = { data . story || null } siteID = { data . story ?. site . id || null } section = { section } routeParams = { match . params } query = { data } viewer = { data . viewer } allStories = { allStories } settings = { data . settings } queueName = { queueName } isArchived = { data . story ?. isArchived || data . story ?. isArchiving } > { children } < /Moderate>); } ; const enhanced = withRouteConfig < Props > ( { query : graphql `
    query ModerateContainerQuery(
      $storyID: ID
      $includeStory: Boolean!
      $siteID: ID
      $section: SectionFilter
    ) {
      ...SiteSelectorContainer_query
      ...SectionSelectorContainer_query

      settings {
        ...ModerateSearchBarContainer_settings
        ...ModerateNavigationContainer_settings
      }

      story(id: $storyID) @include(if: $includeStory) {
        ...ModerateNavigationContainer_story
        ...ModerateSearchBarContainer_story

        site {
          id
          canModerate
        }
        isArchived
        isArchiving
      }

      moderationQueues(storyID: $storyID, siteID: $siteID, section: $section) {
        ...ModerateNavigationContainer_moderationQueues
      }

      viewer {
        ...SiteSelectorContainer_viewer

        id
        role
        moderationScopes {
          scoped
          sites {
            id
          }
        }
      }
    }
  ` , cacheConfig : { force : true } , prepareVariables : ( params , match ) => { const { storyID , siteID , section } = parseModerationOptions ( match ) ; return { storyID , siteID , section , includeStory : ! ! storyID , } ; } , } ) ( withRouter ( ModerateContainer ) ) ; export default enhanced ;