chore: 🤖 improve scopes/new titling - icu-6714 (#1407)

* chore: 🤖 improve scopes/new titling - icu-6714

✅ Closes: icu-6714

* chore: 🤖 improve new scope link text

addons/core/translations/resources/en-us.yaml

@@ -193,6 +193,8 @@ org:
       title: Welcome to Orgs
     settings:
       title: Org Settings
+  titles:
+    new: New Org
   actions:
     delete: Delete Org
 project:
@@ -204,6 +206,8 @@ project:
       title: Welcome to Projects
     settings:
       title: Project Settings
+  titles:
+    new: New Project
   actions:
     delete: Delete Project
 user:

ui/admin/app/controllers/scopes/scope/scopes/new.js

@@ -0,0 +1,27 @@
+import Controller from '@ember/controller';
+import { inject as service } from '@ember/service';
+import { computed } from '@ember/object';
+
+export default class ScopesScopeScopesNewController extends Controller {
+  // =services
+
+  @service intl;
+
+  // =attributes
+
+  /**
+   * @type {string}
+   */
+  @computed('intl', 'model.{currentScope,isOrg,isProject}')
+  get breadCrumb() {
+    if (this.model.isOrg) {
+      return this.intl.t('resources.org.titles.new');
+    }
+    /* istanbul ignore else */
+    if (this.model.isProject) {
+      return this.intl.t('resources.project.titles.new');
+    }
+    /* istanbul ignore next */
+    return null;
+  }
+}

ui/admin/app/router.js

@@ -18,9 +18,10 @@ Router.map(function () {
         });
       });
 
-      this.route('scopes', function () {});
+      this.route('scopes', function () {
+        this.route('new');
+      });
       this.route('edit');
-      this.route('new');
 
       this.route('users', function () {
         this.route('user', { path: ':user_id' }, function () {

ui/admin/app/routes/onboarding/quick-setup/choose-path.js

@@ -17,7 +17,7 @@ export default class OnboardingQuickSetupChoosePathRoute extends Route {
         break;
       case 'manual':
       default:
-        this.router.transitionTo('scopes.scope.new', 'global');
+        this.router.transitionTo('scopes.scope.scopes.new', 'global');
         break;
     }
   }

ui/admin/app/routes/scopes/scope.js

@@ -2,6 +2,7 @@ import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
 import { A } from '@ember/array';
 import { action } from '@ember/object';
+import { next } from '@ember/runloop';
 import { loading } from 'ember-loading';
 import { confirm } from 'core/decorators/confirm';
 import { notifySuccess, notifyError } from 'core/decorators/notify';
@@ -105,8 +106,10 @@ export default class ScopesScopeRoute extends Route {
   @action
   cancel(scope) {
     const { isNew } = scope;
-    scope.rollbackAttributes();
-    if (isNew) this.router.transitionTo('scopes.scope');
+    next(() => {
+      scope.rollbackAttributes();
+      if (isNew) this.router.transitionTo('scopes.scope');
+    });
   }
 
   /**

ui/admin/app/routes/scopes/scope/host-catalogs/host-catalog/host-sets.js

@@ -24,7 +24,7 @@ export default class ScopesScopeHostCatalogsHostCatalogHostSetsRoute extends Rou
       'scopes.scope.host-catalogs.host-catalog'
     );
     const { id: host_catalog_id } = hostCatalog;
-    let hostSets
+    let hostSets;
 
     if (
       this.can.can('list model', hostCatalog, {
@@ -36,8 +36,8 @@ export default class ScopesScopeHostCatalogsHostCatalogHostSetsRoute extends Rou
 
     return {
       hostCatalog,
-      hostSets
-    }
+      hostSets,
+    };
   }
 
   // =actions

ui/admin/app/routes/scopes/scope/host-catalogs/host-catalog/hosts.js

@@ -37,7 +37,7 @@ export default class ScopesScopeHostCatalogsHostCatalogHostsRoute extends Route
     return {
       hostCatalog,
       hosts,
-    }
+    };
   }
 
   // =actions

ui/admin/app/routes/scopes/scope/scopes/new.js

@@ -1,7 +1,7 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
 
-export default class ScopesScopeNewRoute extends Route {
+export default class ScopesScopeScopesNewRoute extends Route {
   // =services
 
   @service session;

ui/admin/app/templates/scopes/scope/new.hbs

@@ -1,27 +0,0 @@
-{{page-title (t 'titles.new')}}
-
-<Rose::Layout::Page as |page|>
-
-  <page.breadcrumbs>
-    <BreadCrumbs />
-  </page.breadcrumbs>
-
-  <page.header>
-    <h2>
-      {{t 'titles.new'}}
-      <DocLink
-        @doc={{if @model.isOrg 'org.new' 'project.new'}}
-        @iconSize='large'
-      />
-    </h2>
-  </page.header>
-
-  <page.body>
-    <Form::Scope
-      @model={{@model}}
-      @submit={{route-action 'save' @model}}
-      @cancel={{route-action 'cancel' @model}}
-    />
-  </page.body>
-
-</Rose::Layout::Page>

ui/admin/app/templates/scopes/scope/scopes/index.hbs

@@ -13,8 +13,7 @@
       {{#if @model.subScopes}}
         <p>{{t 'resources.org.description'}}</p>
       {{/if}}
-    {{/if}}
-    {{#if @model.currentScope.isOrg}}
+    {{else if @model.currentScope.isOrg}}
       <h2>
         {{t 'resources.project.title_plural'}}
         <DocLink @doc='project' @iconSize='large' />
@@ -28,8 +27,12 @@
   <page.actions>
     {{#if (can 'create model' @model.currentScope collection='scopes')}}
       {{#if @model.subScopes}}
-        <Rose::LinkButton @route='scopes.scope.new' @style='primary'>
-          {{t 'titles.new'}}
+        <Rose::LinkButton @route='scopes.scope.scopes.new' @style='primary'>
+          {{#if @model.currentScope.isGlobal}}
+            {{t 'resources.org.titles.new'}}
+          {{else if @model.currentScope.isOrg}}
+            {{t 'resources.project.titles.new'}}
+          {{/if}}
         </Rose::LinkButton>
       {{/if}}
     {{/if}}
@@ -68,7 +71,7 @@
               {{t 'resources.org.description'}}
             </message.description>
             {{#if (can 'create model' @model.currentScope collection='scopes')}}
-              <message.link @route='scopes.scope.new'>
+              <message.link @route='scopes.scope.scopes.new'>
                 <Rose::Icon @name='flight-icons/svg/plus-circle-16' />
                 {{t 'titles.new'}}
               </message.link>
@@ -87,7 +90,7 @@
               {{t 'resources.project.description'}}
             </message.description>
             {{#if (can 'create model' @model.currentScope collection='scopes')}}
-              <message.link @route='scopes.scope.new'>
+              <message.link @route='scopes.scope.scopes.new'>
                 <Rose::Icon @name='flight-icons/svg/plus-circle-16' />
                 {{t 'titles.new'}}
               </message.link>

ui/admin/app/templates/scopes/scope/scopes/new.hbs

@@ -0,0 +1,33 @@
+{{page-title (t 'titles.new')}}
+
+<Rose::Layout::Page as |page|>
+
+  <page.breadcrumbs>
+    <BreadCrumbs />
+  </page.breadcrumbs>
+
+  <page.header>
+    {{#if @model.isOrg}}
+      <h2>
+        {{t 'resources.org.titles.new'}}
+        <DocLink @doc='org.new' @iconSize='large' />
+      </h2>
+      <p>{{t 'resources.org.description'}}</p>
+    {{else if @model.isProject}}
+      <h2>
+        {{t 'resources.project.titles.new'}}
+        <DocLink @doc='project.new' @iconSize='large' />
+      </h2>
+      <p>{{t 'resources.project.description'}}</p>
+    {{/if}}
+  </page.header>
+
+  <page.body>
+    <Form::Scope
+      @model={{@model}}
+      @submit={{route-action 'save' @model}}
+      @cancel={{route-action 'cancel' @model}}
+    />
+  </page.body>
+
+</Rose::Layout::Page>

ui/admin/tests/acceptance/authentication-test.js

@@ -95,7 +95,7 @@ module('Acceptance | authentication', function (hooks) {
     changePasswordURL = `/account/change-password`;
     orgsURL = `/scopes/global/scopes`;
     orgEditURL = `/scopes/${orgScopeID}/edit`;
-    newProjectURL = `/scopes/${orgScopeID}/new`;
+    newProjectURL = `/scopes/${orgScopeID}/scopes/new`;
     projectsURL = `/scopes/${orgScopeID}/scopes`;
     usersURL = `/scopes/${orgScopeID}/users`;
     groupsURL = `/scopes/${orgScopeID}/groups`;

ui/admin/tests/acceptance/onboarding/choose-path-test.js

@@ -10,7 +10,7 @@ module('Acceptance | onboarding | choose-path', function (hooks) {
 
   const urls = {
     choosePath: '/onboarding/quick-setup/choose-path',
-    newOrg: '/scopes/global/new',
+    newOrg: '/scopes/global/scopes/new',
     createResources: '/onboarding/quick-setup/create-resources',
   };
 

ui/admin/tests/acceptance/scopes-test.js

@@ -59,12 +59,12 @@ module('Acceptance | scopes', function (hooks) {
     });
     // Generate route URLs for resources
     urls.globalScope = `/scopes/global/scopes`;
-    urls.newOrgScope = `/scopes/global/new`;
+    urls.newOrgScope = `/scopes/global/scopes/new`;
     urls.orgScope = `/scopes/${instances.scopes.org.id}/scopes`;
     urls.org2Scope = `/scopes/${instances.scopes.org2.id}/scopes`;
     urls.orgScopeEdit = `/scopes/${instances.scopes.org.id}/edit`;
     urls.org2ScopeEdit = `/scopes/${instances.scopes.org2.id}/edit`;
-    urls.newProjectScope = `/scopes/${instances.scopes.org.id}/new`;
+    urls.newProjectScope = `/scopes/${instances.scopes.org.id}/scopes/new`;
     urls.projectScope = `/scopes/${instances.scopes.project.id}`;
     urls.project2Scope = `/scopes/${instances.scopes.project2.id}`;
     urls.projectScopeEdit = `/scopes/${instances.scopes.project.id}/edit`;

ui/admin/tests/unit/controllers/scopes/scope/scopes/new-test.js

@@ -0,0 +1,12 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Controller | scopes/scope/scopes/new', function (hooks) {
+  setupTest(hooks);
+
+  // TODO: Replace this with your real tests.
+  test('it exists', function (assert) {
+    let controller = this.owner.lookup('controller:scopes/scope/scopes/new');
+    assert.ok(controller);
+  });
+});

ui/admin/tests/unit/routes/scopes/scope/scopes/new-test.js

@@ -1,11 +1,11 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'ember-qunit';
 
-module('Unit | Route | scopes/scope/new', function (hooks) {
+module('Unit | Route | scopes/scope/scopes/new', function (hooks) {
   setupTest(hooks);
 
   test('it exists', function (assert) {
-    let route = this.owner.lookup('route:scopes/scope/new');
+    let route = this.owner.lookup('route:scopes/scope/scopes/new');
     assert.ok(route);
   });
 });