spree_google_products 1.0

data/app/services/spree/google_shopping/status_service.rb

@@ -0,0 +1,150 @@
+require 'google/apis/content_v2_1'
+
+module Spree
+  module GoogleShopping
+    class StatusService
+      def initialize(credential)
+        @credential = credential
+        @merchant_id = credential.merchant_center_id
+        @service = Google::Apis::ContentV2_1::ShoppingContentService.new
+        @service.authorization = Spree::GoogleTokenService.new(credential).token
+      end
+
+      def fetch_counts
+        stats = Rails.cache.fetch("google_shopping_stats_#{@merchant_id}", expires_in: 15.minutes) do
+          Rails.cache.write("google_shopping_last_updated_#{@merchant_id}", Time.current)
+          calculate_fresh_counts
+        end
+        
+        last_updated = Rails.cache.read("google_shopping_last_updated_#{@merchant_id}")
+        
+        stats.merge(last_updated: last_updated)
+      rescue => e
+        Rails.logger.error "GOOGLE STATS ERROR: #{e.message}"
+        { approved: 0, limited: 0, pending: 0, disapproved: 0, error: true, last_updated: nil }
+      end
+
+      def sync_statuses_to_db
+        page_token = nil
+        puts "🔄 Starting Google Status Sync (Variant Level)..."
+        affected_product_ids = Set.new
+        loop do
+          begin
+            response = @service.list_productstatuses(@merchant_id, page_token: page_token)
+          rescue => e
+            puts "❌ API Error: #{e.message}"
+            break
+          end
+          
+          if response.resources
+            response.resources.each do |resource|
+              # 1. Extract SKU
+              sku = resource.product_id.split(':').last
+              
+              # 2. Get Status
+              dest = resource.destination_statuses&.find { |s| s.destination == 'Shopping' } || resource.destination_statuses&.first
+              next unless dest
+              
+              status = dest.status 
+
+              # 3. Find Variant
+              variant = Spree::Variant.find_by(sku: sku)
+              next unless variant
+
+              # Mark Parent Product for update later
+              affected_product_ids.add(variant.product_id)
+
+              # 4. Update Variant Attribute Table
+              v_attr = variant.google_variant_attribute || variant.build_google_variant_attribute
+              
+              # Capture Issues
+              if resource.item_level_issues.present?
+                issues_list = resource.item_level_issues.map do |issue|
+                  {
+                    code: issue.code,
+                    description: issue.description,
+                    detail: issue.detail,
+                    resolution: issue.resolution,
+                    servability: issue.servability
+                  }
+                end
+                v_attr.google_issues = issues_list
+              else
+                v_attr.google_issues = [] 
+              end
+
+              v_attr.google_status = status
+              v_attr.save
+              print "."
+            end
+          end
+
+          page_token = response.next_page_token
+          break if page_token.nil?
+        end
+        
+        puts "\n🔄 Updating Parent Product Aggregates..."
+        update_parent_products(affected_product_ids)
+        
+        puts "✅ Sync Complete!"
+      end
+
+      private
+
+      def update_parent_products(product_ids)
+        Spree::Product.where(id: product_ids).find_each do |product|
+          all_variants = [product.master] + product.variants
+          statuses = all_variants.map { |v| v.google_variant_attribute&.google_status }.compact
+
+          aggregate_status = if statuses.include?('disapproved')
+                               'disapproved'
+                             elsif statuses.include?('pending')
+                               'pending'
+                             elsif statuses.include?('approved')
+                               'approved'
+                             else
+                               'not_synced'
+                             end
+          
+          g_attr = product.google_product_attribute || product.build_google_product_attribute
+          g_attr.google_status = aggregate_status
+          g_attr.save
+        end
+      end
+
+      def calculate_fresh_counts
+        stats = { approved: 0, limited: 0, disapproved: 0, pending: 0 }
+        
+        page_token = nil
+        loop do
+          response = @service.list_productstatuses(@merchant_id, page_token: page_token)
+          
+          if response.resources
+            response.resources.each do |resource|
+              dest = resource.destination_statuses&.find { |s| s.destination == 'Shopping' } || resource.destination_statuses&.first
+              next unless dest
+
+              case dest.status
+              when 'disapproved'
+                stats[:disapproved] += 1
+              when 'pending'
+                stats[:pending] += 1
+              when 'approved'
+                if resource.item_level_issues.present?
+                  stats[:limited] += 1
+                else
+                  stats[:approved] += 1
+                end
+              end
+            end
+          end
+
+          page_token = response.next_page_token
+          break if page_token.nil?
+        end
+
+        stats
+      end
+    end
+  end
+end

data/app/services/spree/google_token_service.rb

@@ -0,0 +1,59 @@
+require 'signet/oauth_2/client'
+
+module Spree
+  class GoogleTokenService
+    class TokenError < StandardError; end
+
+    def initialize(credential)
+      @credential = credential
+    end
+
+    def token
+      raise TokenError, "No Google Credential found" unless @credential
+      raise TokenError, "Google Account disconnected (missing refresh token)" unless @credential.active?
+      if @credential.expired? || (@credential.token_expires_at < 1.minute.from_now)
+        refresh!
+      end
+
+      @credential.access_token
+    end
+
+    private
+
+    def refresh!
+      Rails.logger.info "GOOGLE OAUTH: Access Token expired. Refreshing..."
+
+      client = Signet::OAuth2::Client.new(
+        token_credential_uri: 'https://oauth2.googleapis.com/token',
+        client_id: ENV['GOOGLE_CLIENT_ID'],
+        client_secret: ENV['GOOGLE_CLIENT_SECRET'],
+        refresh_token: @credential.refresh_token
+      )
+
+      begin
+        new_token_data = client.fetch_access_token!
+        expires_in = new_token_data['expires_in'].to_i
+        expires_in = 3600 if expires_in <= 0
+        
+        update_attributes = {
+          access_token: new_token_data['access_token'],
+          token_expires_at: Time.current + expires_in.seconds
+        }
+
+        if new_token_data['refresh_token'].present?
+          update_attributes[:refresh_token] = new_token_data['refresh_token']
+        end
+
+        @credential.update!(update_attributes)
+        
+        Rails.logger.info "GOOGLE OAUTH: Token refreshed successfully."
+      rescue Signet::AuthorizationError => e
+        Rails.logger.error "GOOGLE OAUTH: Refresh failed. User likely revoked access. Error: #{e.message}"
+        raise TokenError, "Could not refresh token. Please reconnect Google Account."
+      rescue => e
+        Rails.logger.error "GOOGLE OAUTH: Generic Error during refresh: #{e.message}"
+        raise e
+      end
+    end
+  end
+end

data/app/views/spree/admin/google_merchant_settings/edit.html.erb

@@ -0,0 +1,331 @@
+<% content_for :page_title do %>
+  <div style="display:flex; align-items:center; gap:10px;">
+    <%= image_tag 'app_icons/google_merchant_logo.svg', width: 35, height: 35, alt: 'Google Merchant Logo' %>
+    <span><%= Spree.t(:google_merchant_settings) %></span>
+  </div>
+<% end %>
+
+<% if ENV['GOOGLE_CLIENT_ID'].blank? || ENV['GOOGLE_CLIENT_SECRET'].blank? %>
+
+  <div class="card border mb-4 shadow-sm">
+    <div class="card-header bg-light text-grey">
+      <h5 class="card-title mb-0">
+        <span class="icon icon-alert-triangle mr-2"></span>
+        Setup: Google API Credentials
+      </h5>
+    </div>
+    <div class="card-body">
+    <div class="text-center pt-3 pb-3"><%= image_tag 'app_icons/welcome_scene.svg', width: 316, height: 112, alt: 'Google Merchant Logo', class: 'mx-auto d-block' %></div>
+
+    <p class="lead mb-3 mt-3 text-center">Connect Spree to Google Merchant Center</p>  
+    <p class="alert alert-info">To connect Spree to Google Merchant, you first need to create an OAuth Client in the Google Cloud Console.</p>
+      
+      <ol class="pl-4 mt-3">
+        <li class="mb-3">
+          <strong>Create Credentials:</strong><br>
+          <div class="card card-info mt-4 p-3"> <p class="card-text"> Go to <a href="https://console.cloud.google.com/apis/credentials" target="_blank" style="color: #236485;font-weight:bold;text-decoration:none;"> Google Cloud Console &gt; APIs &amp; Services &gt; Credentials </a></p></div>
+        </li>
+        <li class="mb-3">
+          <strong>Create OAuth Client ID:</strong><br>
+          <div class="card card-info mt-4 p-3" style="font-weight:500">Create Credentials → OAuth client ID → "Web application"</div>
+        </li>
+        <li class="mb-3">
+          <strong>Configure Redirect URI:</strong>
+          <p class="mt-2 mb-3">Add exactly this URL:</p>
+          <code class="p-2 bg-light d-block mt-1 rounded border text-break">
+            <%= spree.callback_admin_google_merchant_settings_url %>
+          </code>
+        </li>
+        <li class="mb-3"><strong>Save to .env file:</strong><div style="position:relative; display:inline-block; width:100%;"><pre id="envCode" style="background: #fafafa;color: #333333;padding:12px;border: 1px solid rgba(227, 227, 227, .85) !important;border-radius:12px;margin-top:8px;font-family:monospace;">
+GOOGLE_CLIENT_ID=your_client_id
+GOOGLE_CLIENT_SECRET=your_client_secret
+         </pre><button id="copyBtn" class="btn btn-secondary" onclick="navigator.clipboard.writeText(document.getElementById('envCode').innerText.trim()); this.innerText='Copied';" style="position:absolute; top:30px; right:10px; padding:6px 12px; cursor:pointer; font-size:12px;">Copy</button></div>
+        </li>
+      </ol>
+      <%= button_tag "I have added the keys, Refresh Page", type: 'button', onclick: 'window.location.reload();', class: "float-right btn btn-primary" %>
+    </div>
+  </div>
+
+<% else %>
+
+  <div class="card mb-4 shadow-sm">
+    <div class="card-header border-bottom">
+      <h5 class="card-title mb-0">1. Google Account Connection</h5>
+    </div>
+    <div class="card-body p-4">
+      <% if @credential.active? %>
+        <div class="d-flex flex-column flex-md-row justify-content-between align-items-center">
+          <div class="d-flex align-items-center mb-3 mb-md-0">
+            <div class="mr-3 p-3 bg-white border rounded rounded-circle shadow-sm">
+               <%# Google G Icon %>
+               <svg width="32" height="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" fill="#4285F4"/><path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853"/><path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05"/><path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335"/></svg>
+            </div>
+            <div>
+              <h5 class="mb-1 text-dark font-weight-bold">Connected to Google</h5>
+              <p class="mb-0 text-muted">
+                Using: <strong><%= @credential.email.presence || 'Google Account' %></strong>
+              </p>
+            </div>
+          </div>
+
+          <div class="text-center text-md-right">
+            <div class="mb-2">
+              <span class="badge badge-success px-3 py-2">
+                <span class="icon icon-check mr-1"></span> Token Active
+              </span>
+            </div>
+            <small class="text-muted d-block mb-2"> Expires: <%= local_time(@credential.token_expires_at) %></small>
+            <%= button_to disconnect_admin_google_merchant_settings_path, 
+                method: :delete, 
+                data: { confirm: "Are you sure? This will stop syncing products." }, 
+                class: "btn btn-primary btn-sm",
+                form: { style: "display:inline-block;" } do %>
+              <span class="icon icon-logout mr-1"></span> Disconnect
+            <% end %>
+          </div>
+        </div>
+
+      <% else %>
+        
+        <div class="d-flex flex-column flex-md-row justify-content-between align-items-center">
+          <div class="d-flex align-items-center mb-3 mb-md-0">
+             <div class="mr-3 p-3 bg-white border rounded rounded-circle shadow-sm">
+                <svg width="32" height="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" fill="#4285F4"/><path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853"/><path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05"/><path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335"/></svg>
+             </div>
+             <div>
+               <h5 class="mb-1 text-dark font-weight-bold">Connect Merchant Center</h5>
+               <p class="mb-0 text-muted small" style="max-width: 400px; line-height: 1.4;">
+                 Authorize access to sync products, inventory, and prices automatically.
+               </p>
+             </div>
+          </div>
+          <div class="text-center text-md-right">
+             <%= link_to spree.connect_admin_google_merchant_settings_path, class: "btn btn-primary btn-lg shadow-sm px-4", data: { turbo: false } do %>
+               <span class="icon icon-brand-google mr-2"></span> Connect Account
+             <% end %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  </div>
+
+  <%= form_with model: [:admin, @credential], url: spree.admin_google_merchant_settings_path, method: :put do |f| %>
+
+    <div class="row">
+      <div class="col-12 col-lg-6">
+        <div class="card mb-4 shadow-sm <%= 'opacity-50' unless @credential.active? %>">
+          <div class="card-header border-bottom">
+            <h5 class="card-title mb-0">2. Feed Configuration</h5>
+          </div>
+          <div class="card-body">
+            <% unless @credential.active? %>
+               <div class="overlay-lock text-center p-4">
+                 <span class="icon icon-lock mb-2"></span><br>
+                 Please connect your account to edit settings.
+               </div>
+            <% end %>
+
+            <div class="form-group">
+              <%= f.label :merchant_center_id, "Merchant Center ID", class: "font-weight-bold" %>
+              <%= f.text_field :merchant_center_id, class: 'form-control', disabled: !@credential.active?, placeholder: 'e.g. 123456789' %>
+              <small class="form-text text-muted">Found in the top-right corner of your Google Merchant Center dashboard.</small>
+            </div>
+            
+            <div class="form-group mt-3">
+              <%= f.label :target_country, "Target Country", class: "font-weight-bold" %>
+              <%= f.select :target_country, 
+                  options_for_select(google_supported_countries_options, @credential.target_country), 
+                  { include_blank: 'Select Country' }, 
+                  { class: 'form-control select2', disabled: !@credential.active? } %>
+            </div>
+
+            <div class="form-group">
+              <%= f.label :target_currency, "Target Currency", class: "font-weight-bold" %>
+              <%= f.select :target_currency, 
+                  options_for_select(google_supported_currencies_options, @credential.target_currency), 
+                  { include_blank: 'Select Currency' }, 
+                  { class: 'form-control select2', disabled: !@credential.active? } %>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div class="col-12 col-lg-6">
+        <div class="card mb-4 shadow-sm <%= 'opacity-50' unless @credential.active? %>">
+          <div class="card-header border-bottom">
+            <h5 class="card-title mb-0">3. Global Defaults</h5>
+          </div>
+          <div class="card-body">
+            
+            <label class="font-weight-bold">Shipping Handling Time</label>
+            <div class="row">
+              <div class="col-6">
+                <div class="form-group">
+                  <%= f.label :default_min_handling_time, "Global Min (Days)", class: "small text-muted text-uppercase font-weight-bold" %>
+                  <%= f.number_field :default_min_handling_time, class: 'form-control', placeholder: 'e.g. 1', disabled: !@credential.active? %>
+                </div>
+              </div>
+              <div class="col-6">
+                <div class="form-group">
+                  <%= f.label :default_max_handling_time, "Global Max (Days)", class: "small text-muted text-uppercase font-weight-bold" %>
+                  <%= f.number_field :default_max_handling_time, class: 'form-control', placeholder: 'e.g. 3', disabled: !@credential.active? %>
+                </div>
+              </div>
+            </div>
+            <small class="text-muted d-block mb-3">These values are used if a product does not have specific handling times set.</small>
+
+            <hr>
+            
+            <div class="form-group">
+              <%= f.label :default_product_type, "Default Product Type (Internal)", class: "font-weight-bold" %>
+              <%= f.text_field :default_product_type, class: 'form-control', placeholder: 'e.g. Electronics', disabled: !@credential.active? %>
+              <small class="form-text text-muted">
+                Your internal categorization for reporting purposes.
+              </small>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="card mb-4 shadow-sm <%= 'opacity-50' unless @credential.active? %>">
+      <div class="card-header border-bottom">
+        <h5 class="card-title mb-0">4. Global Google Product Category</h5>
+      </div>
+      <div class="card-body">
+        
+        <div class="form-group" id="google-category-container">
+          <%= f.hidden_field :default_google_product_category, id: 'final_google_id' %>
+
+          <% 
+            saved_id = @credential.default_google_product_category
+            display_text = ""
+            if saved_id.present?
+              taxon = Spree::GoogleTaxon.find_by(google_id: saved_id)
+              display_text = taxon ? taxon.name : "ID: #{saved_id}" 
+            end
+          %>
+          <div id="current-selection-display" class="border rounded bg-white p-3 shadow-sm <%= saved_id.present? ? '' : 'd-none' %>">
+            <div class="d-flex align-items-center justify-content-between">
+              <div class="d-flex align-items-center overflow-hidden mr-3">
+                <div class="flex-shrink-0 text-success mr-3 d-flex align-items-center justify-content-center bg-light rounded-circle" style="width: 40px; height: 40px;">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round">
+                    <polyline points="20 6 9 17 4 12"></polyline>
+                  </svg>
+                </div>
+                <div class="overflow-hidden">
+                  <div class="text-uppercase text-muted font-weight-bold mb-0" style="font-size: 0.65rem; letter-spacing: 0.8px;">
+                    Selected Default Category
+                  </div>
+                  <div class="text-dark font-weight-bold text-truncate" title="<%= display_text %>">
+                    <span id="display_text"><%= display_text %></span>
+                  </div>
+                </div>
+              </div>
+
+              <div class="flex-shrink-0">
+                <button type="button" class="btn btn-sm btn-outline-primary font-weight-bold px-3" onclick="resetDrillDown()" <%= 'disabled' unless @credential.active? %>>
+                  Change
+                </button>
+              </div>
+            </div>
+          </div>
+
+          <div id="drill-down-area" class="<%= saved_id.present? ? 'd-none' : '' %>">
+             <% unless saved_id.present? %>
+               <div class="alert alert-info mb-3">
+                 <span class="icon icon-info-circle mr-2"></span>
+                 Select a default category. This will be automatically used for any product that doesn't have a specific category assigned.
+               </div>
+             <% end %>
+            <select class="form-control form-control-lg mb-2" id="root-level-select" onchange="fetchSubCategories(this, 0)" <%= 'disabled' unless @credential.active? %>>
+              <option value=""> Select Category </option>
+            </select>
+          </div>
+        </div>
+
+      </div>
+    </div>
+
+    <div class="form-actions text-center" data-hook="buttons">
+      <%= button Spree.t('actions.save'), 'save', 'submit', { class: 'btn-primary btn-md px-5 shadow', disabled: !@credential.active? } %>
+    </div>
+  <% end %>
+
+  <script>
+    const API_URL = "<%= drill_down_admin_google_shopping_taxons_path %>";
+    
+    document.addEventListener("DOMContentLoaded", function() {
+      const rootSelect = document.getElementById('root-level-select');
+      if(rootSelect) {
+        loadLevel('', rootSelect);
+      }
+    });
+
+    function loadLevel(parentPath, selectElement) {
+      fetch(`${API_URL}?parent_path=${encodeURIComponent(parentPath)}`)
+        .then(response => response.json())
+        .then(data => {
+          data.categories.forEach(cat => {
+            let option = document.createElement("option");
+            option.value = cat;
+            option.text = cat;
+            selectElement.add(option);
+          });
+        });
+    }
+
+    function fetchSubCategories(selectInfo, level) {
+      const selectedValue = selectInfo.value;
+      const container = document.getElementById('drill-down-area');
+      const hiddenInput = document.getElementById('final_google_id');
+      const displayArea = document.getElementById('current-selection-display');
+      const displayText = document.getElementById('display_text');
+
+      let allSelects = container.querySelectorAll('select');
+      for (let i = level + 1; i < allSelects.length; i++) { allSelects[i].remove(); }
+
+      if (!selectedValue) { hiddenInput.value = ""; return; }
+
+      let pathParts = [];
+      for (let i = 0; i <= level; i++) { pathParts.push(allSelects[i].value); }
+      let fullPath = pathParts.join(' > ');
+
+      fetch(`${API_URL}?parent_path=${encodeURIComponent(fullPath)}`)
+        .then(response => response.json())
+        .then(data => {
+          if (data.current_id) {
+            hiddenInput.value = data.current_id;
+            displayText.textContent = fullPath; 
+          } else { 
+             hiddenInput.value = ""; 
+          }
+
+          if (!data.is_leaf && data.categories.length > 0) {
+            let newSelect = document.createElement("select");
+            newSelect.className = "form-control form-control-lg mb-2";
+            newSelect.setAttribute("onchange", `fetchSubCategories(this, ${level + 1})`);
+            let defaultOption = document.createElement("option");
+            defaultOption.text = ` Select Sub-Category `; defaultOption.value = "";
+            newSelect.add(defaultOption);
+            data.categories.forEach(cat => {
+              let option = document.createElement("option"); option.value = cat; option.text = cat; newSelect.add(option);
+            });
+            container.appendChild(newSelect);
+          } else if (data.is_leaf && data.current_id) {
+             container.classList.add('d-none');
+             displayArea.classList.remove('d-none');
+          }
+        });
+    }
+
+    function resetDrillDown() {
+      document.getElementById('final_google_id').value = "";
+      document.getElementById('current-selection-display').classList.add('d-none');
+      const container = document.getElementById('drill-down-area');
+      container.classList.remove('d-none');
+      container.innerHTML = '<select class="form-control form-control-lg mb-2" id="root-level-select" onchange="fetchSubCategories(this, 0)"><option value=""> Select Main Category </option></select>';
+      loadLevel('', document.getElementById('root-level-select'));
+    }
+  </script>
+<% end %>

data/app/views/spree/admin/google_shopping/dashboard/index.html.erb

@@ -0,0 +1,121 @@
+<% content_for :page_title do %>
+  <div style="display:flex; align-items:center; gap:10px;">
+    <%= image_tag 'app_icons/google_merchant_logo.svg', width: 35, height: 35, alt: 'Google Merchant Logo' %>
+    <span><%= Spree.t(:google_merchant) %></span>
+  </div>
+<% end %>
+
+<% content_for :page_actions do %>
+  <%= button_to admin_google_shopping_sync_path, method: :post, class: 'btn btn-primary', disabled: !@credential&.active? do %>
+    <%= icon('refresh', class: 'mr-1') %> Sync Now
+  <% end %>
+<% end %>
+<div class="card mb-4">
+  <div class="card-header d-flex justify-content-between align-items-center">
+    <h5 class="card-title mb-0">Product Status (Google Shopping)</h5>
+    
+    <% last_updated = @stats[:last_updated] %>
+    <small class="text-muted">
+      <% if last_updated && @credential&.active? %>
+        Live Data (Updated <%= time_ago_in_words(last_updated) %> ago)
+      <% else %>
+        Waiting for sync...
+      <% end %>
+    </small>
+  </div>
+  
+  <div class="card-body">
+    <% if @credential&.active? %>
+      <div class="row text-center">
+        <div class="col-6 col-md-3 border-right">
+          <h2 class="text-success display-4 mb-0"><%= @stats[:approved] || 0 %></h2>
+          <span class="badge badge-success mb-2">Approved</span>
+          <p class="small text-muted mb-0">Live & Ready to Serve</p>
+        </div>
+        <div class="col-6 col-md-3 border-right">
+          <h2 class="text-warning display-4 mb-0"><%= @stats[:limited] || 0 %></h2>
+          <span class="badge badge-warning text mb-2">Limited</span>
+          <p class="small text-muted mb-0">Approved (Partial Visibility)</p>
+          <% if (@stats[:limited] || 0) > 0 %>
+            <%= link_to admin_google_shopping_issues_path, class: "btn btn-link btn-sm p-0 mt-1" do %>
+              View Issues <%= icon('chevron-right', style: 'font-size: 0.7rem;') %>
+            <% end %>
+          <% end %>
+        </div>
+        <div class="col-6 col-md-3 border-right">
+          <h2 class="text-danger display-4 mb-0"><%= @stats[:disapproved] || 0 %></h2>
+          <span class="badge badge-danger mb-2">Not Approved</span>
+          <p class="small text-muted mb-0">Critical Issues Detected</p>
+          <% if (@stats[:disapproved] || 0) > 0 %>
+            <%= link_to admin_google_shopping_issues_path, class: "btn btn-link btn-sm p-0 mt-1" do %>
+              View Fixes <%= icon('chevron-right', style: 'font-size: 0.7rem;') %>
+            <% end %>
+          <% end %>
+        </div>
+        <div class="col-6 col-md-3">
+          <h2 class="text-info display-4 mb-0"><%= @stats[:pending] || 0 %></h2>
+          <span class="badge badge-info mb-2">Pending</span>
+          <p class="small text-muted mb-0">Under Review by Google</p>
+        </div>
+
+      </div>
+    <% else %>
+      <div class="alert alert-warning mb-0">
+        <%= icon('alert-triangle', class: 'mr-2') %>
+        Please connect your Google Account in the <strong>Configuration</strong> tab to see live stats.
+      </div>
+    <% end %>
+  </div>
+</div>
+<div class="row">
+  <div class="col-12 col-lg-6">
+    <div class="card mb-3">
+      <div class="card-header">
+        <h5 class="card-title mb-0">Connection Details</h5>
+      </div>
+      <div class="card-body">
+        <dl class="row mb-0">
+          <dt class="col-sm-5">Merchant Center ID</dt>
+          <dd class="col-sm-7"><%= @credential&.merchant_center_id || 'Not Set' %></dd>
+
+          <dt class="col-sm-5">Target Country</dt>
+          <dd class="col-sm-7">
+             <% if @credential&.target_country.present? %>
+               <%= @credential.target_country %> (<%= @credential.target_currency %>)
+             <% else %>
+               <span class="text-muted">Default (US)</span>
+             <% end %>
+          </dd>
+          <dt class="col-sm-5">Last Synced</dt>
+          <dd class="col-sm-7">
+            <%= @last_sync ? time_ago_in_words(@last_sync) + " ago" : "Never" %>
+          </dd>
+        </dl>
+        <div class="mt-4">
+          <%= link_to "Configure", edit_admin_google_merchant_settings_path, class: 'btn btn-primary' %>
+          <a href="https://merchants.google.com/" target="_blank" class="btn btn-outline-primary ml-2">
+            Open Merchant Center <%= icon('external-link', class: 'ml-1') %>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="col-12 col-lg-6">
+    <div class="card mb-3">
+      <div class="card-header">
+        <h5 class="card-title mb-0">Sync Health</h5>
+      </div>
+      <div class="card-body">
+        <p class="text-muted">
+          Products are automatically synced in the background immediately after you Create or Update them in Spree.
+        </p>
+        <div class="alert alert-info">
+          <strong>Note:</strong> Google usually takes 3-5 business days to review newly synced products.
+        </div>
+        <p class="small text-muted mb-0">
+          Use the "Sync Now" button at the top right to force a full update for all products immediately.
+        </p>
+      </div>
+    </div>
+  </div>
+</div>