From c0b590dad23c12d7ad6d6936fd67240216892b7f Mon Sep 17 00:00:00 2001
From: Devon Anderson <devon.anderson@hashicorp.com>
Date: Wed, 7 Jun 2023 18:04:18 -0400
Subject: [PATCH] =?UTF-8?q?refactor:=20=F0=9F=92=A1=20Refactor=20default?=
 =?UTF-8?q?=20option=20in=20scope=20field=20and=20desc=20(#328)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 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 |  4 +++-
 .../components/form/storage-bucket/index.hbs  | 20 +++++++++++--------
 .../components/form/storage-bucket/index.js   | 20 +++++++++++++++++++
 3 files changed, 35 insertions(+), 9 deletions(-)

diff --git a/addons/core/translations/resources/en-us.yaml b/addons/core/translations/resources/en-us.yaml
index 907903983..db9086208 100644
--- a/addons/core/translations/resources/en-us.yaml
+++ b/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.
diff --git a/ui/admin/app/components/form/storage-bucket/index.hbs b/ui/admin/app/components/form/storage-bucket/index.hbs
index 1cc2f6d3f..d8a9eadfd 100644
--- a/ui/admin/app/components/form/storage-bucket/index.hbs
+++ b/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}}
 
diff --git a/ui/admin/app/components/form/storage-bucket/index.js b/ui/admin/app/components/form/storage-bucket/index.js
index 5f8555785..a8a7a4d97 100644
--- a/ui/admin/app/components/form/storage-bucket/index.js
+++ b/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