<commit_before>import gql from 'graphql-tag';
import { map, isEmpty } from 'lodash';
import React, { useState } from 'react';
import { format, parse } from 'date-fns';
import { useQuery } from '@apollo/react-hooks';

import Action, { ActionFragment } from '../Action';
import Shell from '../utilities/Shell';
import TextBlock from '../utilities/TextBlock';
import RogueClient from '../../utilities/RogueClient';

import './campaign.scss';

const SHOW_CAMPAIGN_ACTIONS_QUERY = gql`
  query ShowCampaignActionsQuery($id: Int!, $idString: String!) {
    campaign(id: $id) {
      actions {
        ...ActionFragment
      }
      causes {
        id
        name
      }
      createdAt
      endDate
      id
      contentfulCampaignId
      impactDoc
      internalTitle
      startDate
      updatedAt
    }
    campaignWebsiteByCampaignId(campaignId: $idString) {
      title
      url
    }
  }
  ${ActionFragment}
`;

const Campaign = ({ id }) => {
  const apiClient = new RogueClient(window.location.origin, {
    headers: {
      Authorization: `Bearer ${window.AUTH.token}`,
    },
  });

  const { loading, error, data } = useQuery(SHOW_CAMPAIGN_ACTIONS_QUERY, {
    variables: { id, idString: `${id}` },
  });

  if (error) {
    return <TextBlock title="Error" content={JSON.stringify(error)} />;
  }

  if (loading) {
    return <TextBlock title="Loading actions..." />;
  }

  function deleteAction(action, event) {
    event.preventDefault();

    const confirmed = confirm(
      `🚨🔥🚨 Are you sure you want to delete Action ID ${action.id}? 🚨🔥🚨`,
    );

    if (confirmed) {
      // Make API request to Rogue to delete the action.
      apiClient
        .delete(`actions/${action.id}`)
        .then(() => {
          window.location.href = `/campaigns/${id}`;
          alert(`Deleted Action ID ${action.id}`);
        })
        .catch(error =>
          alert(
            `Cannot delete Action ID ${action.id}: ${JSON.stringify(error)}`,
          ),
        );
    }
  }

  const { campaign, campaignWebsiteByCampaignId } = data;

  return (
    <div className="container -padded">
      <div className="container__block -narrow -half">
        <h3>Campaign Information</h3>
      </div>
      <div className="container__block -narrow -half">
        <a
          className="button -secondary"
          href={`/campaigns/${campaign.id}/pending`}
        >
          Campaign Inbox
        </a>
      </div>
      <div className="container__block -narrow">
        <h4>Internal Campaign Name</h4>
        <p>{campaign.internalTitle}</p>

        <h4>Campaign ID</h4>
        <p>{campaign.id}</p>

        <h4>Contentful Campaign ID</h4>
        {campaign.contentfulCampaignId ? (
          <p>{campaign.contentfulCampaignId}</p>
        ) : (
          <p>–</p>
        )}

        <h4>URL</h4>
        <p>
          {campaignWebsiteByCampaignId ? (
            <a href={campaignWebsiteByCampaignId.url} target="_blank">
              {campaignWebsiteByCampaignId.title}
            </a>
          ) : (
            '–'
          )}
        </p>

        <h4>Cause Area</h4>
        <p>
          {campaign.causes.length<commit_msg>add groupTypeId to Campaign component (#1045)<commit_after>import gql from 'graphql-tag';
import { map, isEmpty } from 'lodash';
import React, { useState } from 'react';
import { format, parse } from 'date-fns';
import { useQuery } from '@apollo/react-hooks';

import Action, { ActionFragment } from '../Action';
import Shell from '../utilities/Shell';
import TextBlock from '../utilities/TextBlock';
import RogueClient from '../../utilities/RogueClient';

import './campaign.scss';

const SHOW_CAMPAIGN_ACTIONS_QUERY = gql`
  query ShowCampaignActionsQuery($id: Int!, $idString: String!) {
    campaign(id: $id) {
      actions {
        ...ActionFragment
      }
      causes {
        id
        name
      }
      createdAt
      endDate
      id
      contentfulCampaignId
      impactDoc
      internalTitle
      startDate
      updatedAt
      groupTypeId
    }
    campaignWebsiteByCampaignId(campaignId: $idString) {
      title
      url
    }
  }
  ${ActionFragment}
`;

const Campaign = ({ id }) => {
  const apiClient = new RogueClient(window.location.origin, {
    headers: {
      Authorization: `Bearer ${window.AUTH.token}`,
    },
  });

  const { loading, error, data } = useQuery(SHOW_CAMPAIGN_ACTIONS_QUERY, {
    variables: { id, idString: `${id}` },
  });

  if (error) {
    return <TextBlock title="Error" content={JSON.stringify(error)} />;
  }

  if (loading) {
    return <TextBlock title="Loading actions..." />;
  }

  function deleteAction(action, event) {
    event.preventDefault();

    const confirmed = confirm(
      `🚨🔥🚨 Are you sure you want to delete Action ID ${action.id}? 🚨🔥🚨`,
    );

    if (confirmed) {
      // Make API request to Rogue to delete the action.
      apiClient
        .delete(`actions/${action.id}`)
        .then(() => {
          window.location.href = `/campaigns/${id}`;
          alert(`Deleted Action ID ${action.id}`);
        })
        .catch(error =>
          alert(
            `Cannot delete Action ID ${action.id}: ${JSON.stringify(error)}`,
          ),
        );
    }
  }

  const { campaign, campaignWebsiteByCampaignId } = data;

  return (
    <div className="container -padded">
      <div className="container__block -narrow -half">
        <h3>Campaign Information</h3>
      </div>
      <div className="container__block -narrow -half">
        <a
          className="button -secondary"
          href={`/campaigns/${campaign.id}/pending`}
        >
          Campaign Inbox
        </a>
      </div>
      <div className="container__block -narrow">
        <h4>Internal Campaign Name</h4>
        <p>{campaign.internalTitle}</p>

        <h4>Campaign ID</h4>
        <p>{campaign.id}</p>

        <h4>Contentful Campaign ID</h4>
        {campaign.contentfulCampaignId ? (
          <p>{campaign.contentfulCampaignId}</p>
        ) : (
          <p>–</p>
        )}

        <h4>Campaign Group Type ID</h4>
        {campaign.groupTypeId ? (
          <a href={`/group-types/${campaign.groupTypeId}`}>{campaign.groupTypeId}</a>
        ) : (
          <p>–</p>
        )}
        <h4>URL</h4>
        <p>
          {campaignWebsiteByCampaignId ? (
            <a href={campaignWebsiteByCampaignId.url} target="_blank">
              {campaignWebsiteByCampaignId.title}
            </a>
          ) : (
            '–'
          )}
        </p>

        <h4>Cause Area</h4>
        <p>
          {campaign.causes.length
{'fraction_non_alphanumeric': 0.14466463414634145, 'fraction_numerical': 0.004573170731707317, 'mean_word_length': 2.124285714285714, 'pattern_counts': {'":': 0, '<': 79, '<?xml version=': 0, '>': 85, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5002972', 'n_tokens_mistral': 2105, 'n_tokens_neox': 2044, 'n_words': 427}