@fleetbase/registry-bridge-engine 0.0.11 → 0.0.13

package/addon/components/extension-card.hbs

@@ -6,6 +6,11 @@
         <div class="flex flex-col">
             <div class="font-semibold text-sm block {{@nameTextClass}}">{{@extension.name}}</div>
             <div class="text-xs {{@descriptionTextClass}}">{{n-a @extension.description}}</div>
+            {{#if @extension.payment_required}}
+                <Badge @status="success" @hideStatusDot={{true}}>{{format-currency @extension.price @extension.currency}}</Badge>
+            {{else}}
+                <Badge @status="success" @hideStatusDot={{true}}>Free</Badge>
+            {{/if}}
         </div>
         {{yield @extension}}
     </div>

package/addon/components/extension-card.js

@@ -26,6 +26,7 @@ export default class ExtensionCardComponent extends Component {
     @service fetch;
     @service stripe;
     @service urlSearchParams;
+    @service abilities;
     @tracked extension;
 
     constructor(owner, { extension }) {
@@ -40,9 +41,26 @@ export default class ExtensionCardComponent extends Component {
 
     @action onClick(options = {}) {
         const installChannel = `install.${this.currentUser.companyId}.${this.extension.id}`;
+        const isAuthor = this.extension.is_author === true;
+        const isSelfManaged = this.extension.self_managed === true;
         const isAlreadyPurchased = this.extension.is_purchased === true;
         const isAlreadyInstalled = this.extension.is_installed === true;
-        const isPaymentRequired = this.extension.payment_required === true && isAlreadyPurchased === false;
+        const isPaymentRequired = !isAuthor && this.extension.payment_required === true && isAlreadyPurchased === false;
+        const userCannotPurchase = isPaymentRequired && this.abilities.cannot('registry-bridge purchase extension');
+        let acceptButtonText = isPaymentRequired ? `Purchase for ${formatCurrency(this.extension.price, this.extension.currency)}` : isAlreadyInstalled ? 'Installed' : 'Install';
+        if (this.abilities.cannot('registry-bridge install extension')) {
+            acceptButtonText = 'Unauthorized to Install';
+        }
+        const goBack = async (modal) => {
+            await modal.done();
+            later(
+                this,
+                () => {
+                    this.onClick();
+                },
+                100
+            );
+        };
 
         if (typeof this.args.onClick === 'function') {
             this.args.onClick(this.extension);
@@ -53,9 +71,9 @@ export default class ExtensionCardComponent extends Component {
             titleComponent: 'extension-modal-title',
             modalClass: 'flb--extension-modal modal-lg',
             modalHeaderClass: 'flb--extension-modal-header',
-            acceptButtonText: isPaymentRequired ? `Purchase for ${formatCurrency(this.extension.price, this.extension.currency)}` : isAlreadyInstalled ? 'Installed' : 'Install',
+            acceptButtonText,
             acceptButtonIcon: isPaymentRequired ? 'credit-card' : isAlreadyInstalled ? 'check' : 'download',
-            acceptButtonDisabled: isAlreadyInstalled,
+            acceptButtonDisabled: this.abilities.cannot('registry-bridge install extension') || isAlreadyInstalled || userCannotPurchase,
             acceptButtonScheme: isPaymentRequired ? 'success' : 'primary',
             declineButtonText: 'Done',
             process: null,
@@ -63,6 +81,13 @@ export default class ExtensionCardComponent extends Component {
             stepDescription: 'Awaiting install to begin...',
             progress: 0,
             extension: this.extension,
+            viewSelfManagesInstallInstructions: () => {
+                this.selfManagedInstallInstructions({
+                    extension: this.extension,
+                    confirm: goBack,
+                    decline: goBack,
+                });
+            },
             confirm: async (modal) => {
                 modal.startLoading();
 
@@ -71,6 +96,22 @@ export default class ExtensionCardComponent extends Component {
                     return this.startCheckoutSession();
                 }
 
+                // If self managed just prompt instructions
+                if (isSelfManaged) {
+                    await modal.done();
+                    return later(
+                        this,
+                        () => {
+                            return this.selfManagedInstallInstructions({
+                                extension: this.extension,
+                                confirm: goBack,
+                                decline: goBack,
+                            });
+                        },
+                        100
+                    );
+                }
+
                 // Listen for install progress
                 this.socket.listen(installChannel, ({ process, step, progress }) => {
                     let stepDescription;
@@ -121,6 +162,16 @@ export default class ExtensionCardComponent extends Component {
         });
     }
 
+    async selfManagedInstallInstructions(options = {}) {
+        await this.modalsManager.done();
+        this.modalsManager.show('modals/self-managed-install-instructions', {
+            title: 'Install a Self Managed Extension',
+            hideDeclineButton: true,
+            acceptButtonText: 'Done',
+            ...options,
+        });
+    }
+
     async startCheckoutSession() {
         const checkout = await this.stripe.initEmbeddedCheckout({
             fetchClientSecret: this.fetchClientSecret.bind(this),

package/addon/components/extension-form.hbs

@@ -69,7 +69,6 @@
 
             <InputGroup
                 @name={{t "registry-bridge.developers.extensions.extension-form.extension-tags"}}
-                @wrapperClass="mb-0i"
                 @helpText={{t "registry-bridge.developers.extensions.extension-form.extension-tags-help-text"}}
             >
                 <TagInput
@@ -85,6 +84,19 @@
                     {{tag}}
                 </TagInput>
             </InputGroup>
+
+            <InputGroup @wrapperClass="mb-0i">
+                <Toggle
+                    @isToggled={{@extension.self_managed}}
+                    @onToggle={{fn (mut @extension.self_managed)}}
+                    @helpText={{t "registry-bridge.developers.extensions.extension-form.self-managed-help-text"}}
+                >
+                    <span class="dark:text-gray-100 text-sm mx-2">{{t "registry-bridge.developers.extensions.extension-form.self-managed"}}</span>
+                </Toggle>
+                <p class="mt-2 text-xs bg-blue-800 border border-blue-600 px-2 py-2 rounded-md text-blue-100">
+                    {{t "registry-bridge.developers.extensions.extension-form.self-managed-help-text"}}
+                </p>
+            </InputGroup>
         </ContentPanel>
         <ContentPanel @title={{t "registry-bridge.developers.extensions.extension-form.extension-bundle"}} @open={{true}} @pad={{false}} @panelBodyClass="bg-white dark:bg-gray-800">
             <div class="px-4 pb-4 pt-3 flex flex-col flex-grow-0">
@@ -101,7 +113,13 @@
                 {{/if}}
             </div>
         </ContentPanel>
-        <ContentPanel @title={{t "registry-bridge.developers.extensions.extension-form.extension-listing-details"}} @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
+        <ContentPanel
+            @title={{t "registry-bridge.developers.extensions.extension-form.extension-listing-details"}}
+            @open={{true}}
+            @pad={{true}}
+            @panelBodyClass="bg-white dark:bg-gray-800"
+            @actionButtons={{this.listingDetailsPanelActions}}
+        >
             <InputGroup
                 @name={{t "registry-bridge.developers.extensions.extension-form.extension-promotional-text"}}
                 @helpText={{t "registry-bridge.developers.extensions.extension-form.extension-promotional-text-help-text"}}

package/addon/components/extension-form.js

@@ -3,6 +3,8 @@ import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
 import { task } from 'ember-concurrency';
+import { later } from '@ember/runloop';
+import formatCurrency from '@fleetbase/ember-ui/utils/format-currency';
 
 export default class ExtensionFormComponent extends Component {
     @service store;
@@ -13,6 +15,14 @@ export default class ExtensionFormComponent extends Component {
     @tracked subscriptionModelOptions = ['flat_rate', 'tiered', 'usage'];
     @tracked billingPeriodOptions = ['daily', 'weekly', 'monthly', 'quarterly', 'yearly'];
     @tracked uploadQueue = [];
+    listingDetailsPanelActions = [
+        {
+            type: 'link',
+            size: 'xs',
+            text: 'Preview Listing',
+            onClick: this.previewListing,
+        },
+    ];
     acceptedImageTypes = ['image/jpeg', 'image/png', 'image/gif'];
     acceptedBundleTypes = [
         'application/zip',
@@ -120,4 +130,51 @@ export default class ExtensionFormComponent extends Component {
     @action removeFile(file) {
         return file.destroyRecord();
     }
+
+    @action previewListing(options = {}) {
+        const extension = this.args.extension;
+        const isAlreadyPurchased = extension.is_purchased === true;
+        const isAlreadyInstalled = extension.is_installed === true;
+        const isPaymentRequired = extension.payment_required === true && isAlreadyPurchased === false;
+        const goBack = async (modal) => {
+            await modal.done();
+            later(
+                this,
+                () => {
+                    this.previewListing();
+                },
+                100
+            );
+        };
+
+        this.modalsManager.show('modals/extension-details', {
+            titleComponent: 'extension-modal-title',
+            modalClass: 'flb--extension-modal modal-lg',
+            modalHeaderClass: 'flb--extension-modal-header',
+            acceptButtonText: isPaymentRequired ? `Purchase for ${formatCurrency(extension.price, extension.currency)}` : isAlreadyInstalled ? 'Installed' : 'Install',
+            acceptButtonIcon: isPaymentRequired ? 'credit-card' : isAlreadyInstalled ? 'check' : 'download',
+            acceptButtonDisabled: true,
+            acceptButtonScheme: isPaymentRequired ? 'success' : 'primary',
+            declineButtonText: 'Done',
+            viewSelfManagesInstallInstructions: () => {
+                this.selfManagedInstallInstructions({
+                    extension,
+                    confirm: goBack,
+                    decline: goBack,
+                });
+            },
+            extension,
+            ...options,
+        });
+    }
+
+    async selfManagedInstallInstructions(options = {}) {
+        await this.modalsManager.done();
+        this.modalsManager.show('modals/self-managed-install-instructions', {
+            title: 'Install a Self Managed Extension',
+            hideDeclineButton: true,
+            acceptButtonText: 'Done',
+            ...options,
+        });
+    }
 }

package/addon/components/modals/extension-details.hbs

@@ -2,7 +2,7 @@
     <div class="modal-body-container space-y-3">
         <div class="flex flex-row items-center space-x-2">
             <div class="flb--extension-tag shadow-sm border dark:bg-gray-800 dark:border-gray-800 dark:text-gray-200">
-                Extension
+                {{t "registry-bridge.component.extension-details-modal.extension"}}
             </div>
             <div class="flb--extension-tag shadow-sm border dark:bg-gray-800 dark:border-gray-800 dark:text-gray-200">
                 {{this.extension.category_name}}
@@ -27,41 +27,63 @@
                 </EmberWormhole>
             {{/if}}
         {{/if}}
-        <div>
-            <h3 class="dark:text-white font-semibold mb-1">Overview</h3>
-            <div class="space-y-1">
+        <div class="space-y-3">
+            <div>
+                <h3 class="dark:text-white font-semibold mb-1">{{t "registry-bridge.component.extension-details-modal.description"}}</h3>
                 <p class="dark:text-gray-200 text-sm">{{this.extension.description}}</p>
-                <p class="dark:text-gray-200 text-sm">{{html-safe this.extension.promotional_text}}</p>
+            </div>
+            <div>
+                <h3 class="dark:text-white font-semibold mb-1">{{t "registry-bridge.component.extension-details-modal.overview"}}</h3>
+                <div class="extension-details-promo-content dark:text-gray-200 text-sm">{{html-safe this.extension.promotional_text}}</div>
             </div>
         </div>
         <div>
-            <h3 class="dark:text-white font-semibold mb-1">Details</h3>
+            <h3 class="dark:text-white font-semibold mb-1">{{t "registry-bridge.component.extension-details-modal.details"}}</h3>
             <div class="space-y-2">
                 <div class="grid grid-cols-4 gap-2">
                     <div class="space-y-2">
                         <div>
-                            <div class="text-sm font-semibold dark:text-gray-100">Version</div>
-                            <div class="text-sm dark:text-gray-200">{{this.extension.current_bundle_version}}</div>
+                            <div class="text-sm font-semibold dark:text-gray-100">{{t "registry-bridge.component.extension-details-modal.version"}}</div>
+                            <div class="text-sm dark:text-gray-200">{{n-a this.extension.current_bundle_version}}</div>
                         </div>
                         <div>
-                            <div class="text-sm font-semibold dark:text-gray-100">Updated</div>
-                            <div class="text-sm dark:text-gray-200">{{this.extension.updatedAt}}</div>
+                            <div class="text-sm font-semibold dark:text-gray-100">{{t "registry-bridge.component.extension-details-modal.updated"}}</div>
+                            <div class="text-sm dark:text-gray-200">{{n-a this.extension.updatedAt}}</div>
                         </div>
                     </div>
                     <div class="space-y-2">
                         <div>
-                            <div class="text-sm font-semibold dark:text-gray-100">Author</div>
-                            <div class="text-sm dark:text-gray-200">{{this.extension.publisher_name}}</div>
+                            <div class="text-sm font-semibold dark:text-gray-100">{{t "registry-bridge.component.extension-details-modal.author"}}</div>
+                            <div class="text-sm dark:text-gray-200">{{n-a this.extension.publisher_name}}</div>
                         </div>
                         <div>
-                            <div class="text-sm font-semibold dark:text-gray-100">Website</div>
-                            <a
-                                class="text-sm dark:text-gray-200"
-                                href={{this.extension.website_url}}
-                                target={{dasherize (concat this.extension.name "-website")}}
-                            >{{this.extension.website_url}}</a>
+                            <div class="text-sm font-semibold dark:text-gray-100">{{t "registry-bridge.component.extension-details-modal.website"}}</div>
+                            {{#if this.extension.website_url}}
+                                <a
+                                    class="text-sm text-blue-400 hover:text-blue-300"
+                                    href={{this.extension.website_url}}
+                                    target={{dasherize (concat this.extension.name "-website")}}
+                                >{{this.extension.website_url}}</a>
+                            {{else}}
+                                <div class="text-sm dark:text-gray-200">-</div>
+                            {{/if}}
                         </div>
                     </div>
+                    <div class="space-y-2">
+                        {{#if this.extension.self_managed}}
+                            <div>
+                                <Badge @status="info" @hideStatusDot={{true}} @helpText={{t "registry-bridge.component.extension-details-modal.self-managed-help-text"}}>{{t
+                                        "registry-bridge.component.extension-details-modal.self-managed"
+                                    }}</Badge>
+                                {{#if @options.viewSelfManagesInstallInstructions}}
+                                    <a href="#" class="text-xs text-blue-400 hover:opacity-50" {{on "click" @options.viewSelfManagesInstallInstructions}}><FaIcon
+                                            @icon="circle-info"
+                                            class="mr-1"
+                                        />How to install</a>
+                                {{/if}}
+                            </div>
+                        {{/if}}
+                    </div>
                 </div>
             </div>
         </div>

package/addon/components/modals/self-managed-install-instructions.hbs

@@ -0,0 +1,40 @@
+<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
+    <div class="modal-body-container">
+        <p class="text-sm mb-4 text-gray-900 dark:text-gray-200">
+            Begin the installation from the base directory of your Fleetbase instance. For comprehensive instructions, visit the
+            <a href="https://github.com/fleetbase/fleetbase-cli" target="fleetbase-cli" class="text-blue-400 hover:opacity-50">
+                <FaIcon @icon="arrow-up-right-from-square" class="text-xs" />
+                Fleetbase CLI GitHub page</a>.
+        </p>
+        <ol class="self-managed-install-instructions">
+            <li>
+                <div class="flex">
+                    First,
+                    <LinkTo @route="console.extensions.developers.credentials" class="ml-1 text-blue-400 hover:opacity-50">generate a Fleetbase registry credentials token.</LinkTo>
+                </div>
+            </li>
+            <li>
+                <div class="flex flex-col">
+                    <div class="mb-2">Install the Fleetbase CLI globally using npm:</div>
+                    <ClickToCopy @value={{concat "npm i -g @fleetbase/cli"}}><code>npm i -g @fleetbase/cli</code></ClickToCopy>
+                </div>
+            </li>
+            <li>
+                <div class="flex flex-col">
+                    <div class="mb-2">Set your authentication token with the CLI:</div>
+                    <ClickToCopy @value={{concat "flb set-auth {YOUR_TOKEN}"}}><code>flb set-auth {YOUR_TOKEN}</code></ClickToCopy>
+                </div>
+            </li>
+            <li>
+                <div class="flex flex-col">
+                    <div class="mb-2">Finally, install the extension using one of the following commands:</div>
+                    <div>
+                        <ClickToCopy @value={{concat "flb install fleetbase/" @options.extension.slug}}><code>flb install fleetbase/{{@options.extension.slug}}</code></ClickToCopy>
+                        <div class="my-1 pl-2">or</div>
+                        <ClickToCopy @value={{concat "flb install " @options.extension.public_id}}><code>flb install {{@options.extension.public_id}}</code></ClickToCopy>
+                    </div>
+                </div>
+            </li>
+        </ol>
+    </div>
+</Modal::Default>

package/addon/controllers/installed.js

@@ -9,6 +9,7 @@ export default class InstalledController extends Controller {
     @service notifications;
     @service socket;
     @service hostRouter;
+    @service abilities;
 
     @action about(extension) {
         this.modalsManager.show('modals/extension-details', {
@@ -31,6 +32,7 @@ export default class InstalledController extends Controller {
             acceptButtonText: 'Uninstall',
             acceptButtonIcon: 'trash',
             acceptButtonScheme: 'danger',
+            acceptButtonDisabled: this.abilities.cannot('registry-bridge uninstall extension'),
             process: null,
             step: null,
             stepDescription: 'Awaiting uninstall to begin...',

package/addon/engine.js

@@ -19,7 +19,7 @@ export default class RegistryBridgeEngine extends Engine {
     };
     setupExtension = function (app, engine, universe) {
         // Register menu item in header
-        universe.registerHeaderMenuItem('Extensions', 'console.extensions', { icon: 'shapes', priority: 99 });
+        universe.registerHeaderMenuItem('Extensions', 'console.extensions', { icon: 'shapes', priority: 99, slug: 'registry-bridge' });
         // Register admin controls
         universe.registerAdminMenuPanel(
             'Extensions Registry',

package/addon/models/registry-extension.js

@@ -63,8 +63,10 @@ export default class RegistryExtensionModel extends Model {
     @attr('array') languages;
     @attr('object') meta;
     @attr('boolean') core_service;
+    @attr('boolean') self_managed;
     @attr('boolean') is_purchased;
     @attr('boolean') is_installed;
+    @attr('boolean') is_author;
     @attr('string', { defaultValue: 'pending' }) status;
 
     /** @dates */

package/addon/routes/application.js

@@ -3,6 +3,17 @@ import { inject as service } from '@ember/service';
 
 export default class ApplicationRoute extends Route {
     @service fetch;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge see extension')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
 
     async setupController(controller) {
         super.setupController(...arguments);

package/addon/routes/developers/analytics.js

@@ -3,6 +3,17 @@ import { inject as service } from '@ember/service';
 
 export default class DevelopersAnalyticsRoute extends Route {
     @service store;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension-analytic')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
 
     model() {
         return this.store.query('registry-extension', { is_author: 1 });

package/addon/routes/developers/credentials.js

@@ -3,6 +3,17 @@ import { inject as service } from '@ember/service';
 
 export default class DevelopersCredentialsRoute extends Route {
     @service fetch;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list registry-token')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
 
     model() {
         return this.fetch.get('auth/registry-tokens', {}, { namespace: '~registry/v1' });

package/addon/routes/developers/extensions/edit.js

@@ -3,6 +3,17 @@ import { inject as service } from '@ember/service';
 
 export default class DevelopersExtensionsEditRoute extends Route {
     @service store;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge update extension-bundle')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
 
     model(params) {
         return this.store.queryRecord('registry-extension', { public_id: params.public_id, single: true });

package/addon/routes/developers/extensions/index.js

@@ -3,6 +3,17 @@ import { inject as service } from '@ember/service';
 
 export default class DevelopersExtensionsIndexRoute extends Route {
     @service store;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension-bundle')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
 
     model() {
         return this.store.query('registry-extension', { is_author: 1 });

package/addon/routes/developers/extensions/new.js

@@ -1,3 +1,16 @@
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
-export default class DevelopersExtensionsNewRoute extends Route {}
+export default class DevelopersExtensionsNewRoute extends Route {
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge create extension-bundle')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
+}

package/addon/routes/developers/extensions.js

@@ -1,3 +1,16 @@
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
-export default class DevelopersExtensionsRoute extends Route {}
+export default class DevelopersExtensionsRoute extends Route {
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension-bundle')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
+}

package/addon/routes/developers/payments/index.js

@@ -3,6 +3,10 @@ import { inject as service } from '@ember/service';
 
 export default class DevelopersPaymentsIndexRoute extends Route {
     @service fetch;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
 
     queryParams = {
         page: { refreshModel: true },
@@ -11,6 +15,13 @@ export default class DevelopersPaymentsIndexRoute extends Route {
         query: { refreshModel: true },
     };
 
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension-payment')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
+
     model() {
         return this.fetch.get('payments/author-received', {}, { namespace: '~registry/v1' });
     }

package/addon/routes/developers/payments/onboard.js

@@ -3,10 +3,17 @@ import { inject as service } from '@ember/service';
 
 export default class DevelopersPaymentsOnboardRoute extends Route {
     @service fetch;
-    @service hostRouter;
     @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
 
     async beforeModel() {
+        if (this.abilities.cannot('registry-bridge onboard extension-payment')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+
         try {
             const { hasStripeConnectAccount } = await this.fetch.get('payments/has-stripe-connect-account', {}, { namespace: '~registry/v1' });
             if (hasStripeConnectAccount) {

package/addon/routes/developers/payments.js

@@ -1,3 +1,16 @@
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
-export default class DevelopersPaymentsRoute extends Route {}
+export default class DevelopersPaymentsRoute extends Route {
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
+
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension-payment')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
+}

package/addon/routes/explore/category.js

@@ -3,6 +3,10 @@ import { inject as service } from '@ember/service';
 
 export default class ExploreCategoryRoute extends Route {
     @service store;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
 
     queryParams = {
         query: {
@@ -10,6 +14,13 @@ export default class ExploreCategoryRoute extends Route {
         },
     };
 
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
+
     model({ slug }) {
         return this.store.queryRecord('category', { slug, for: 'extension_category', core_category: 1, single: 1 });
     }

package/addon/routes/explore/index.js

@@ -3,6 +3,10 @@ import { inject as service } from '@ember/service';
 
 export default class ExploreIndexRoute extends Route {
     @service store;
+    @service notifications;
+    @service hostRouter;
+    @service abilities;
+    @service intl;
 
     queryParams = {
         query: {
@@ -10,6 +14,13 @@ export default class ExploreIndexRoute extends Route {
         },
     };
 
+    beforeModel() {
+        if (this.abilities.cannot('registry-bridge list extension')) {
+            this.notifications.warning(this.intl.t('common.unauthorized-access'));
+            return this.hostRouter.transitionTo('console');
+        }
+    }
+
     model(params) {
         const { query } = params;
         return this.store.query('registry-extension', { explore: 1, query });