Merge pull request #11 from btcpayserver/ft/localization

include payment localization

Dockerfile

@@ -1,9 +1,9 @@
-FROM node:18-alpine3.20
+FROM node:20-alpine3.20
 
 # Install xdg-utils (BTCPay Server mod)
 RUN apk add --no-cache bash xdg-utils git
 # Install Shopify CLI globally (BTCPay Server mod)
-RUN npm install -g @shopify/cli@3.75.3
+RUN npm install -g @shopify/cli@3.92.1
 
 EXPOSE 3000
 

deploy.sh

@@ -4,10 +4,10 @@ COMMIT="$(git log -1 --format=%H)"
 pushd .
 TEMP_DIR=$(mktemp -d)
 echo "COMMIT=${COMMIT}"
+echo "VERSION=$(git describe --tags --abbrev=0)"
 cd "$TEMP_DIR"
 echo "Creating plugin in directory: ${TEMP_DIR}"
 cp -rf /app/* "${TEMP_DIR}"
-echo "VERSION=$(git describe --tags --abbrev=0)"
 
 cp shopify.app.toml.example shopify.app.toml
 sed -i "s|APP_NAME|${APP_NAME}|g" shopify.app.toml

extensions/btcpaycheckout/locales/cs.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Název obchodu",
+  "reviewAndPay": "Zkontrolujte a zaplaťte pomocí BTCpay Server!",
+  "reviewOrderMessage": "Prosím, zkontrolujte si objednávku a vyplňte platbu pomocí BTCpay Server.",
+  "complete_payment": "Kompletní platba",
+  "error": {
+    "fetch_invoice": "Chyba BTCpay Serveru. Nepodařilo se získat fakturu. {{error}}",
+    "general": "Chyba BTCpay Serveru. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/da.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Handelsnavn",
+  "reviewAndPay": "Gennemgå og betale ved hjælp af BTCPAy Server!",
+  "reviewOrderMessage": "Gennemgå din ordre og fuldføre betalingen ved hjælp af BTCPAy Server.",
+  "complete_payment": "Fuldstændig betaling",
+  "error": {
+    "fetch_invoice": "BTCPay Server Fejl. Kunne ikke hente faktura. {{error}}",
+    "general": "BTCPay Server Fejl. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/de.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Name des Shops",
+  "reviewAndPay": "Bewerten und bezahlen Sie mit dem BTCPay-Server!",
+  "reviewOrderMessage": "Bitte überprüfen Sie Ihre Bestellung und schließen Sie die Zahlung mit dem BTCPay-Server ab.",
+  "complete_payment": "Zahlung abschließen",
+  "error": {
+    "fetch_invoice": "BTCPay-Serverfehler. Rechnung konnte nicht abgerufen werden. {{error}}",
+    "general": "BTCPay-Serverfehler. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/en.default.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Shop name",
+  "reviewAndPay": "Review and pay using BTCPay Server!",
+  "reviewOrderMessage": "Please review your order and complete the payment using BTCPay Server.",
+  "complete_payment": "Complete Payment",
+  "error": {
+    "fetch_invoice": "BTCPay Server Error. Failed to fetch invoice. {{error}}",
+    "general": "BTCPay Server Error. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/es.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Nombre de la tienda",
+  "reviewAndPay": "¡Revisa y paga usando BTCPay Server!",
+  "reviewOrderMessage": "Por favor revisa tu pedido y completa el pago usando BTCPay Server.",
+  "complete_payment": "Completar Pago",
+  "error": {
+    "fetch_invoice": "Error del Servidor BTCPay. Error al obtener la factura. {{error}}",
+    "general": "Error del Servidor BTCPay. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/fi.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Kaupan nimi",
+  "reviewAndPay": "Tarkista ja maksa käyttäen BTCPay Server!",
+  "reviewOrderMessage": "Tarkista tilauksesi ja suorita maksu BTCPay-palvelimella.",
+  "complete_payment": "Täydellinen maksu",
+  "error": {
+    "fetch_invoice": "BTCPay-palvelinvirhe. Laskun nouto epäonnistui. {{error}}",
+    "general": "BTCPay-palvelinvirhe. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/fr.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Nom du magasin",
+  "reviewAndPay": "Vérifiez et payez en utilisant BTCPay Server !",
+  "reviewOrderMessage": "Veuillez vérifier votre commande et effectuer le paiement via le serveur BTCPay.",
+  "complete_payment": "Terminer le Paiement",
+  "error": {
+    "fetch_invoice": "Erreur du serveur BTCPay. Échec de la récupération de la facture. {{error}}",
+    "general": "Erreur du serveur BTCPay. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/hi.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "दुकान का नाम",
+  "reviewAndPay": "BTCPay सर्वर का उपयोग करके समीक्षा और भुगतान करें!",
+  "reviewOrderMessage": "कृपया अपने ऑर्डर की समीक्षा करें और BTCPay सर्वर का उपयोग करके भुगतान पूरा करें।.",
+  "complete_payment": "पूर्ण भुगतान",
+  "error": {
+    "fetch_invoice": "BTCPay सर्वर त्रुटि। चालान प्राप्त करने में विफल रहा।. {{error}}",
+    "general": "BTCPay सर्वर त्रुटि।. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/hu.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "A bolt neve",
+  "reviewAndPay": "Áttekintés és fizetés segítségével BTCPay Server!",
+  "reviewOrderMessage": "Kérjük, olvassa el megrendelését, és töltse ki a kifizetést a BTCPay Server használatával.",
+  "complete_payment": "Teljes kifizetés",
+  "error": {
+    "fetch_invoice": "BTCPay szerver hiba. Nem sikerült számlát beszerezni. {{error}}",
+    "general": "BTCPay szerver hiba. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/it.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Nome negozio",
+  "reviewAndPay": "Rivedere e pagare usando BTCPay Server!",
+  "reviewOrderMessage": "Per favore controlla il tuo ordine e completa il pagamento usando BTCPay Server.",
+  "complete_payment": "Completa Pagamento",
+  "error": {
+    "fetch_invoice": "Errore BTCPay Server. Impossibile recuperare la fattura. {{error}}",
+    "general": "Errore BTCPay Server. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/ja.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "店舗名",
+  "reviewAndPay": "BTCPay Server でのレビューと支払い!",
+  "reviewOrderMessage": "BTCPay Server を使用して注文を確認し、支払いを完了してください.",
+  "complete_payment": "完全な支払",
+  "error": {
+    "fetch_invoice": "BTCPay Server エラー。 請求書を受け取りませんでした. {{error}}",
+    "general": "BTCPay Server エラー. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/ko.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "가게 이름",
+  "reviewAndPay": "BTCPay Server를 사용하여 검토 및 지불!",
+  "reviewOrderMessage": "주문을 검토하고 BTCPay Server를 사용하여 지불을 완료하십시오.",
+  "complete_payment": "결제 완료",
+  "error": {
+    "fetch_invoice": "BTCPay 서버 오류. 청구서에 실패. {{error}}",
+    "general": "BTCPay 서버 오류. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/nb.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Butikknavn",
+  "reviewAndPay": "Se over og betal med BTCPay Server!",
+  "reviewOrderMessage": "Vennligst se over bestillingen din og fullfør betalingen med BTCPay Server.",
+  "complete_payment": "Fullfør betaling",
+  "error": {
+    "fetch_invoice": "BTCPay Server-feil. Klarte ikke hente faktura. {{error}}",
+    "general": "BTCPay Server-feil. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/nl.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Winkelnaam",
+  "reviewAndPay": "Bekijk en betaal met BTCPay Server!",
+  "reviewOrderMessage": "Bekijk uw bestelling en vul de betaling met BTCPay Server.",
+  "complete_payment": "Volledige betaling",
+  "error": {
+    "fetch_invoice": "BTCPay-serverfout Ophalen van factuur is mislukt. {{error}}",
+    "general": "BTCPay-serverfout. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/pl.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Nazwa sklepu",
+  "reviewAndPay": "Przegląd i zapłacić za pomocą serwera BTCPAy!",
+  "reviewOrderMessage": "Proszę przejrzeć zamówienie i dokonać płatności za pomocą serwera BTCPAy.",
+  "complete_payment": "Płatność pełna",
+  "error": {
+    "fetch_invoice": "Błąd serwera BTCPAy. Nie udało się pobrać faktury. {{error}}",
+    "general": "Błąd serwera BTCPAy. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/pt-BR.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Nome da loja",
+  "reviewAndPay": "Reveja e pague usando o BTCPay Server!",
+  "reviewOrderMessage": "Por favor, reveja seu pedido e complete o pagamento usando o BTCPay Server.",
+  "complete_payment": "Pagamento completo",
+  "error": {
+    "fetch_invoice": "Erro no servidor BTCPay. Não consegui pegar a fatura. {{error}}",
+    "general": "Erro no servidor BTCPay. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/pt.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Nome da loja",
+  "reviewAndPay": "Revise e pague usando BTCPay Server!",
+  "reviewOrderMessage": "Por favor revise seu pedido e complete o pagamento usando BTCPay Server.",
+  "complete_payment": "Completar Pagamento",
+  "error": {
+    "fetch_invoice": "Erro do BTCPay Server. Falha ao buscar fatura. {{error}}",
+    "general": "Erro do BTCPay Server. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/ru.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Название магазина",
+  "reviewAndPay": "Обзор и оплата с помощью BTCPay Server!",
+  "reviewOrderMessage": "Пожалуйста, просмотрите ваш заказ и заполните оплату с помощью BTCPay Server.",
+  "complete_payment": "Полный платеж",
+  "error": {
+    "fetch_invoice": "Ошибка BTCPay Server. Не удалось получить счет. {{error}}",
+    "general": "Ошибка BTCPay Server. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/sv.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Shop name",
+  "reviewAndPay": "Granska och betala med BTCPay Server!",
+  "reviewOrderMessage": "Vänligen granska din beställning och slutföra betalningen med hjälp av BTCPay Server.",
+  "complete_payment": "Fullständig betalning",
+  "error": {
+    "fetch_invoice": "BTCPay Server Fel. Misslyckades med att hämta faktura. {{error}}",
+    "general": "BTCPay Server Fel. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/th.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "ชื่อร้านค้า",
+  "reviewAndPay": "ทบทวนและจ่ายจากเซิร์ฟเวอร์บีทีซี!",
+  "reviewOrderMessage": "กรุณาทบทวนคําสั่งของคุณ และชําระเงินด้วยเซิร์ฟเวอร์บีทีซี.",
+  "complete_payment": "การชําระเงินที่สมบูรณ์",
+  "error": {
+    "fetch_invoice": "เซิร์ฟเวอร์ BTC มีข้อผิดพลาด ล้มเหลวในการเรียกใบแจ้งหนี้. {{error}}",
+    "general": "เซิร์ฟเวอร์ BTC มีข้อผิดพลาด. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/tr.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Dükkan adı",
+  "reviewAndPay": "BTCPay Server kullanarak yorum ve ödeme!",
+  "reviewOrderMessage": "Lütfen siparişinizi gözden geçirin ve BTCPay Server kullanarak ödeme tamamlayın.",
+  "complete_payment": "Tamam Ödeme",
+  "error": {
+    "fetch_invoice": "BTCPay Server Hatası. Fatura getirmek için başarısız oldu. {{error}}",
+    "general": "BTCPay Server Hatası. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/vi.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "Tên cửa hàng",
+  "reviewAndPay": "Xem lại và trả tiền bằng máy chủ trả tiền BTC!",
+  "reviewOrderMessage": "Vui lòng xem lại đơn đặt hàng và hoàn tất việc thanh toán bằng máy phục vụ trả tiền BTC.",
+  "complete_payment": "Trả tiền đầy đủ",
+  "error": {
+    "fetch_invoice": "Lỗi trình phục vụ trả tiền BTC. Không lấy được hóa đơn. {{error}}",
+    "general": "Lỗi trình phục vụ trả tiền BTC. {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/zh-CN.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "商店名称",
+  "reviewAndPay": "用 BTCPay 服务器审查并支付!",
+  "reviewOrderMessage": "请审查您的订单并使用 BTCPay 服务器完成支付 .",
+  "complete_payment": "全额付款",
+  "error": {
+    "fetch_invoice": "BTCPay 服务器出错 。 获取发票失败 . {{error}}",
+    "general": "BTCPay 服务器出错 . {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/zh-TW.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "店名",
+  "reviewAndPay": "使用 BTCPay 伺服器去審查并支付!",
+  "reviewOrderMessage": "請回復您的訂單并用 BTCPay 伺服器完成支付 .",
+  "complete_payment": "全部付款",
+  "error": {
+    "fetch_invoice": "BTCPay 伺服器出錯 。 取回收據失敗 . {{error}}",
+    "general": "BTCPay 伺服器出錯 . {{error}}"
+  }
+}

extensions/btcpaycheckout/locales/zh.json

@@ -0,0 +1,10 @@
+{
+  "shop_name": "商店名称",
+  "reviewAndPay": "用 BTCPay 服务器审查并支付!",
+  "reviewOrderMessage": "请审查您的订单并使用 BTCPay 服务器完成支付 .",
+  "complete_payment": "全额付款",
+  "error": {
+    "fetch_invoice": "BTCPay 服务器出错 。 获取发票失败 . {{error}}",
+    "general": "BTCPay 服务器出错 . {{error}}"
+  }
+}

extensions/btcpaycheckout/shopify.extension.toml

@@ -3,7 +3,7 @@
 
 # The version of APIs your extension will receive. Learn more:
 # https://shopify.dev/docs/api/usage/versioning
-api_version = "2024-10"
+api_version = "2025-07"
 
 [[extensions]]
 name = "BTCPay Checkout"
@@ -27,7 +27,7 @@ api_access = false
 # Gives your extension access to make external network calls, using the
 # JavaScript `fetch()` API. Learn more:
 # https://shopify.dev/docs/api/checkout-ui-extensions/unstable/configuration#network-access
-network_access = false
+network_access = true
 
 # Loads metafields on checkout resources, including the cart,
 # products, customers, and more. Learn more:

extensions/btcpaycheckout/src/Checkout.jsx

@@ -4,8 +4,11 @@ import {
   Button,
   Text,
   useApi,
+  Spinner,
+  useTranslate,
   useSelectedPaymentOptions
 } from "@shopify/ui-extensions-react/checkout";
+import { useEffect, useState } from "react";
 
 // 1. Choose an extension target
 export default reactExtension(
@@ -14,19 +17,58 @@ export default reactExtension(
 );
 
 function Extension() {
+  const translate = useTranslate();
   const options = useSelectedPaymentOptions();
   const { shop, checkoutToken } = useApi();
+  const [isLoading, setIsLoading] = useState(true);
+  const [isSuccess, setIsSuccess] = useState(false);
+  const [errorMessage, setErrorMessage] = useState('');
   const hasManualPayment = options.some((option) => option.type.toLowerCase() === 'manualpayment');
   const appUrl = `PLUGIN_URL/checkout?checkout_token=${checkoutToken.current}`;
 
+  useEffect(() => {
+    if (!hasManualPayment) return;
+    const fetchInvoice = async () => {
+      setIsLoading(true);
+      try {
+        const response = await fetch(`${appUrl}&redirect=false`, {
+          method: 'GET',
+          headers: { 'Content-Type': 'application/json' },
+        });
+        if (response.ok) {
+          setIsSuccess(true);
+        }
+        else if (response.status !== 404) {
+          const errorText = await response.text();
+          setErrorMessage(translate("error.fetch_invoice", { error: errorText || response.statusText }));
+        }
+      } catch (error) {
+        setErrorMessage(translate("error.general", { error: error.message }));
+      }
+      finally {
+        setIsLoading(false);
+      }
+    };
+    const timer = setTimeout(fetchInvoice, 1000);
+    return () => clearTimeout(timer)
+  }, [hasManualPayment]);
+
   if (!hasManualPayment) return null;
 
   return (
     <BlockStack>
-      <Text>Shop name: {shop.name}</Text>
-      <Text size="large" alignment="center" bold>Review and pay using BTCPay Server!</Text>
-      <Text>Please review your order and complete the payment using BTCPay Server.</Text>
-      <Button to={appUrl} external>Complete Payment</Button>
+      {isLoading && <Spinner />}
+      {!isLoading && errorMessage && (
+        <Text size="large" appearance="critical">{errorMessage}</Text>
+      )}
+      {!isLoading && isSuccess && (
+        <>
+          <Text>{translate("shop_name")}: {shop.name}</Text>
+          <Text size="large" alignment="center" bold>{translate("reviewAndPay")}</Text>
+          <Text>{translate("reviewOrderMessage")}.</Text>
+          <Button to={appUrl} external>{translate("complete_payment")}</Button>
+        </>
+      )}
     </BlockStack>
   );
 }

shopify.app.toml.example

@@ -6,16 +6,13 @@ client_id = "CLIENT_ID"
 application_url = "PLUGIN_URL"
 embedded = true
 
-[build]
-include_config_on_deploy = true
-
 [access_scopes]
 # Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes
-scopes = "read_orders,write_orders"
+scopes = "read_orders,write_orders,read_customers"
 
 [auth]
 redirect_urls = ["PLUGIN_URL/checkout"]
 
 [webhooks]
-api_version = "2024-10"
+api_version = "2025-07"