Include order scopes

.env.example

@@ -1,5 +1,5 @@
 DATABASE_URL=file:/app/data/database.sqlite
-SHOPIFY_APP_URL=http://localhost:3000
+SHOPIFY_APP_URL=http://localhost:3000/shopifyapp/
 SHOPIFY_API_KEY=your_client_id
 SHOPIFY_API_SECRET=your_client_secret
 DOMAIN=YOUR_HOSTED_APP_URL.COM

app/routes/_index/route.jsx

@@ -7,15 +7,13 @@ export const loader = async ({ request }) => {
   const url = new URL(request.url);
 
   if (url.searchParams.get("shop")) {
-    throw redirect(`/app?${url.searchParams.toString()}`);
+    throw redirect(`/shopifyapp/app?${url.searchParams.toString()}`);
   }
 
   return json({ showForm: Boolean(login) });
 };
 
 export default function App() {
-  const { showForm } = useLoaderData();
-
   return (
     <div className={styles.index}>
       <div className={styles.content}>

app/routes/shopifyapp._index.jsx

@@ -0,0 +1,55 @@
+import styles from "./_index/styles.module.css"
+import { redirect, json } from '@remix-run/node';
+import { login } from "../shopify.server";
+
+export const loader = async ({ request }) => {
+    const url = new URL(request.url);
+  
+    if (url.searchParams.get("shop")) {
+      throw redirect(`/shopifyapp/app?${url.searchParams.toString()}`);
+    }
+  
+    return json({ showForm: Boolean(login) });
+  };
+  
+  export default function App() {
+    return (
+      <div className={styles.index}>
+        <div className={styles.content}>
+          <h1 className={styles.heading}>Accept Bitcoin in Shopify with BTCPay Server</h1>
+          <p className={styles.text}>
+            Add Bitcoin as a payment option to your store with{" "}
+            <a
+              href="https://btcpayserver.org/"
+              target="_blank"
+              rel="noopener noreferrer"
+              style={{ color: "#3498db", textDecoration: "underline" }}
+            >
+              BTCPay Server
+            </a>
+            . It's free, simple, secure, and puts you in full control.
+          </p>
+  
+          <ul className={styles.list}>
+            <li>
+              <strong>Zero fees: </strong> Enjoy a payment gateway with no fees. Yes, You saw that right. Zero fees!
+            </li>
+            <li>
+              <strong>No middlemen: </strong> Say goodbye to intermediaries and tedious paperwork, and get your money directly in your wallet
+            </li>
+            <li>
+              <strong>Community-driven support: </strong> Get responsive assistance from our dedicated community
+            </li>
+          </ul>
+          <div>
+            <a className={styles.button} 
+            target="_blank"
+            href="https://docs.btcpayserver.org/Shopify/">
+              Get Started
+            </a>
+          </div>
+        </div>
+      </div>
+    );
+  }
+  

app/routes/shopifyapp.app.jsx

@@ -20,7 +20,7 @@ export default function App() {
   return (
     <AppProvider isEmbeddedApp apiKey={apiKey}>
       <NavMenu>
-        <Link to="/app" rel="home">
+        <Link to="/shopifyapp/app" rel="home">
           Home
         </Link>
       </NavMenu>

app/shopify.server.js

@@ -14,7 +14,7 @@ const shopify = shopifyApp({
   apiVersion: ApiVersion.October24,
   scopes: process.env.SCOPES?.split(","),
   appUrl: process.env.SHOPIFY_APP_URL || "",
-  authPathPrefix: "/auth",
+  authPathPrefix: "/shopifyapp/auth",
   sessionStorage: new PrismaSessionStorage(prisma),
   distribution: AppDistribution.AppStore,
   restResources,

extensions/btcpaycheckout/src/Checkout.jsx

@@ -73,7 +73,7 @@ function Extension() {
   const retrieveBTCPayUrl = async (shopName) => {
     appUrl = appUrl.endsWith('/') ? appUrl.slice(0, -1) : appUrl;
     const response = await fetch(
-      `https://${appUrl}/api/btcpaystores?shopName=${shopName}`,
+      `https://${appUrl}/shopifyapp/api/btcpaystores?shopName=${shopName}`,
       {
         method: 'GET',
         headers: {

shopify.app.toml.example

@@ -3,7 +3,7 @@
 client_id = "YOURCLIENT_ID"
 name = "BTCPay Server APPNAME"
 handle = "btcpay-server-APPNAME"
-application_url = "https://YOUR_HOSTED_APP_URL.COM/"
+application_url = "https://YOUR_HOSTED_APP_URL.COM/shopifyapp/"
 embedded = true
 
 [build]
@@ -13,33 +13,33 @@ include_config_on_deploy = true
 
 [access_scopes]
 # Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes
-scopes = ""
+scopes = "read_orders,write_orders"
 
 [auth]
 redirect_urls = [
-  "https://YOUR_HOSTED_APP_URL.COM/auth/callback",
-  "https://YOUR_HOSTED_APP_URL.COM/auth/shopify/callback",
-  "https://YOUR_HOSTED_APP_URL.COM/api/auth/callback"
+  "https://YOUR_HOSTED_APP_URL.COM/shopifyapp/auth/callback",
+  "https://YOUR_HOSTED_APP_URL.COM/shopifyapp/auth/shopify/callback",
+  "https://YOUR_HOSTED_APP_URL.COM/shopifyapp/api/auth/callback"
 ]
 
 [webhooks]
 api_version = "2024-10"
 
   [[webhooks.subscriptions]]
-  uri = "/webhooks/customers/data_request"
+  uri = "/shopifyapp/webhooks/customers/data_request"
   compliance_topics = [ "customers/data_request" ]
 
   [[webhooks.subscriptions]]
-  uri = "/webhooks/customers/redact"
+  uri = "/shopifyapp/webhooks/customers/redact"
   compliance_topics = [ "customers/redact" ]
 
   [[webhooks.subscriptions]]
-  uri = "/webhooks/shop/redact"
+  uri = "/shopifyapp/webhooks/shop/redact"
   compliance_topics = [ "shop/redact" ]
 
   [[webhooks.subscriptions]]
   topics = [ "app/uninstalled" ]
-  uri = "/webhooks/app/uninstalled"
+  uri = "/shopifyapp/webhooks/app/uninstalled"
 
 [pos]
 embedded = false

shopify.web.toml

@@ -1,6 +1,6 @@
 name = "remix"
 roles = ["frontend", "backend"]
-webhooks_path = "/webhooks/app/uninstalled"
+webhooks_path = "/shopifyapp/webhooks/app/uninstalled"
 
 [commands]
 predev = "npx prisma generate"

vite.config.js

@@ -51,5 +51,7 @@ export default defineConfig({
   ],
   build: {
     assetsInlineLimit: 0,
+    emptyOutDir: true,
+    assetsDir: 'shopifyapp/assets', 
   },
 });