diff --git a/src/core/client/admin/routes/Moderate/Moderate.spec.tsx b/src/core/client/admin/routes/Moderate/Moderate.spec.tsx index ffefb1403..d85a50a0e 100644 --- a/src/core/client/admin/routes/Moderate/Moderate.spec.tsx +++ b/src/core/client/admin/routes/Moderate/Moderate.spec.tsx @@ -13,7 +13,7 @@ it("renders correctly", () => { allStories: true, moderationQueues: {}, story: {}, - site: null, + siteID: null, query: "", routeParams: {}, queueName: "", diff --git a/src/core/client/admin/routes/Moderate/Moderate.tsx b/src/core/client/admin/routes/Moderate/Moderate.tsx index ceaa5c6f0..a7a76432f 100644 --- a/src/core/client/admin/routes/Moderate/Moderate.tsx +++ b/src/core/client/admin/routes/Moderate/Moderate.tsx @@ -26,15 +26,12 @@ interface RouteParams { interface Props { story: PropTypesOf["story"] & PropTypesOf["story"]; - site: - | { id: string } & PropTypesOf["site"] & - PropTypesOf["site"] - | null; query: PropTypesOf["query"]; moderationQueues: PropTypesOf< typeof ModerateNavigationContainer >["moderationQueues"]; allStories: boolean; + siteID: string | null; settings: PropTypesOf["settings"] | null; children?: React.ReactNode; queueName: string; @@ -44,13 +41,13 @@ interface Props { const Moderate: FunctionComponent = ({ moderationQueues, story, - site, query, allStories, children, queueName, routeParams, settings, + siteID, }) => { const [showHotkeysModal, setShowHotkeysModal] = useState(false); const closeModal = useCallback(() => { @@ -79,8 +76,8 @@ const Moderate: FunctionComponent = ({ siteSelector={ } /> @@ -88,7 +85,7 @@ const Moderate: FunctionComponent = ({
diff --git a/src/core/client/admin/routes/Moderate/ModerateContainer.tsx b/src/core/client/admin/routes/Moderate/ModerateContainer.tsx index 8cf36fe94..ab9b62aea 100644 --- a/src/core/client/admin/routes/Moderate/ModerateContainer.tsx +++ b/src/core/client/admin/routes/Moderate/ModerateContainer.tsx @@ -31,6 +31,7 @@ class ModerateContainer extends React.Component { "reported", "pending", "unmoderated", + "approved", "rejected", ].find(name => { return this.props.match.location.pathname.includes(name); @@ -40,8 +41,8 @@ class ModerateContainer extends React.Component { { ({ $storyID: ID $includeStory: Boolean! $siteID: ID - $includeSite: Boolean! ) { settings { ...ModerateSearchBarContainer_settings @@ -88,15 +85,8 @@ const enhanced = withRouteConfig({ ...ModerateSearchBarContainer_story site { id - ...ModerateNavigationContainer_site - ...SiteSelectorSelected_site } } - site(id: $siteID) @include(if: $includeSite) { - id - ...ModerateNavigationContainer_site - ...SiteSelectorSelected_site - } moderationQueues(storyID: $storyID, siteID: $siteID) { ...ModerateNavigationContainer_moderationQueues } diff --git a/src/core/client/admin/routes/Moderate/ModerateNavigation/ModerateNavigationContainer.tsx b/src/core/client/admin/routes/Moderate/ModerateNavigation/ModerateNavigationContainer.tsx index d2b1ebff4..371c096f5 100644 --- a/src/core/client/admin/routes/Moderate/ModerateNavigation/ModerateNavigationContainer.tsx +++ b/src/core/client/admin/routes/Moderate/ModerateNavigation/ModerateNavigationContainer.tsx @@ -8,7 +8,6 @@ import { } from "coral-framework/lib/relay"; import { ModerateNavigationContainer_moderationQueues as ModerationQueuesData } from "coral-admin/__generated__/ModerateNavigationContainer_moderationQueues.graphql"; -import { ModerateNavigationContainer_site as SiteData } from "coral-admin/__generated__/ModerateNavigationContainer_site.graphql"; import { ModerateNavigationContainer_story as StoryData } from "coral-admin/__generated__/ModerateNavigationContainer_story.graphql"; import ModerateCountsCommentEnteredSubscription from "./ModerateCountsCommentEnteredSubscription"; @@ -18,7 +17,7 @@ import Navigation from "./Navigation"; interface Props { moderationQueues: ModerationQueuesData | null; story: StoryData | null; - site: SiteData | null; + siteID: string | null; } const ModerateNavigationContainer: React.FunctionComponent = props => { @@ -35,7 +34,7 @@ const ModerateNavigationContainer: React.FunctionComponent = props => { } const vars = { storyID: props.story && props.story.id, - siteID: props.site && props.site.id, + siteID: props.siteID, }; const disposable = combineDisposables( subscribeToCommentEntered(vars), @@ -44,7 +43,7 @@ const ModerateNavigationContainer: React.FunctionComponent = props => { return () => { disposable.dispose(); }; - }, [Boolean(props.moderationQueues), props.story, props.site]); + }, [Boolean(props.moderationQueues), props.story, props.siteID]); if (!props.moderationQueues) { return ; @@ -55,7 +54,7 @@ const ModerateNavigationContainer: React.FunctionComponent = props => { reportedCount={props.moderationQueues.reported.count} pendingCount={props.moderationQueues.pending.count} storyID={props.story && props.story.id} - siteID={props.site && props.site.id} + siteID={props.siteID} /> ); }; @@ -66,11 +65,6 @@ const enhanced = withFragmentContainer({ id } `, - site: graphql` - fragment ModerateNavigationContainer_site on Site { - id - } - `, moderationQueues: graphql` fragment ModerateNavigationContainer_moderationQueues on ModerationQueues { unmoderated { diff --git a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelector.tsx b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelector.tsx index 1a107c534..f1b65fee2 100644 --- a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelector.tsx +++ b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelector.tsx @@ -5,31 +5,29 @@ import PaginatedSelect from "coral-admin/components/PaginatedSelect"; import { getModerationLink, QUEUE_NAME } from "coral-framework/helpers"; import { PropTypesOf } from "coral-framework/types"; -import SiteSelectorSelected from "./SiteSelectorSelected"; +import SiteSelectorCurrentSiteQuery from "./SiteSelectorCurrentSiteQuery"; import SiteSelectorSite from "./SiteSelectorSite"; import styles from "./SiteSelector.css"; interface Props { sites: Array<{ id: string } & PropTypesOf["site"]>; - site: - | { id: string } & PropTypesOf["site"] - | null; queueName: string; onLoadMore: () => void; hasMore: boolean; disableLoadMore: boolean; loading: boolean; + siteID: string | null; } const SiteSelector: FunctionComponent = ({ sites, - site, queueName, loading, onLoadMore, disableLoadMore, hasMore, + siteID, }) => { return ( = ({ className={styles.button} selected={ <> - {site && } + {siteID && } - {!site && ( + {!siteID && ( All sites @@ -55,7 +53,7 @@ const SiteSelector: FunctionComponent = ({ {sites.map(s => ( = ({ })} key={s.id} site={s} - active={(site && site.id === s.id) || false} + active={(siteID && siteID === s.id) || false} /> ))} diff --git a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorContainer.tsx b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorContainer.tsx index 6bb8e53a4..8a37b9b3d 100644 --- a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorContainer.tsx +++ b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorContainer.tsx @@ -6,7 +6,6 @@ import { useRefetch, withPaginationContainer, } from "coral-framework/lib/relay"; -import { PropTypesOf } from "coral-ui/types"; import { SiteSelectorContainer_query as QueryData } from "coral-admin/__generated__/SiteSelectorContainer_query.graphql"; import { SiteSelectorContainerPaginationQueryVariables } from "coral-admin/__generated__/SiteSelectorContainerPaginationQuery.graphql"; @@ -15,9 +14,9 @@ import SiteSelector from "./SiteSelector"; interface Props { query: QueryData | null; - site: PropTypesOf["site"] | null; relay: RelayPaginationProp; queueName: string; + siteID: string | null; } const SiteSelectorContainer: React.FunctionComponent = props => { @@ -32,11 +31,11 @@ const SiteSelectorContainer: React.FunctionComponent = props => { ); }; diff --git a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorCurrentSiteQuery.tsx b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorCurrentSiteQuery.tsx new file mode 100644 index 000000000..035f144d6 --- /dev/null +++ b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorCurrentSiteQuery.tsx @@ -0,0 +1,50 @@ +import React, { FunctionComponent } from "react"; + +import { + graphql, + QueryRenderData, + QueryRenderer, +} from "coral-framework/lib/relay"; +import Spinner from "coral-stream/common/Spinner"; +import { Delay } from "coral-ui/components"; + +import { SiteSelectorCurrentSiteQuery as QueryTypes } from "coral-admin/__generated__/SiteSelectorCurrentSiteQuery.graphql"; + +interface Props { + siteID: string; +} + +export const render = ({ error, props }: QueryRenderData) => { + if (error) { + return
{error.message}
; + } + if (props) { + return
{props.site && props.site.name}
; + } + return ( + + + + ); +}; + +const enhanced: FunctionComponent = ({ siteID }) => { + return ( + + query={graphql` + query SiteSelectorCurrentSiteQuery($siteID: ID!) { + site(id: $siteID) { + id + name + } + } + `} + variables={{ + siteID, + }} + render={render} + /> + ); +}; + +export default enhanced; diff --git a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorSelected.css b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorSelected.css deleted file mode 100644 index c7b5db56b..000000000 --- a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorSelected.css +++ /dev/null @@ -1,4 +0,0 @@ -.root { - overflow-x: hidden; - text-overflow: ellipsis; -} diff --git a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorSelected.tsx b/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorSelected.tsx deleted file mode 100644 index db33241c3..000000000 --- a/src/core/client/admin/routes/Moderate/SiteSelector/SiteSelectorSelected.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import React, { FunctionComponent } from "react"; - -import { graphql, withFragmentContainer } from "coral-framework/lib/relay"; - -import { SiteSelectorSelected_site } from "coral-admin/__generated__/SiteSelectorSelected_site.graphql"; - -import styles from "./SiteSelectorSelected.css"; - -interface Props { - site: SiteSelectorSelected_site; -} - -const SiteSelectorSelected: FunctionComponent = ({ site }) => { - return {site.name}; -}; - -const enhanced = withFragmentContainer({ - site: graphql` - fragment SiteSelectorSelected_site on Site { - name - id - } - `, -})(SiteSelectorSelected); - -export default enhanced; diff --git a/src/core/client/admin/routes/Moderate/__snapshots__/Moderate.spec.tsx.snap b/src/core/client/admin/routes/Moderate/__snapshots__/Moderate.spec.tsx.snap index 2a720a9d5..14d8c6ae0 100644 --- a/src/core/client/admin/routes/Moderate/__snapshots__/Moderate.spec.tsx.snap +++ b/src/core/client/admin/routes/Moderate/__snapshots__/Moderate.spec.tsx.snap @@ -16,7 +16,7 @@ exports[`renders correctly 1`] = ` } story={Object {}} @@ -26,7 +26,7 @@ exports[`renders correctly 1`] = ` > diff --git a/src/core/server/graph/schema/schema.graphql b/src/core/server/graph/schema/schema.graphql index 15df340dd..1dfa9a4d0 100644 --- a/src/core/server/graph/schema/schema.graphql +++ b/src/core/server/graph/schema/schema.graphql @@ -2929,7 +2929,7 @@ type Query { status: USER_STATUS ): UsersConnection! @auth(roles: [ADMIN, MODERATOR]) - site(id: ID): Site @auth(roles: [ADMIN, MODERATOR]) + site(id: ID!): Site @auth(roles: [ADMIN, MODERATOR]) sites(first: Int = 10 @constraint(max: 50), after: Cursor): SitesConnection! @auth(roles: [ADMIN, MODERATOR])