refactor: 💡 Refactor default option in scope field and desc (#328)

* refactor: 💡 Refactor default option in scope field and desc

Refactor default option for scope field to be 'Choose an option' instead
of 'Global', so user can explicitly select their scope.  Refactor scope
field descriptions to give different context based on if the selection
is 'global' or an 'org' scope.

✅ Closes: ICU-9641

* refactor: 💡 refactor translations

Added correct translations for default, global, and org. Added small bit
of logic to help with switch of text on `onChange` event.

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

@@ -296,7 +296,9 @@ storage-bucket:
   form:
     scope:
       label: Scope
-      help: This storage bucket can be associated with targets in this scope.
+      help: Specify the scope this storage bucket will be available in.
+      help_global: This storage bucket will be available for use with all targets.
+      help_org: This storage bucket will be available for use with targets within this org.
     provider:
       label: Provider
       help: Boundary currently only supports Amazon S3 storage.

ui/admin/app/components/form/storage-bucket/index.hbs

@@ -61,14 +61,14 @@
     >
       <F.Label>{{t 'resources.storage-bucket.form.scope.label'}}</F.Label>
       <F.HelperText>
-        {{t 'resources.storage-bucket.form.scope.help'}}
+        {{this.scopeFieldDescription}}
       </F.HelperText>
       <F.Options>
+        <option disabled hidden selected value=''>
+          {{t 'titles.choose-an-option'}}
+        </option>
         {{#each @scopes as |scope|}}
-          <option
-            value={{scope.model.id}}
-            selected={{eq @model.scopeModel.id scope.model.id}}
-          >
+          <option value={{scope.model.id}}>
             {{scope.model.displayName}}
           </option>
         {{/each}}
@@ -82,9 +82,13 @@
       as |F|
     >
       <F.Label>{{t 'resources.storage-bucket.form.scope.label'}}</F.Label>
-      <F.HelperText>{{t
-          'resources.storage-bucket.form.scope.help'
-        }}</F.HelperText>
+      <F.HelperText>
+        {{#if @model.scopeModel.isGlobal}}
+          {{t 'resources.storage-bucket.form.scope.help_global'}}
+        {{else}}
+          {{t 'resources.storage-bucket.form.scope.help_org'}}
+        {{/if}}
+      </F.HelperText>
     </InfoField>
   {{/if}}
 

ui/admin/app/components/form/storage-bucket/index.js

@@ -5,10 +5,29 @@
 
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
 import { set } from '@ember/object';
 
 export default class FormStorageBucketComponent extends Component {
   // =actions
+  @service intl;
+
+  @tracked scopeFieldDescription = this.intl.t(
+    'resources.storage-bucket.form.scope.help'
+  );
+
+  updateScopeFieldDescription() {
+    if (this.args.model.scopeModel.isGlobal) {
+      this.scopeFieldDescription = this.intl.t(
+        'resources.storage-bucket.form.scope.help_global'
+      );
+    } else {
+      this.scopeFieldDescription = this.intl.t(
+        'resources.storage-bucket.form.scope.help_org'
+      );
+    }
+  }
 
   @action
   updateScope(event) {
@@ -17,6 +36,7 @@ export default class FormStorageBucketComponent extends Component {
       (element) => element.model.id === selectedScopeId
     ).model;
     this.args.model.scopeModel = selectedScopeModel;
+    this.updateScopeFieldDescription();
   }
 
   @action