<commit_before>SirTrevor.Blocks.Products = SirTrevor.Blocks.Abstract.extend({
  type: 'products',
  title: 'Products',
  blockHtml: _.template(
    `<div class="row">
      <div class="col-md-12"><h2>Products</h2></div>
      <div class="col-md-12">
        ${SpreeCmsForm.getInputTemplate('new_sku', 'New SKU')}
        <button class="js-blockProductsAddSku">Add</button>
      </div><div class="col-md-6">
        <% if (data.products && data.products.length) { %>
          <table class="table js-blockProductsTable">
            <thead>
              <tr>
                <th class="no-border"></th>
                  <th>SKU</th>
                  <th>Remove</th>
                <th class="actions"></th>
              </tr>
            </thead>
            <tbody>
              <% _.each(data.products, function(product, index) { %>
                <tr>
                  <td class="move-handle">
                    <span class="icon icon-sort handle"></span>
                  </td>
                  <td class="js-blockProductsSku"><%= product %></td>
                  <td><a class="js-blockProductsRemoveSku btn btn-danger btn-sm delete-resource icon-link with-tip action-delete no-text" href="#"><span class="icon icon-delete"></span></a>
                </tr>
              <% }); %>
            </tbody>
          </table>
        <% } %>
      </div>
      <input class="js-blockProductsInputProducts js-scms-value" type="hidden" name="products" value="<%- data.products ? data.products.join(',') : '' %>">
      <input class="js-state" type="hidden" name="state" value="<%- state || "" %>">
    </div>`
  ),

  getProductList: function() {
    var list = this.getProductListInput().val().split(',');
    return list.filter(function(item) {
      return item !== '' && item !== null;
    });
  },

  getProductListInput: function() {
    return this.$editor.find('.js-blockProductsInputProducts');
  },

  loadData: function(data) {
    data.products = data.products ? data.products.split(',') : [];
    var renderedHtml = this.blockHtml({
      data: data,
      state: 'edited',
      header: this.header
    });

    this.$editor.html(renderedHtml).show();
    this.$editor.find('.js-blockProductsAddSku').click(this.onSkuAdd.bind(this));
    this.$editor.find('.js-blockProductsRemoveSku').click(this.onSkuRemove.bind(this));
    this.tableSortable();
  },

  onSkuAdd: function(ev) {
    ev.preventDefault();
    var sku = this.getData().data.new_sku;
    if (!sku) {
      return false;
    }
    sku = sku.trim();

    var productList = this.getProductList();
    if (productList.indexOf(sku) == -1) {
      productList.push(sku);
      this.$editor.find('[name="new_sku"]').val('');
      this.getProductListInput().val(productList.join(','));
      this.reRenderProductList();
    }
  },

  onSkuRemove: function(ev) {
    ev.preventDefault();
    var sku = ev.currentTarget.parentNode.parentNode.querySelector('.js-blockProductsSku').innerHTML;
    var productList = this.getProductList().filter(function(item) {
      return item !== sku;
    });

    this.getProductListInput().val(productList.join(','));
    this.reRenderProductList();
  },

  reRenderProductList() {
    var data = this.getData().data;
    data.products = $('.js-blockProductsInputProducts').val();
    this.loadData(data);
  },

  tableSortable() {
    // Based on spree_backend-3.3.2/app/assets/javascripts/spree/backend/admin.js:325
    var fixHelper = function(e, ui) {
      ui.children().each(function() {
          $(this).width($(this).width());
      });<commit_msg>Read saved products from local editor<commit_after>SirTrevor.Blocks.Products = SirTrevor.Blocks.Abstract.extend({
  type: 'products',
  title: 'Products',
  blockHtml: _.template(
    `<div class="row">
      <div class="col-md-12"><h2>Products</h2></div>
      <div class="col-md-12">
        ${SpreeCmsForm.getInputTemplate('new_sku', 'New SKU')}
        <button class="js-blockProductsAddSku">Add</button>
      </div><div class="col-md-6">
        <% if (data.products && data.products.length) { %>
          <table class="table js-blockProductsTable">
            <thead>
              <tr>
                <th class="no-border"></th>
                  <th>SKU</th>
                  <th>Remove</th>
                <th class="actions"></th>
              </tr>
            </thead>
            <tbody>
              <% _.each(data.products, function(product, index) { %>
                <tr>
                  <td class="move-handle">
                    <span class="icon icon-sort handle"></span>
                  </td>
                  <td class="js-blockProductsSku"><%= product %></td>
                  <td><a class="js-blockProductsRemoveSku btn btn-danger btn-sm delete-resource icon-link with-tip action-delete no-text" href="#"><span class="icon icon-delete"></span></a>
                </tr>
              <% }); %>
            </tbody>
          </table>
        <% } %>
      </div>
      <input class="js-blockProductsInputProducts js-scms-value" type="hidden" name="products" value="<%- data.products ? data.products.join(',') : '' %>">
      <input class="js-state" type="hidden" name="state" value="<%- state || "" %>">
    </div>`
  ),

  getProductList: function() {
    var list = this.getProductListInput().val().split(',');
    return list.filter(function(item) {
      return item !== '' && item !== null;
    });
  },

  getProductListInput: function() {
    return this.$editor.find('.js-blockProductsInputProducts');
  },

  loadData: function(data) {
    data.products = data.products ? data.products.split(',') : [];
    var renderedHtml = this.blockHtml({
      data: data,
      state: 'edited',
      header: this.header
    });

    this.$editor.html(renderedHtml).show();
    this.$editor.find('.js-blockProductsAddSku').click(this.onSkuAdd.bind(this));
    this.$editor.find('.js-blockProductsRemoveSku').click(this.onSkuRemove.bind(this));
    this.tableSortable();
  },

  onSkuAdd: function(ev) {
    ev.preventDefault();
    var sku = this.getData().data.new_sku;
    if (!sku) {
      return false;
    }
    sku = sku.trim();

    var productList = this.getProductList();
    if (productList.indexOf(sku) == -1) {
      productList.push(sku);
      this.$editor.find('[name="new_sku"]').val('');
      this.getProductListInput().val(productList.join(','));
      this.reRenderProductList();
    }
  },

  onSkuRemove: function(ev) {
    ev.preventDefault();
    var sku = ev.currentTarget.parentNode.parentNode.querySelector('.js-blockProductsSku').innerHTML;
    var productList = this.getProductList().filter(function(item) {
      return item !== sku;
    });

    this.getProductListInput().val(productList.join(','));
    this.reRenderProductList();
  },

  reRenderProductList() {
    var data = this.getData().data;
    data.products = this.$editor.find('.js-blockProductsInputProducts').val();
    this.loadData(data);
  },

  tableSortable() {
    // Based on spree_backend-3.3.2/app/assets/javascripts/spree/backend/admin.js:325
    var fixHelper = function(e, ui) {
      ui.children().each(function() {
          $(this).width($(this).width());
      });
{'fraction_non_alphanumeric': 0.18141346688925988, 'fraction_numerical': 0.0038953811908736783, 'mean_word_length': 2.5, 'pattern_counts': {'":': 0, '<': 103, '<?xml version=': 0, '>': 103, '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': '5016287', 'n_tokens_mistral': 2322, 'n_tokens_neox': 2214, 'n_words': 347}