MC-1680: adding a disable/enable switch for Sections (#1232)

* MC-1680: adding a disable/enable switch for Sections

Author: katerinachinnappan

src/api/fragments/SectionData.ts

@@ -8,6 +8,7 @@ export const BaseSectionData = gql`
     scheduledSurfaceGuid
     sort
     createSource
+    disabled
     active
   }
 `;

src/api/generatedTypes.ts

@@ -86,8 +86,6 @@ export type ApprovedCorpusItem = {
   excerpt: Scalars['String'];
   /** An alternative primary key in UUID format that is generated on creation. */
   externalId: Scalars['ID'];
-  /** The quality grade associated with this CorpusItem. */
-  grade?: Maybe<ApprovedItemGrade>;
   /** True if the domain of the corpus item has been scheduled in the past. */
   hasTrustedDomain: Scalars['Boolean'];
   /**
@@ -208,13 +206,6 @@ export type ApprovedCorpusItemScheduledSurfaceHistoryFilters = {
   scheduledSurfaceGuid?: InputMaybe<Scalars['ID']>;
 };
 
-/** Valid grade values for CorpusItem (public graph) and ApprovedItem (admin graph) */
-export enum ApprovedItemGrade {
-  A = 'A',
-  B = 'B',
-  C = 'C',
-}
-
 export type ArticleMarkdown = {
   __typename?: 'ArticleMarkdown';
   images?: Maybe<Array<MarkdownImagePosition>>;
@@ -521,8 +512,6 @@ export type CreateApprovedCorpusItemInput = {
   datePublished?: InputMaybe<Scalars['Date']>;
   /** The excerpt of the Approved Item. */
   excerpt: Scalars['String'];
-  /** The quality grade associated with this CorpusItem. */
-  grade?: InputMaybe<ApprovedItemGrade>;
   /** The image URL for this item's accompanying picture. */
   imageUrl: Scalars['Url'];
   /** Whether this story is a Pocket Collection. */
@@ -732,6 +721,17 @@ export type DeleteScheduledCorpusItemInput = {
   reasons?: InputMaybe<Scalars['String']>;
 };
 
+/** Input data for disabling or enabling a Section */
+export type DisableEnableSectionInput = {
+  /**
+   * Indicates whether or not a Section is fully disabled from display on NewTab. Can only  be controlled
+   * in the admin tool.
+   */
+  disabled: Scalars['Boolean'];
+  /** An alternative primary key in UUID format supplied by ML. */
+  externalId: Scalars['ID'];
+};
+
 /** Metadata from a domain, originally populated from ClearBit */
 export type DomainMetadata = {
   __typename?: 'DomainMetadata';
@@ -1227,6 +1227,8 @@ export type Mutation = {
   deleteCollectionStory: CollectionStory;
   /** Deletes an item from a Scheduled Surface. */
   deleteScheduledCorpusItem: ScheduledCorpusItem;
+  /** Disables or enables a Section. Can only be done from the admin tool. */
+  disableEnableSection: Section;
   /**
    * Lets an automated process create an Approved Item and optionally schedule it to appear
    * on a Scheduled Surface.
@@ -1254,8 +1256,6 @@ export type Mutation = {
   rescheduleScheduledCorpusItem: ScheduledCorpusItem;
   /** Updates an Approved Item. */
   updateApprovedCorpusItem: ApprovedCorpusItem;
-  /** Updates the grade of an Approved Item */
-  updateApprovedCorpusItemGrade: ApprovedCorpusItem;
   /** Updates a Collection. */
   updateCollection: Collection;
   /** Updates a CollectionAuthor. */
@@ -1373,6 +1373,10 @@ export type MutationDeleteScheduledCorpusItemArgs = {
   data: DeleteScheduledCorpusItemInput;
 };
 
+export type MutationDisableEnableSectionArgs = {
+  data: DisableEnableSectionInput;
+};
+
 export type MutationImportApprovedCorpusItemArgs = {
   data: ImportApprovedCorpusItemInput;
 };
@@ -1405,10 +1409,6 @@ export type MutationUpdateApprovedCorpusItemArgs = {
   data: UpdateApprovedCorpusItemInput;
 };
 
-export type MutationUpdateApprovedCorpusItemGradeArgs = {
-  data: UpdateApprovedCorpusItemGradeInput;
-};
-
 export type MutationUpdateCollectionArgs = {
   data: UpdateCollectionInput;
 };
@@ -1689,7 +1689,7 @@ export type Query = {
   getScheduledCorpusItems: Array<ScheduledCorpusItemsResult>;
   /** Retrieves all ScheduledSurfaces available to the given SSO user. Requires an Authorization header. */
   getScheduledSurfacesForUser: Array<ScheduledSurface>;
-  /** Retrieves a list of active Sections with their corresponding active SectionItems for a scheduled surface. */
+  /** Retrieves a list of active and enabled/disabled Sections with their corresponding active SectionItems for a scheduled surface. */
   getSectionsWithSectionItems: Array<Section>;
   /** returns parser meta data for a given url */
   getUrlMetadata: UrlMetadata;
@@ -2081,6 +2081,11 @@ export type Section = {
   createSource: ActivitySource;
   /** A Unix timestamp of when the Section was created. */
   createdAt: Scalars['Int'];
+  /**
+   * Indicates whether or not a Section is fully disabled from display on NewTab. Can only  be controlled
+   * in the admin tool.
+   */
+  disabled: Scalars['Boolean'];
   /** An alternative primary key in UUID format. */
   externalId: Scalars['ID'];
   /** The GUID of the Scheduled Surface. Example: 'NEW_TAB_EN_US'. */
@@ -2273,16 +2278,6 @@ export type UnMarseable = {
   html: Scalars['String'];
 };
 
-/** Input data for updating the grade of an Approved Item. */
-export type UpdateApprovedCorpusItemGradeInput = {
-  /** The UI screen where the approved corpus item is being graded from. */
-  actionScreen: ActionScreen;
-  /** Approved Item ID. */
-  externalId: Scalars['ID'];
-  /** The quality grade associated with this CorpusItem. */
-  grade: ApprovedItemGrade;
-};
-
 /** Input data for updating an Approved Item. */
 export type UpdateApprovedCorpusItemInput = {
   /**
@@ -2298,8 +2293,6 @@ export type UpdateApprovedCorpusItemInput = {
   excerpt: Scalars['String'];
   /** Approved Item ID. */
   externalId: Scalars['ID'];
-  /** The quality grade associated with this CorpusItem. */
-  grade?: InputMaybe<ApprovedItemGrade>;
   /** The image URL for this item's accompanying picture. */
   imageUrl: Scalars['Url'];
   /**
@@ -2636,6 +2629,7 @@ export type BaseSectionDataFragment = {
   scheduledSurfaceGuid: string;
   sort?: number | null;
   createSource: ActivitySource;
+  disabled: boolean;
   active: boolean;
 };
 
@@ -2648,6 +2642,7 @@ export type SectionDataFragment = {
   scheduledSurfaceGuid: string;
   sort?: number | null;
   createSource: ActivitySource;
+  disabled: boolean;
   active: boolean;
   sectionItems: Array<{
     __typename?: 'SectionItem';
@@ -3373,6 +3368,68 @@ export type DeleteScheduledItemMutation = {
   };
 };
 
+export type DisableEnableSectionMutationVariables = Exact<{
+  data: DisableEnableSectionInput;
+}>;
+
+export type DisableEnableSectionMutation = {
+  __typename?: 'Mutation';
+  disableEnableSection: {
+    __typename?: 'Section';
+    createdAt: number;
+    updatedAt: number;
+    externalId: string;
+    title: string;
+    scheduledSurfaceGuid: string;
+    sort?: number | null;
+    createSource: ActivitySource;
+    disabled: boolean;
+    active: boolean;
+    sectionItems: Array<{
+      __typename?: 'SectionItem';
+      createdAt: number;
+      updatedAt: number;
+      externalId: string;
+      rank?: number | null;
+      approvedItem: {
+        __typename?: 'ApprovedCorpusItem';
+        externalId: string;
+        prospectId?: string | null;
+        title: string;
+        language: CorpusLanguage;
+        publisher: string;
+        datePublished?: any | null;
+        url: any;
+        hasTrustedDomain: boolean;
+        imageUrl: any;
+        excerpt: string;
+        status: CuratedStatus;
+        source: CorpusItemSource;
+        topic: string;
+        isCollection: boolean;
+        isTimeSensitive: boolean;
+        isSyndicated: boolean;
+        createdBy: string;
+        createdAt: number;
+        updatedBy?: string | null;
+        updatedAt: number;
+        authors: Array<{
+          __typename?: 'CorpusItemAuthor';
+          name: string;
+          sortOrder: number;
+        }>;
+        scheduledSurfaceHistory: Array<{
+          __typename?: 'ApprovedCorpusItemScheduledSurfaceHistory';
+          externalId: string;
+          createdBy: string;
+          scheduledDate: any;
+          scheduledSurfaceGuid: string;
+        }>;
+      };
+    }>;
+  };
+};
+
 export type ImageUploadMutationVariables = Exact<{
   image: Scalars['Upload'];
   width: Scalars['Int'];
@@ -4874,6 +4931,7 @@ export type GetSectionsWithSectionItemsQuery = {
     scheduledSurfaceGuid: string;
     sort?: number | null;
     createSource: ActivitySource;
+    disabled: boolean;
     active: boolean;
     sectionItems: Array<{
       __typename?: 'SectionItem';
@@ -5117,6 +5175,7 @@ export const BaseSectionDataFragmentDoc = gql`
     scheduledSurfaceGuid
     sort
     createSource
+    disabled
     active
   }
 `;
@@ -6053,6 +6112,57 @@ export type DeleteScheduledItemMutationOptions = Apollo.BaseMutationOptions<
   DeleteScheduledItemMutation,
   DeleteScheduledItemMutationVariables
 >;
+export const DisableEnableSectionDocument = gql`
+  mutation disableEnableSection($data: DisableEnableSectionInput!) {
+    disableEnableSection(data: $data) {
+      ...SectionData
+    }
+  }
+  ${SectionDataFragmentDoc}
+`;
+export type DisableEnableSectionMutationFn = Apollo.MutationFunction<
+  DisableEnableSectionMutation,
+  DisableEnableSectionMutationVariables
+>;
+
+/**
+ * __useDisableEnableSectionMutation__
+ *
+ * To run a mutation, you first call `useDisableEnableSectionMutation` within a React component and pass it any options that fit your needs.
+ * When your component renders, `useDisableEnableSectionMutation` returns a tuple that includes:
+ * - A mutate function that you can call at any time to execute the mutation
+ * - An object with fields that represent the current status of the mutation's execution
+ *
+ * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
+ *
+ * @example
+ * const [disableEnableSectionMutation, { data, loading, error }] = useDisableEnableSectionMutation({
+ *   variables: {
+ *      data: // value for 'data'
+ *   },
+ * });
+ */
+export function useDisableEnableSectionMutation(
+  baseOptions?: Apollo.MutationHookOptions<
+    DisableEnableSectionMutation,
+    DisableEnableSectionMutationVariables
+  >,
+) {
+  const options = { ...defaultOptions, ...baseOptions };
+  return Apollo.useMutation<
+    DisableEnableSectionMutation,
+    DisableEnableSectionMutationVariables
+  >(DisableEnableSectionDocument, options);
+}
+export type DisableEnableSectionMutationHookResult = ReturnType<
+  typeof useDisableEnableSectionMutation
+>;
+export type DisableEnableSectionMutationResult =
+  Apollo.MutationResult<DisableEnableSectionMutation>;
+export type DisableEnableSectionMutationOptions = Apollo.BaseMutationOptions<
+  DisableEnableSectionMutation,
+  DisableEnableSectionMutationVariables
+>;
 export const ImageUploadDocument = gql`
   mutation imageUpload(
     $image: Upload!

src/api/mutations/disableEnableSection.ts

@@ -0,0 +1,14 @@
+import { gql } from '@apollo/client';
+import { SectionData } from '../fragments/SectionData';
+
+/**
+ * Disables or enables a Section.
+ */
+export const disableEnableSection = gql`
+  mutation disableEnableSection($data: DisableEnableSectionInput!) {
+    disableEnableSection(data: $data) {
+      ...SectionData
+    }
+  }
+  ${SectionData}
+`;

src/curated-corpus/components/SectionDetails/SectionDetails.test.tsx

@@ -14,10 +14,12 @@ import { getTestApprovedItem } from '../../helpers/approvedItem';
 describe('The SectionDetails component', () => {
   const item: ApprovedCorpusItem = getTestApprovedItem();
   const mockSections: Section[] = [
+    // enabled section
     {
       externalId: '1',
       title: 'Section 1',
       active: true,
+      disabled: false,
       sectionItems: [
         {
           externalId: 'item-1',
@@ -31,10 +33,12 @@ describe('The SectionDetails component', () => {
       createSource: ActivitySource.Ml,
       scheduledSurfaceGuid: 'NEW_TAB_EN_US',
     },
+    // disabled section
     {
       externalId: '2',
       title: 'Section 2',
       active: true,
+      disabled: true,
       sectionItems: [
         {
           externalId: 'item-2',
@@ -162,4 +166,42 @@ describe('The SectionDetails component', () => {
       mockSections[0].sectionItems[0],
     );
   });
+
+  it('should render & toggle the Disable switch', async () => {
+    render(
+      <MockedProvider>
+        <SnackbarProvider maxSnack={3}>
+          <SectionDetails
+            sections={mockSections}
+            currentSection="Section 1" // section to be disabled
+            setCurrentSectionItem={mockSetCurrentSectionItem}
+            currentScheduledSurfaceGuid="NEW_TAB_EN_US"
+            toggleEditModal={mockToggleEditModal}
+            refetch={mockRefetch}
+          />
+        </SnackbarProvider>
+      </MockedProvider>,
+    );
+    const disableSwitch = screen.getByRole('checkbox', { name: /disable/i });
+    expect(disableSwitch).toBeInTheDocument();
+  });
+
+  it('should render & toggle the Enable switch', async () => {
+    render(
+      <MockedProvider>
+        <SnackbarProvider maxSnack={3}>
+          <SectionDetails
+            sections={mockSections}
+            currentSection="Section 2" // section to be disabled
+            setCurrentSectionItem={mockSetCurrentSectionItem}
+            currentScheduledSurfaceGuid="NEW_TAB_EN_US"
+            toggleEditModal={mockToggleEditModal}
+            refetch={mockRefetch}
+          />
+        </SnackbarProvider>
+      </MockedProvider>,
+    );
+    const enableSwitch = screen.getByRole('checkbox', { name: /enable/i });
+    expect(enableSwitch).toBeInTheDocument();
+  });
 });