[Feat] Update app to use global proxy service (SC-167944, SC-180549, SC-183520, SC-180990)

SETUP.md

@@ -1,8 +1,11 @@
 Shopify App Setup
 ===
 
-To install the Shopify app you'll first need to create an API access token. Head over to your Shopify store and login 
-to the store admin. 
+Follow these steps to install and configure the Shopify app using either an Access Token or OAuth credentials.
+
+## Using Access Token
+
+Head over to your Shopify store and login to the store admin. 
 
 From the store admin dashboard, navigate to the "Settings" page using the button in the bottom left.
 
@@ -80,3 +83,39 @@ To configure who can see and use the Shopify app, head to the "Permissions" tab
 you'd like to have access.
 
 When you're happy, click "Install".
+
+## Using OAuth
+
+Go to your Shopify Partner account and navigate to the Apps section in the sidebar. On the "Apps" page, click "Create app".
+
+[![](/docs/assets/setup/shopify-setup-oauth-01.png)](/docs/assets/setup/shopify-setup-oauth-01.png)
+
+On the "Create a new app" page click "Create app manually" under "Use Shopify Partners", give your app a name (e.g. Deskpro) and click "Create".
+
+[![](/docs/assets/setup/shopify-setup-oauth-02.png)](/docs/assets/setup/shopify-setup-oauth-02.png)
+
+Once the app is created, you'll see a screen with its details. Copy the `Client ID` and `Client Secret`, then enter them in the Settings tab in Deskpro.
+
+[![](/docs/assets/setup/shopify-setup-oauth-05.png)](/docs/assets/setup/shopify-setup-oauth-05.png)
+
+Next, click "Choose distribution" on the same page to make your app live.
+
+Select a distribution method. Public apps require approval from Shopify, while Custom apps are intended for use on a single store without requiring approval. This guide follows the Custom app setup.
+
+[![](/docs/assets/setup/shopify-setup-oauth-03.png)](/docs/assets/setup/shopify-setup-oauth-03.png)
+
+Enter your store url and click "Generate Link"
+
+
+Now, click Configuration in the sidebar. Enter the callback URL from the Settings tab in Deskpro into the "Allowed redirection URL(s)" field. Set "Embed app in Shopify admin" to `false`.
+
+[![](/docs/assets/setup/shopify-setup-oauth-04.png)](/docs/assets/setup/shopify-setup-oauth-04.png)
+
+
+Once you've made these changes, click "Save and release".
+
+To configure who can see and use the Shopify app, head to the "Permissions" tab and select those users and/or groups 
+you'd like to have access.
+
+When you're happy, click "Install".
+

manifest.json

@@ -8,9 +8,16 @@
   "isSingleInstall": false,
   "hasDevMode": true,
   "serveUrl": "https://apps-cdn.deskpro-service.com/__name__/__version__",
+  "secrets": "hy5diyldVvLk+hwqrKPn3hy82isOK9JpbvD18IfoofGwpo1nNTup39yNWkuVIPODUrTIfuoY4nAwi+/QcTVK/7uecibF8+FY5Ibypyr/dwwDldkPB5CjyxPpW54fdUhjGfDRiwKvvvphqE+zpi57x49wPrANgZblWoaDvmYhvlObKIW7mTRO280EOzPactM4CHonN70pBydYkC2CAT3GeSGplmCTbS9vo1Hfgmz4SL2KsepeePVXnHaa0XIMreiUvCx05l7ozJvfZlxwClocy6k5WX2HHGF6PNxo/haXXlLCYpHiARIQ7F7+0UhSC9jqAxS77+LCORJXgM89+hew/pNQktTEQMLrr9i8Gy2s7G9DRSH96npgu+EeIkvHk1vn1hxJUwZgi+WLNn1lWGhmtXs+eLIFII/PMelE7EdphsTrwhf06JvMrNGys7ZImnA46RaacLa43I8JGyktD9Ll2l7Fvz5DoG7SIGO25DfA5pDivHa7gax/7ymm+5N5ltBTPUpBTi0Sigq1WCUBR9/bv+Jdp5QmbkBBr9EQnDARZrHo3DcClPC+CTQ4qofXql8B/5GwxqXuqVwoPo2DUN7lJWUx6p3TCYLZY7lvvHFm8HMsq/WJdMFasHa5+MphTBxtSVF4+vpSILBjQZj+7B2mEc+rqNYikufZHIP0aYYfmETByvD8sAxHz5XgGKA72HBfSHrPSQyNRUeZFcfq05QJx8fpa/ZzbhByiazQB3AmQ1rKhkq26SPmxojKmDcLBYaIwMmaplZEc5qTszIcRTZxOUn2WMlsovjOjW5C2LlFhYtqCoOhQR9Wu7bLoH85J7yleEXNQLfR28C3S0xPCbbdp0DRRdPOx8jT0qTXHrDuJJIDlkWf9iJJnE9ygTdWVczVm8PVK3duIqgzsfD5SrJyyfIxwQSv+wd9cNX9PbQ345iT2SGPvWRomBStTn9q8azA1ejsnVG7kIrNujSKIrp+9bSzGkkWcrFragaw2loyoyQs8OGrDVEbXdVdwyHxK0GlP7Gi17hplNx6a/ZrEyhsrdcqJBK+rR7uYM3mKcQniZJAUc+4fhANjGqUEYxNJ2ZKq79stOxU+QV+tXfB/36HaVJOIfLy2Z2K85c+0URADXzFS8mH9hjyLIUZuviMJHQtpngI6zwnZoXfK0eMxrOU+kC0+cQKD4r1niQGc1rYg6mFNKlq4E+0esEUgxJItKbMxPhQ4D+ZcrliokUfAlr0k6qThzWg3MT26mUlpn8Z1liwg3ojogBMogYsmfqB74JCulEgdN2EmpdsAU9lm9cmvJWV8eaHG2mLFxiux2RLQ+JYFmVjXCKW1y+xgfINublCW53QG28S/DmnKGI5DZim5+jqEkv5kTUXdL7XtCkxjm4heGWGhtX2/Or6XLBDOtR+zmc/OlD3NkcJeyyG7fy3672flgTbv1WzkUKgcX3+dU0/HjsAftX0lFbKrr39zuIavogTIcmBHuVytKicfeLFCqvTneoGpXZqvkVhEaY/2qFbXpCc5Akw1oiMz1iifJ1G",
   "targets": [
-    { "target": "ticket_sidebar", "entrypoint": "index.html" },
-    { "target": "user_sidebar", "entrypoint": "index.html" }
+    {
+      "target": "ticket_sidebar",
+      "entrypoint": "index.html"
+    },
+    {
+      "target": "user_sidebar",
+      "entrypoint": "index.html"
+    }
   ],
   "entityAssociations": {
     "linkedShopifyCustomers": {
@@ -20,38 +27,100 @@
     }
   },
   "settings": {
+    "use_advanced_connect": {
+      "title": "Advanced Connect",
+      "description": "Follow the setup guide and use your credentials to connect the app to Deskpro.",
+      "type": "boolean",
+      "default": false,
+      "isRequired": false,
+      "isBackendOnly": false,
+      "order": 5
+    },
+    "use_access_token": {
+      "title": "Use Access Token",
+      "type": "boolean",
+      "isRequired": false,
+      "isBackendOnly": false,
+      "default": false,
+      "condition": "settings.use_advanced_connect != false",
+      "order": 10
+    },
     "shop_name": {
       "title": "Shop name",
       "description": "Your Shop name",
       "type": "string",
       "isRequired": true,
       "isBackendOnly": false,
-      "order": 10
+      "order": 20
     },
     "access_token": {
       "title": "Access Token",
       "description": "Your shopify access token, please follow the app setup guide to get this",
       "type": "string",
-      "isRequired": true,
+      "isRequired": false,
       "isBackendOnly": true,
-      "order": 20
+      "condition": "settings.use_advanced_connect != false && settings.use_access_token == true",
+      "order": 30
     },
     "verify_settings": {
       "title": "",
       "type": "app_embedded",
-      "options": { "entrypoint": "#/admin/verify_settings" },
+      "options": {
+        "entrypoint": "#/admin/verify_settings",
+        "height": "30px"
+      },
       "isRequired": false,
+      "condition": "settings.use_advanced_connect != false && settings.use_access_token == true",
       "isBackendOnly": true,
-      "order": 30
+      "order": 40
+    },
+    "client_id": {
+      "title": "Client ID",
+      "type": "string",
+      "isRequired": false,
+      "isBackendOnly": false,
+      "condition": "settings.use_advanced_connect != false && settings.use_access_token != true",
+      "order": 50
+    },
+    "client_secret": {
+      "title": "Client Secret",
+      "type": "string",
+      "isRequired": false,
+      "isBackendOnly": true,
+      "condition": "settings.use_advanced_connect != false && settings.use_access_token != true",
+      "order": 60
+    },
+    "callback_url": {
+      "title": "Callback URL",
+      "type": "app_embedded",
+      "options": {
+        "entrypoint": "#/admin/callback"
+      },
+      "isRequired": false,
+      "isBackendOnly": true,
+      "condition": "settings.use_advanced_connect != false && settings.use_access_token != true",
+      "order": 70
     }
   },
   "proxy": {
     "whitelist": [
       {
         "url": "https://(.*).myshopify.com/admin/api/.*",
-        "methods": ["GET", "POST", "PUT", "DELETE"],
+        "methods": [
+          "GET",
+          "POST",
+          "PUT",
+          "DELETE"
+        ],
+        "timeout": 30
+      },
+      {
+        "url": "https://(.*).myshopify.com/admin/oauth/.*",
+        "methods": [
+          "POST"
+        ],
         "timeout": 30
       }
     ]
   }
-}
+}

package.json

@@ -15,7 +15,7 @@
     "bumpManifestVer": "node ./bin/bumpManifestVer.js"
   },
   "dependencies": {
-    "@deskpro/app-sdk": "^5.1.1",
+    "@deskpro/app-sdk": "^6.0.3",
     "@deskpro/deskpro-ui": "^8.2.0",
     "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@heroicons/react": "1.0.6",
@@ -74,6 +74,6 @@
     "slugify": "^1.6.6",
     "ts-jest": "^29.2.5",
     "typescript": "^5.7.2",
-    "vite": "^6.0.11"
+    "vite": "^6.2.2"
   }
-}
+}