ref(boutique) injecte les états dans la page sous forme de JSON

web/app/themes/haiku-atelier-2024/archive-product.php

@@ -10,12 +10,18 @@ namespace HaikuAtelier;
 
 use HaikuAtelier\Data\Product;
 use HaikuAtelier\WP\Resource;
+use Roots\WPConfig\Config;
 use Timber\Timber;
 use WC_Product;
 
 use function add_action;
 use function array_map;
+use function assert;
+use function base64_encode;
+use function is_string;
 use function wc_get_products;
+use function wp_create_nonce;
+use function wp_json_encode;
 
 $context = Timber::context();
 $templates = ['boutique.twig'];
@@ -26,6 +32,17 @@ $wc_products = wc_get_products(['limit' => 12, 'order' => 'DESC', 'orderby' => '
 $products = array_map(callback: Product::from_wc_product(...), array: $wc_products);
 $context['products'] = $products;
 
+// Injecte les états initiaux des données du Produit sous forme de JSON dans le contexte.
+$page_states = [
+  'nonce' => wp_create_nonce('wc_store_api'),
+  'authString' => base64_encode(
+    Config::get('WOOCOMMERCE_API_CONSUMER_KEY') . ':' . Config::get('WOOCOMMERCE_API_CONSUMER_SECRET'),
+  ),
+]
+  |> wp_json_encode(...);
+assert(is_string($page_states));
+$context['page_states'] = $page_states;
+
 add_action('wp_enqueue_scripts', function (): void {
   Resource::enqueue_style_file(
     handle: 'haiku-atelier-2024-styles-page-boutique',

web/app/themes/haiku-atelier-2024/taxonomy-product_cat.php

@@ -11,15 +11,20 @@ namespace HaikuAtelier;
 use HaikuAtelier\Data\Product;
 use HaikuAtelier\WP\Resource;
 use Illuminate\Support\Arr;
+use Roots\WPConfig\Config;
 use Timber\Timber;
 use WC_Product;
 use WP_Term;
 
 use function add_action;
 use function assert;
+use function base64_encode;
 use function get_queried_object;
 use function is_array;
+use function is_string;
 use function wc_get_products;
+use function wp_create_nonce;
+use function wp_json_encode;
 
 $context = Timber::context();
 $templates = ['boutique.twig'];
@@ -48,6 +53,17 @@ $products = wc_get_products([
 $context['products'] = $products;
 $context['category_id'] = $current_term->term_id;
 
+// Injecte les états initiaux des données du Produit sous forme de JSON dans le contexte.
+$page_states = [
+  'nonce' => wp_create_nonce('wc_store_api'),
+  'authString' => base64_encode(
+    Config::get('WOOCOMMERCE_API_CONSUMER_KEY') . ':' . Config::get('WOOCOMMERCE_API_CONSUMER_SECRET'),
+  ),
+]
+  |> wp_json_encode(...);
+assert(is_string($page_states));
+$context['page_states'] = $page_states;
+
 add_action('wp_enqueue_scripts', function (): void {
   Resource::enqueue_style_file(
     handle: 'haiku-atelier-2024-styles-page-boutique',

web/app/themes/haiku-atelier-2024/views/boutique.twig

@@ -3,14 +3,12 @@
 {% block head %}
   {{ include('parts/en-tetes-backend.twig') }}
 
-  <script id="injection">
-  // dprint-ignore-file
-// Injection d'états pour les Scripts de la page.
-
-const _etats = {
-  authString: "{{ auth_string }}",
-  nonce: "{{ nonce_wc }}",
-};
+  <!-- markup-fmt-ignore -->
+  <script
+    id="page-states"
+    type="application/json"
+  >
+    {{ page_states }}
   </script>
 {% endblock head %}