<commit_before>import React, { Component } from 'react';
import { render } from 'react-dom';
import PropTypes from 'prop-types';
import leaflet from 'leaflet';
import { isEqual, cloneDeep, get, compact } from 'lodash';
import { FormattedMessage } from 'react-intl';

import leafletUtfGrid from '../../vendor/leaflet.utfgrid';
import * as chart from '../../utilities/chart';
import Spinner from '../common/LoadingSpinner';
import { trackEvent } from '../../utilities/analytics';
import { RENDER_MAP_LAYER_TYPE } from '../../constants/analytics';
import RenderComplete from './RenderComplete';
import { ensureSpecLegend } from './LegendsSortable';

require('../../../node_modules/leaflet/dist/leaflet.css');
require('./MapVisualisation.scss');

const L = leafletUtfGrid(leaflet);
const META_SCALE = 0.5;

// We need to use leaflet private methods which have underscore dangle
/* eslint no-underscore-dangle: "off" */

const isImage = (value) => {
  // For now, treat every link as an image, until we have something like an "image-url" type
  if (typeof value === 'string' && value.match(/^https/) !== null) {
    return true;
  }
  return false;
};

const getBaseLayerAttributes = ((baseLayer) => {
  const attributes = {};

  switch (baseLayer) {
    case 'street':
      attributes.tileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
      attributes.tileAttribution = '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors';
      break;

    case 'satellite':
      attributes.tileUrl = 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}';
      attributes.tileAttribution = 'Esri, DigitalGlobe, GeoEye, Earthstar Geographics, CNES/Airbus DS, USDA, USGS, AeroGRID, IGN, and the GIS User Community';
      break;

    case 'terrain':
      attributes.tileUrl = 'https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png';
      attributes.tileAttribution = 'Map data: &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: &copy; <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)';
      break;

    default:
      throw new Error(`Unknown base layer type ${baseLayer}`);
  }

  return attributes;
});

// returns true if we need to set "word-break: break-all" on el to avoid x-overflow
const wrapLabel = (str) => {
  if (!str) {
    return false;
  }
  return Boolean(str.toString().split(' ').some(word => word.length > 18));
};

const LegendEntry = ({ singleMetadata, layer }) => {
  let pointColorMapping = singleMetadata.pointColorMapping;
  const specLegend = ensureSpecLegend(layer.legend);
  if (get(specLegend, 'order.mode') === 'custom' && (get(specLegend, 'order.list') || []).length > 0) {
    pointColorMapping = get(specLegend, 'order.list').map(x => pointColorMapping.find(z => z.value === x));
  }
  return (
    <div className="LegendEntry">
      {Boolean(get(singleMetadata, 'pointColorMapping')) &&
        <div className="container">
          <h4>{layer.title}</h4>
          <h5>{`${singleMetadata.pointColorMappingTitle}`}</h5>
          <div className="listContainer">
            <ul>
              {pointColorMapping.map(item =>
                <li
                  key={item.value}
                >
                  <div
                    className="colorMarker"
                    style={{
                      backgroundColor: item.color,
                    }}
                  />
                  <p className={`label ${wrapLabel(item.value) ? 'breakAll' : ''}`}>
                    {chart.replaceLabelIfValueEmpty(item.value)}
                  </p>
                </li>
                )}
            </ul>
          </div>
        </div>
      }
      {Boolean(get(singleMetadata, 'shapeColorMapping')) &&<commit_msg>[#2937] Filter out color mapping that do not exists<commit_after>import React, { Component } from 'react';
import { render } from 'react-dom';
import PropTypes from 'prop-types';
import leaflet from 'leaflet';
import { isEqual, cloneDeep, get, compact } from 'lodash';
import { FormattedMessage } from 'react-intl';

import leafletUtfGrid from '../../vendor/leaflet.utfgrid';
import * as chart from '../../utilities/chart';
import Spinner from '../common/LoadingSpinner';
import { trackEvent } from '../../utilities/analytics';
import { RENDER_MAP_LAYER_TYPE } from '../../constants/analytics';
import RenderComplete from './RenderComplete';
import { ensureSpecLegend } from './LegendsSortable';

require('../../../node_modules/leaflet/dist/leaflet.css');
require('./MapVisualisation.scss');

const L = leafletUtfGrid(leaflet);
const META_SCALE = 0.5;

// We need to use leaflet private methods which have underscore dangle
/* eslint no-underscore-dangle: "off" */

const isImage = (value) => {
  // For now, treat every link as an image, until we have something like an "image-url" type
  if (typeof value === 'string' && value.match(/^https/) !== null) {
    return true;
  }
  return false;
};

const getBaseLayerAttributes = ((baseLayer) => {
  const attributes = {};

  switch (baseLayer) {
    case 'street':
      attributes.tileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
      attributes.tileAttribution = '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors';
      break;

    case 'satellite':
      attributes.tileUrl = 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}';
      attributes.tileAttribution = 'Esri, DigitalGlobe, GeoEye, Earthstar Geographics, CNES/Airbus DS, USDA, USGS, AeroGRID, IGN, and the GIS User Community';
      break;

    case 'terrain':
      attributes.tileUrl = 'https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png';
      attributes.tileAttribution = 'Map data: &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: &copy; <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)';
      break;

    default:
      throw new Error(`Unknown base layer type ${baseLayer}`);
  }

  return attributes;
});

// returns true if we need to set "word-break: break-all" on el to avoid x-overflow
const wrapLabel = (str) => {
  if (!str) {
    return false;
  }
  return Boolean(str.toString().split(' ').some(word => word.length > 18));
};

const LegendEntry = ({ singleMetadata, layer }) => {
  let pointColorMapping = singleMetadata.pointColorMapping;
  const specLegend = ensureSpecLegend(layer.legend);
  if (get(specLegend, 'order.mode') === 'custom' && (get(specLegend, 'order.list') || []).length > 0) {
    pointColorMapping = get(specLegend, 'order.list').map(x => pointColorMapping.find(z => z.value === x))
        .filter(x => x != null);
  }
  return (
    <div className="LegendEntry">
      {Boolean(get(singleMetadata, 'pointColorMapping')) &&
        <div className="container">
          <h4>{layer.title}</h4>
          <h5>{`${singleMetadata.pointColorMappingTitle}`}</h5>
          <div className="listContainer">
            <ul>
              {pointColorMapping.map(item =>
                <li
                  key={item.value}
                >
                  <div
                    className="colorMarker"
                    style={{
                      backgroundColor: item.color,
                    }}
                  />
                  <p className={`label ${wrapLabel(item.value) ? 'breakAll' : ''}`}>
                    {chart.replaceLabelIfValueEmpty(item.value)}
                  </p>
                </li>
                )}
            </ul>
          </div>
        </div>
      }
      {Boolean(get(singleMetadata, 'shapeColorMapping')) &&
{'fraction_non_alphanumeric': 0.16398877837286407, 'fraction_numerical': 0.0033154807447079828, 'mean_word_length': 2.8091306459446335, 'pattern_counts': {'":': 0, '<': 55, '<?xml version=': 0, '>': 76, 'https://': 10, 'lorem ipsum': 0, 'www.': 2, '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': '7582851', 'n_tokens_mistral': 2456, 'n_tokens_neox': 2376, 'n_words': 529}