<commit_before>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';

import Spacer from 'atoms/Spacer';
import Layout from 'atoms/Layout';
import Col from 'atoms/Layout/Col';
import Hide from 'wrappers/Hide';

import BlogIntro from '../Intro/Blog';
import LinkList from '../LinkList';
import ArticleImage from '../ArticleImage';
import MobileBack from '../MobileBack';
import { fetchPosts } from '../../utils/fetchMagazinePosts';
import fullBlogUrl from '../../utils/fullBlogUrl';

import styles from '../ProductDisplay/product_display.module.scss';

class MagazineDisplay extends Component {
  constructor() {
    super();

    this.state = {
      'latest-magazine': {
        loading: true,
        data: [],
      },
      'money-magazine': {
        loading: true,
        data: [],
      },
      'tech-magazine': {
        loading: true,
        data: [],
      },
      'health-magazine': {
        loading: true,
        data: [],
      },
      'auto-magazine': {
        loading: true,
        data: [],
      },
      'pet-magazine': {
        loading: true,
        data: [],
      },
      'insurance-magazine': {
        loading: true,
        data: [],
      },
    };
  }

  componentWillReceiveProps(nextProps) {
    const emptyPosts = this.state[this.props.activeName].data.length === 0;

    if (nextProps.isActive && emptyPosts) {
      Promise.all([
        fetchPosts({
          featured: 'false',
          tag: this.props.tag,
          limit: 4,
        }),
        fetchPosts({
          featured: 'true',
          tag: this.props.tag,
          limit: 2,
        })
      ])
        .then((data) => {
          const recommendedPosts = data[0].posts.map((p) => {
            const post = p;

            post.url = fullBlogUrl(p.url);

            return post;
          });

          this.setState({
            [this.props.activeName]: {
              loading: false,
              data: [
                {
                  type: 'list',
                  header: 'Recommended',
                  posts: recommendedPosts,
                },
                {
                  type: 'featured',
                  post: data[1].posts[0],
                },
                {
                  type: 'featured',
                  post: data[1].posts[1],
                }
              ]
            }
          });
        });
    }
  }

  get list() {
    const {
      activeName,
      mobileCollapsedMenu,
    } = this.props;

    const data = this.state[activeName].data;

    return (
      data.map((item) => {
        if (item.type === 'list') {
          return (
            <Col
              fullwidth
              key={item.header}
              className={styles['display-list']}<commit_msg>Fix blog urls for featured articles<commit_after>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';

import Spacer from 'atoms/Spacer';
import Layout from 'atoms/Layout';
import Col from 'atoms/Layout/Col';
import Hide from 'wrappers/Hide';

import BlogIntro from '../Intro/Blog';
import LinkList from '../LinkList';
import ArticleImage from '../ArticleImage';
import MobileBack from '../MobileBack';
import { fetchPosts } from '../../utils/fetchMagazinePosts';
import fullBlogUrl from '../../utils/fullBlogUrl';

import styles from '../ProductDisplay/product_display.module.scss';

class MagazineDisplay extends Component {
  constructor() {
    super();

    this.state = {
      'latest-magazine': {
        loading: true,
        data: [],
      },
      'money-magazine': {
        loading: true,
        data: [],
      },
      'tech-magazine': {
        loading: true,
        data: [],
      },
      'health-magazine': {
        loading: true,
        data: [],
      },
      'auto-magazine': {
        loading: true,
        data: [],
      },
      'pet-magazine': {
        loading: true,
        data: [],
      },
      'insurance-magazine': {
        loading: true,
        data: [],
      },
    };
  }

  componentWillReceiveProps(nextProps) {
    const emptyPosts = this.state[this.props.activeName].data.length === 0;

    if (nextProps.isActive && emptyPosts) {
      Promise.all([
        fetchPosts({
          featured: 'false',
          tag: this.props.tag,
          limit: 4,
        }),
        fetchPosts({
          featured: 'true',
          tag: this.props.tag,
          limit: 2,
        })
      ])
        .then((data) => {
          const formattedPosts = (idx) => data[idx].posts.map((p) => {
            const post = p;

            post.url = fullBlogUrl(p.url);

            return post;
          });

          const featuredPosts = formattedPosts(1);

          this.setState({
            [this.props.activeName]: {
              loading: false,
              data: [
                {
                  type: 'list',
                  header: 'Recommended',
                  posts: formattedPosts(0),
                },
                {
                  type: 'featured',
                  post: featuredPosts[0],
                },
                {
                  type: 'featured',
                  post: featuredPosts[1],
                }
              ]
            }
          });
        });
    }
  }

  get list() {
    const {
      activeName,
      mobileCollapsedMenu,
    } = this.props;

    const data = this.state[activeName].data;

    return (
      data.map((item) => {
        if (item.type === 'list') {
          return (
            <Col
              fullwidth
              key={item.header}
              className={styles['display-list']}
{'fraction_non_alphanumeric': 0.1371308016877637, 'fraction_numerical': 0.0026371308016877636, 'mean_word_length': 1.4659731252709145, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 10, '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': '4260200', 'n_tokens_mistral': 1632, 'n_tokens_neox': 1552, 'n_words': 336}