JSFiddle - React, Tailwind, and code Playground

by agconti

HTML

<script src="https://unpkg.com/@shopify/app-bridge@2"></script>

JavaScript

var AppBridge = window['app-bridge'];
var createApp = AppBridge.createApp;
var actions = AppBridge.actions;
var Redirect = actions.Redirect;

const host = 'liveblocks.myshopify.com'
var apiKey = 'a8e1382d7f1683bd1d514c9d55b16b37';
var redirectUri = 'http://rs-fot.ngrok.io/api/v1/social-auth/complete/shopify/';
var permissionUrl = 'https://'+
                    host +
                    '/admin'+
                    '/oauth/authorize?client_id='+
                    apiKey+
                    '&scope=read_products,read_content&redirect_uri='+
                    redirectUri;

// If the current window is the 'parent', change the URL by setting location.href
if (window.top == window.self) {
  window.location.assign(permissionUrl);

  // If the current window is the 'child', change the parent's URL with Shopify App Bridge's Redirect action
} else {
  var app = createApp({
    apiKey: apiKey,
    host: host
  });

  Redirect.create(app).dispatch(Redirect.Action.REMOTE, permissionUrl);
}