DRY'ed up most Edit buttons with UiEditButton component. (#2159)

burningmantech · Jan 19, 2025 · 9d6d4f8 · 9d6d4f8
1 parent d4d4aaf
commit 9d6d4f8
Show file tree

Hide file tree

Showing 33 changed files with 95 additions and 146 deletions.
diff --git a/app/components/editable-section.hbs b/app/components/editable-section.hbs
@@ -4,13 +4,9 @@
   </:title>
   <:actions>
     {{#if this.isEditing}}
-      <UiButton @onClick={{this.cancelEdit}} @type="gray" @size="sm" class="btn-link">
-        Cancel
-      </UiButton>
+      <UiCancelButton @onClick={{this.cancelEdit}} @type="gray" @size="sm"/>
     {{else}}
-      <UiButton @onClick={{this.editAction}} @type="secondary" @size="sm">
-        {{fa-icon "edit" right=1}} Edit
-      </UiButton>
+      <UiEditButton @onClick={{this.editAction}} @type="secondary" @size="sm"/>
     {{/if}}
   </:actions>
   <:body>

diff --git a/app/components/me/personal-vehicle-table.hbs b/app/components/me/personal-vehicle-table.hbs
@@ -25,11 +25,9 @@
           <b>{{fa-icon "hourglass-half"}} The request is awaiting review.</b>
         </p>
         <p>
-          <UiButton @onClick={{fn @editAction vehicle}}>
-            {{fa-icon "edit"}} Edit Request
-          </UiButton>
+          <UiEditButton @onClick={{fn @editAction vehicle}} />
           <UiButton @type="gray" @onClick={{fn @deleteAction vehicle}} class="btn-link">
-            {{fa-icon "trash"}} Delete Request
+            {{fa-icon "trash"}} Delete
           </UiButton>
         </p>
       {{else if vehicle.isApproved}}

diff --git a/app/components/person/fka-manage.hbs b/app/components/person/fka-manage.hbs
@@ -36,9 +36,7 @@
           <tr>
             <td>{{row.fka}}</td>
             <td>
-              <UiButton @onClick={{fn this.editFka row}} @type="secondary" @size="sm">
-                {{fa-icon "edit" right=1}} Edit
-              </UiButton>
+              <UiEditButton @onClick={{fn this.editFka row}} @type="secondary" @size="sm"/>
               <UiButton @onClick={{fn this.deleteFka row}} @type="secondary" @size="sm" class="ms-2">
                 {{fa-icon "trash" right=1}} Delete
               </UiButton>

diff --git a/app/components/person/pogs.hbs b/app/components/person/pogs.hbs
@@ -23,7 +23,7 @@ Showing {{pluralize @personPogs.length "pog"}}
       <td>{{shift-format pog.issued_at year=true}}</td>
       <td>{{pog.issued_by.callsign}}</td>
       <td>
-        <UiButton @onClick={{fn this.editEntry pog}} @size="sm">{{fa-icon "edit"}} Edit</UiButton>
+        <UiEditButton @onClick={{fn this.editEntry pog}} @size="sm" />
       </td>
     </tr>
   {{else}}

diff --git a/app/components/person/timesheet-manage.hbs b/app/components/person/timesheet-manage.hbs
@@ -127,9 +127,9 @@
                         @onClick={{fn this.editEntryAction ts}}
                         @disabled={{ts.isReloading}}>
                 {{#if this.canManageTimesheets}}
-                  {{fa-icon "edit"}} {{if ts.isPending "Review" "Edit"}}
+                  {{fa-icon "edit" right=1}} {{if ts.isPending "Review" "Edit"}}
                 {{else}}
-                  {{fa-icon "magnifying-glass"}} View
+                  {{fa-icon "magnifying-glass" right=1}} View
                 {{/if}}
               </UiButton>
             {{/if}}

diff --git a/app/components/person/timesheet-missing.hbs b/app/components/person/timesheet-missing.hbs
@@ -43,33 +43,31 @@
             <td>{{tm.position.title}}</td>
             <td class="text-center">
               {{#if tm.isPending}}
-                <UiBadge @text="Review Needed" @type="danger" />
+                <UiBadge @text="Review Needed" @type="danger"/>
               {{else if tm.isRejected}}
-                <UiBadge @text="Request Rejected" @type="warning" />
+                <UiBadge @text="Request Rejected" @type="warning"/>
               {{else if tm.isApproved}}
-                <UiBadge @text="Approved" @type="success" />
+                <UiBadge @text="Approved" @type="success"/>
               {{else}}
                 [Unknown {{tm.status}}]
               {{/if}}
             </td>
             <td>
               {{#if this.hasTimesheetManagement}}
-                <UiButton @size="sm"
-                          @type={{if tm.isPending "danger" "primary"}}
-                          @onClick={{fn this.editEntryAction tm}}
-                          @disabled={{tm.isReloading}}>
+                <UiEditButton @size="sm"
+                              @type={{if tm.isPending "danger" "primary"}}
+                              @onClick={{fn this.editEntryAction tm}}
+                              @disabled={{tm.isReloading}}>
+                  {{if tm.isPending "Review" "Edit"}}
                   {{#if tm.isReloading}}
                     <SpinIcon/>
-                  {{else}}
-                    {{fa-icon "edit"}}
                   {{/if}}
-                  {{if tm.isPending "Review" "Edit"}}
-                </UiButton>
+                </UiEditButton>
               {{else}}
                 <UiButton @size="sm" @type="primary"
                           @onClick={{fn this.viewEntryAction tm}}
                           @disabled={{tm.isReloading}}>
-                  {{fa-icon "magnifying-glass"}} View
+                  {{fa-icon "magnifying-glass" right=1}} View
                 </UiButton>
               {{/if}}
             </td>

diff --git a/app/components/photo-table.hbs b/app/components/photo-table.hbs
@@ -97,12 +97,10 @@
               {{fa-icon "trash" right=1}} Delete
             </UiButton>
             {{#if photo.is_active}}
-              <UiButton @type="secondary"
-                        @size="sm"
-                        @disabled={{photo.isSaving}}
-                        @onClick={{fn this.editPhotoAction photo}}>
-                {{fa-icon "edit" right=1}} Edit
-              </UiButton>
+              <UiEditButton @type="secondary"
+                            @size="sm"
+                            @disabled={{photo.isSaving}}
+                            @onClick={{fn this.editPhotoAction photo}} />
               {{#if (not-eq photo.status "rejected")}}
                 <UiButton @type="danger"
                           @size="sm"

diff --git a/app/components/position-table.hbs b/app/components/position-table.hbs
@@ -98,9 +98,7 @@
         {{/if}}
       </td>
       <td>
-        <UiButton @size="sm" @onClick={{fn @editAction position}}>
-          {{fa-icon "edit"}} Edit
-        </UiButton>
+        <UiEditButton @size="sm" @onClick={{fn @editAction position}}/>
       </td>
     </tr>
   {{else}}

diff --git a/app/components/swag-table.hbs b/app/components/swag-table.hbs
@@ -39,9 +39,7 @@ Showing {{pluralize @swags.length "item"}}
         {{/if}}
       </td>
       <td>
-        <UiButton @size="sm" @onClick={{fn @editAction swag}}>
-          {{fa-icon "edit"}} Edit
-        </UiButton>
+        <UiEditButton @size="sm" @onClick={{fn @editAction swag}} />
       </td>
     </tr>
   {{else}}

diff --git a/app/components/ui-button.hbs b/app/components/ui-button.hbs
@@ -1 +1 @@
-<button type="button" class="btn {{this.typeClass}} {{this.sizeClass}} {{@class}}" disabled={{@disabled}} {{on "click" this.clickAction}} ...attributes>{{yield}}</button>
+<button type="button" class="btn {{this.typeClass}} {{this.sizeClass}} {{@class}}" disabled={{@disabled}} {{on-click this.clickAction}} ...attributes>{{yield}}</button>
diff --git a/app/components/ui-edit-button.hbs b/app/components/ui-edit-button.hbs
@@ -0,0 +1,7 @@
+<button type="button"
+        class="btn btn-{{or @type "primary"}} {{if @size (concat "btn-" @size)}}"
+        ...attributes
+  {{on-click @onClick}}
+>
+  {{fa-icon "edit" right=1}} {{#if (has-block)}}{{yield}}{{else}}Edit{{/if}}
+</button>
diff --git a/app/templates/admin/alerts.hbs b/app/templates/admin/alerts.hbs
@@ -28,16 +28,14 @@
         <td>{{alert.title}}<br>{{alert.description}}</td>
         <td class="no-wrap">
           {{#if alert.on_playa}}
-            <UiBadge @text="on playa" @type="secondary" />
+            <UiBadge @text="on playa" @type="secondary"/>
           {{else}}
             -
           {{/if}}
         </td>
         {{#if this.canManageAlerts}}
           <td class="no-wrap">
-            <UiButton @size="sm" @onClick={{fn this.editAlert alert}}>
-              {{fa-icon "edit"}} Edit
-            </UiButton>
+            <UiEditButton @size="sm" @onClick={{fn this.editAlert alert}} />
           </td>
         {{/if}}
       </tr>

diff --git a/app/templates/admin/awards.hbs b/app/templates/admin/awards.hbs
@@ -28,9 +28,7 @@
           {{nl2br award.description}}
         </td>
         <td>
-          <UiButton @size="sm" @onClick={{fn this.editAward award}}>
-            {{fa-icon "edit"}} Edit
-          </UiButton>
+          <UiEditButton @size="sm" @onClick={{fn this.editAward award}} />
         </td>
       </tr>
     {{else}}

diff --git a/app/templates/admin/certifications.hbs b/app/templates/admin/certifications.hbs
@@ -39,9 +39,7 @@
           {{/if}}
         </td>
         <td>
-          <UiButton @type="secondary" @size="sm" @onClick={{fn this.editCertificationAction certification}}>
-            {{fa-icon "edit"}} Edit
-          </UiButton>
+          <UiEditButton @type="secondary" @size="sm" @onClick={{fn this.editCertificationAction certification}} />
         </td>
       </tr>
     {{else}}

diff --git a/app/templates/admin/documents.hbs b/app/templates/admin/documents.hbs
@@ -82,9 +82,7 @@
             <PersonLink @person={{doc.person_update}} />
           </td>
           <td>
-            <UiButton @size="sm" @onClick={{fn this.editAction doc}}>
-              {{fa-icon "edit"}}Edit
-            </UiButton>
+            <UiEditButton @size="sm" @onClick={{fn this.editAction doc}} />
           </td>
         </tr>
       {{else}}

diff --git a/app/templates/admin/handle-reservations.hbs b/app/templates/admin/handle-reservations.hbs
@@ -70,9 +70,7 @@
               <PresentOrNot @value={{hr.reason}} @empty="-"/>
             </td>
             <td>
-              <UiButton @onClick={{fn this.editHandleReservation hr}} @size="sm">
-                {{fa-icon "edit"}} Edit
-              </UiButton>
+              <UiEditButton @onClick={{fn this.editHandleReservation hr}} @size="sm"/>
             </td>
           </tr>
         {{else}}

diff --git a/app/templates/admin/help.hbs b/app/templates/admin/help.hbs
@@ -33,9 +33,7 @@
         </td>
         <td>{{document.tags}}</td>
         <td>
-          <UiButton @type="secondary" @size="sm" @onClick={{fn this.editHelp document}}>
-            {{fa-icon "edit"}} Edit
-          </UiButton>
+          <UiEditButton @type="secondary" @size="sm" @onClick={{fn this.editHelp document}} />
         </td>
       </tr>
     {{/each}}

diff --git a/app/templates/admin/oauth-client.hbs b/app/templates/admin/oauth-client.hbs
@@ -25,9 +25,7 @@
         <td>{{client.description}}</td>
         <td>{{client.secret}}</td>
         <td>
-          <UiButton @onClick={{fn this.editEntry client}} @size="sm">
-            {{fa-icon "edit" right=1}} Edit
-          </UiButton>
+          <UiEditButton @onClick={{fn this.editEntry client}} @size="sm"/>
         </td>
       </tr>
     {{/each}}

diff --git a/app/templates/admin/online-course.hbs b/app/templates/admin/online-course.hbs
@@ -38,14 +38,12 @@
         </td>
         <td>
           <UiButton @type="secondary" @onClick={{fn this.setName course}} @size="sm">
-            {{fa-icon "rotate"}} Set Name From LMS
+            {{fa-icon "rotate" right=1}} Set Name From LMS
           </UiButton>
           <UiButton @type="secondary" @onClick={{fn this.retrieveEnrollment course}} @size="sm">
-            {{fa-icon "list"}} Moodle Enrollment
-          </UiButton>
-          <UiButton @type="primary" @onClick={{fn this.editEntry course}} @size="sm">
-            {{fa-icon "edit"}} Edit
+            {{fa-icon "list" right=1}} Moodle Enrollment
           </UiButton>
+          <UiEditButton @onClick={{fn this.editEntry course}} @size="sm"/>
         </td>
       </tr>
     {{/each}}

diff --git a/app/templates/admin/permissions.hbs b/app/templates/admin/permissions.hbs
@@ -42,9 +42,7 @@
         </td>
         {{#if this.canManageRoles}}
           <td>
-            <UiButton @size="sm" @onClick={{fn this.editRole role}}>
-              {{fa-icon "edit"}} Edit
-            </UiButton>
+            <UiEditButton @size="sm" @onClick={{fn this.editRole role}} />
           </td>
         {{/if}}
       </tr>

diff --git a/app/templates/admin/settings.hbs b/app/templates/admin/settings.hbs
@@ -47,12 +47,10 @@
           {{/if}}
         </td>
         <td>
-          <UiButton @type="secondary"
-                    @size="sm"
-                    @disabled={{and setting.is_credential (not this.isTechNinja)}}
-                    @onClick={{fn this.edit setting}}>
-            {{fa-icon "edit"}} Edit
-          </UiButton>
+          <UiEditButton @type="secondary"
+                        @size="sm"
+                        @disabled={{and setting.is_credential (not this.isTechNinja)}}
+                        @onClick={{fn this.edit setting}} />
         </td>
       </tr>
     {{/each}}

diff --git a/app/templates/admin/teams.hbs b/app/templates/admin/teams.hbs
@@ -82,9 +82,7 @@
           {{/if}}
         </td>
         <td>
-          <UiButton @onClick={{fn this.editTeam team}} @size="sm">
-            {{fa-icon "edit" right=1}} Edit
-          </UiButton>
+          <UiEditButton @onClick={{fn this.editTeam team}} @size="sm"/>
         </td>
       </tr>
     {{else}}

diff --git a/app/templates/ops/assets.hbs b/app/templates/ops/assets.hbs
@@ -113,9 +113,7 @@
                 <UiButton @type="secondary" @size="sm" @onClick={{fn this.assetHistoryAction asset}}>
                   {{fa-icon "rectangle-list" right=1}} History
                 </UiButton>
-                <UiButton @size="sm" @onClick={{fn this.editAsset asset}}>
-                  {{fa-icon "edit" right=1}} Edit
-                </UiButton>
+                <UiEditButton @size="sm" @onClick={{fn this.editAsset asset}} />
               </td>
             </tr>
           {{else if this.assets}}

diff --git a/app/templates/ops/credits.hbs b/app/templates/ops/credits.hbs
@@ -82,9 +82,7 @@
                       <UiButton @onClick={{fn this.deleteCredit credit}} @type="danger" @size="sm">
                         {{fa-icon "trash-alt" type="s" right=1}} Delete
                       </UiButton>
-                      <UiButton @onClick={{fn this.editCredit credit}} @size="sm">
-                        {{fa-icon "edit" right=1}} Edit
-                      </UiButton>
+                      <UiEditButton @onClick={{fn this.editCredit credit}} @size="sm"/>
                     </UiButtonRow>
                   </td>
                 </tr>

diff --git a/app/templates/ops/event-dates.hbs b/app/templates/ops/event-dates.hbs
@@ -41,9 +41,7 @@
         <td>{{shift-format ed.pre_event_slot_end}}</td>
         <td>
           {{#if this.canEditRecords}}
-            <UiButton @size="sm" @onClick={{fn this.edit ed}}>
-              {{fa-icon "edit"}}Edit
-            </UiButton>
+            <UiEditButton @size="sm" @onClick={{fn this.edit ed}} />
           {{else}}
             -
           {{/if}}

diff --git a/app/templates/ops/motd.hbs b/app/templates/ops/motd.hbs
@@ -78,9 +78,7 @@
           {{motd.subject}}
         </td>
         <td>
-          <UiButton @size="sm" @onClick={{fn this.editEntry motd}}>
-            {{fa-icon "edit"}}Edit
-          </UiButton>
+          <UiEditButton @size="sm" @onClick={{fn this.editEntry motd}} />
         </td>
       </tr>
     {{else}}

diff --git a/app/templates/ops/slots.hbs b/app/templates/ops/slots.hbs
@@ -145,9 +145,7 @@
                       <UiButton @type="danger" @size="sm" @onClick={{fn this.deleteSlot slot}}>
                         {{fa-icon "trash-alt"type="fas"}} Delete
                       </UiButton>
-                      <UiButton @onClick={{fn this.editSlot slot}} @size="sm">
-                        {{fa-icon "edit"}} Edit
-                      </UiButton>
+                      <UiEditButton @onClick={{fn this.editSlot slot}} @size="sm"/>
                     </UiButtonRow>
                   </td>
                 </tr>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<button type="button" class="btn {{this.typeClass}} {{this.sizeClass}} {{@class}}" disabled={{@disabled}} {{on "click" this.clickAction}} ...attributes>{{yield}}</button>
		<button type="button" class="btn {{this.typeClass}} {{this.sizeClass}} {{@class}}" disabled={{@disabled}} {{on-click this.clickAction}} ...attributes>{{yield}}</button>