Sincronizar automaticamente os preços dos pacotes quando houver alterações nos preços das variantes

Quando utiliza a aplicação Shopify «Bundles» para criar pacotes de produtos, a alteração do preço de uma variante de um produto componente não atualiza automaticamente o preço da variante do pacote. O gatilho «Preço da variante do produto alterado» disponível em Workflow Trigger Extensions resolve esta situação, detetando a alteração de preço e recalculando e atualizando automaticamente o preço da variante do pacote.

---

Partiremos do seguinte cenário para compreender como podemos utilizar o gatilho «Alteração do preço da variante do produto» para manter os preços dos pacotes sincronizados.

Cenário: Atualização automática do preço do pacote quando o preço de uma variante de um componente se altera

Imagine que tem um produto em pacote (por exemplo, um pacote de t-shirts) criado com a aplicação Shopify da Bundles. O pacote contém três produtos componentes: t-shirt preta, t-shirt cinzenta e t-shirt branca, cada um com um preço de 10,00 € por variante. O preço da variante do pacote é de 30,00 € (a soma dos preços de todos os produtos que o compõem). Quando alterar o preço da variante de um produto que compõe o pacote, este Shopify Flow atualizará automaticamente o preço da variante correspondente do pacote.

Ative este gatilho nas definições da aplicação -> Variantes do produto -> Alterações de preço das variantes

Alteração do preço de uma variante do produto

Obtenha o produto principal do pacote, calcule os preços atualizados das variantes e atualize em massa os preços das variantes do pacote através da API de administração

Guia em vídeo

Também pode ver os passos visualmente neste vídeo (o vídeo não tem áudio; pode ajustar a velocidade do vídeo de acordo com as suas necessidades)

Como iremos organizar Shopify Flow para este processo

Compreender a configuração

• Temos um produto composto (por exemplo, uma t-shirt cinzenta) com as variantes S, M, L, XL e 2XL, cada uma com o preço de 10,00 €.
• Temos um produto em pacote criado com a aplicação «Shopify Bundles». Contém 3 produtos incluídos no pacote (camisola preta, camisola cinzenta, camisola branca), cada um com 5 variantes. O preço da variante do pacote é de 30,00 € (soma dos preços dos componentes: 3 × 10,00 €).

Pode ver aqui, de forma visual, os passos seguidos:

• Em «Workflow Trigger Extensions», abra a secção «Gatilhos», procure por «Price» e ative a opção «Variante do produto Price Changed». Esta opção requer acesso aos dados de «Product», «Variante do produto» e «Coleção»; a aplicação solicitará essa autorização caso não esteja definida.
• Crie um novo fluxo de trabalho em branco a partir da aplicação Shopify Flow e selecione o gatilho «Product Variant Price Changed» da aplicação «Workflow Trigger Extensions»
• Adicione uma ação «Obter dados do produto» para recuperar o produto alterado através de uma consulta avançada, ordenada por «data de criação» em ordem ascendente. Este passo obtém as informações do pacote pai do produto através do campo productParents. A consulta é a seguinte: id:{{productVariant.product.id | split: "gid://shopify/Product/" | last}}
• Adicione um passo de código «Executar» para extrair o ID do produto principal do pacote a partir do resultado de getProductData. O código extrai os IDs dos produtos principais de productParents e cria uma cadeia de caracteres idsCondition para a consulta.

O passo «Executar código» utiliza a seguinte entrada GraphQL, código JavaScript e resultados para obter os IDs dos produtos principais:

Executar o passo «Executar código» que apresenta a entrada GraphQL, o código JavaScript e a pré-visualização da saída

{
  getProductData {
    productParents {
      id
    }
  }
}

export default function main(input) {
  const productIds = input.getProductData[0]?.productParents?.map(p => p.id) ?? [];
  const productId = productIds[0] ?? null;

  const idsCondition = productIds
    .map(gid => "id:" + gid.split("gid://shopify/Product/").pop())
    .join(" OR ");

  return {
    productId: productId,
    productIds: productIds,
    idsCondition: idsCondition,
  };
}

type Output {
  productId: String
  productIds: [String!]!
  idsCondition: String!
}

• Adicione um passo «Condição» que verifique se a saída do código de execução productId não está vazia e se existe. Isto garante que só prosseguimos quando o produto alterado faz efetivamente parte de um pacote.
• Verdadeiro → continuar a atualizar o preço do pacote
• Falso → parar (o produto não faz parte de um pacote)
• Se a condição for «True», adicione outra ação «Obter dados do produto (1)» para recuperar os dados relativos às variantes e aos preços do produto do pacote principal, utilizando o idsCondition da etapa «Executar código».
• Adicione um segundo passo «Executar código (1)» para calcular os novos preços das variantes de pacotes com base nos preços atualizados dos componentes. Este passo gera uma matriz variantPrices com os novos preços para cada variante de pacote.

Esta etapa do código «Run» (1) consiste no recálculo dos preços das variantes do pacote com base no preço atualizado do componente. Eis o que faz: em primeiro lugar, obtém duas informações essenciais a partir do gatilho:

• changedVariantId uma variante que acabou de ser alterada (...158920)
• newPrice o novo preço dessa variante (11.00). Em seguida, percorre todas as variantes do pacote e recalcula o respetivo preço total. Cada variante do pacote tem 3 variantes de componentes (T-shirt preta, T-shirt cinzenta, T-shirt branca). Para cada componente, verifica-se: será esta a variante que acabou de ser alterada? Se sim, utilize newPrice (11,00) em vez do preço desatualizado ainda armazenado em Shopify (10,00). Se não, utilize o existente component.productVariant.price.It soma os preços dos componentes para obter o novo preço da variante do pacote. Pode ver como isto funciona nos seus dados de saída. Observe uma variante ...088840: os seus componentes incluem ...158920 (a variante alterada). Assim, o seu preço é 11 + 10 + 10 = 31, enquanto todas as outras variantes do pacote continuam a totalizar 30, uma vez que nenhum dos seus componentes sofreu alterações.Esta é a ideia-chave desta etapa: Shopify ainda não atualizou o preço do componente nos dados do pacote, pelo que o código não pode limitar-se a somar os preços existentes, tendo de substituir o novo preço da variante alterada em tempo real. Sem isto, todas as variantes continuariam a apresentar o valor 30. A matriz de saída variantPrices é então enviada para o ciclo «For each», que chama productVariantsBulkUpdate para, efetivamente, reescrever estes preços recalculados no produto do pacote.

{
  productVariant {
    id
  }
  priceChange {
    oldPrice { amount }
    newPrice { amount }
  }
  getProductData1 {
    id
    variants {
      id
      productVariantComponents {
        productVariant {
          id
          price
        }
      }
    }
  }
}

export default function main(input) {
  const changedVariantId = input.productVariant.id;
  const newPrice = parseFloat(input.priceChange.newPrice.amount);

  const variantPrices = input.getProductData1.flatMap(product =>
    product.variants.map(variant => ({
      productId: product.id,
      id: variant.id,
      price: variant.productVariantComponents.reduce((sum, component) => {
        const p = component.productVariant.id === changedVariantId
          ? newPrice
          : parseFloat(component.productVariant.price);
        return sum + p;
      }, 0)
    }))
  );

  return { variantPrices };
}

type VariantPrice {
  productId: String!
  id: String!
  price: Float!
}
type Output {
  variantPrices: [VariantPrice!]!
}

• Adicione um ciclo «For each» (iteração) que percorra cada item da listrunCode1.variantPrices. Para cada preço de variante, executa a ação de pedido à API «Send Admin» utilizando a mutação «productVariantsBulkUpdate» para atualizar o preço da variante do pacote. Pode utilizar esta entrada para a Mutação:

{
  "variants": [
    {
      "id": "{{variantPricesForeachitem.id}}",
      "price": "{{variantPricesForeachitem.price}}"
    }
  ],
  "productId": "{{variantPricesForeachitem.productId}}",
  "allowPartialUpdates": true
}

Como tudo isto funciona em conjunto

Quando o preço de uma variante do produto é alterado (por exemplo, se atualizar a variante «Camisola Cinzenta S» de 10,00 € para 15,00 €):

1. O gatilho «Alteração do preço da variante do produto» é acionado
2. O Shopify Flow obtém o pacote pai do produto utilizando productParents
3. A etapa «Executar código» extrai o ID do produto em pacote
4. Esta condição verifica se este produto faz parte de um pacote
5. Se sim, obtém os dados do produto do pacote
6. Uma segunda etapa de execução do código recalcula os preços das variantes dos pacotes
7. O ciclo percorre cada variante e atualiza o preço do pacote através da mutação «productVariantsBulkUpdate» da API de administração

O preço da variante «S» do pacote passaria agora de 30,00 € para 35,00 € (15,00 € + 10,00 € + 10,00 €).