@fleetbase/fleetops-engine 0.4.0 → 0.4.2

package/addon/components/modals/order-route-form.hbs

@@ -2,12 +2,12 @@
     <div class="modal-body-container">
         <div class="flex flex-row justify-between mb-6">
             <div class="flex">
-                <ShortToggle @isToggled={{@options.order.payload.isMultiDrop}} @onToggle={{@options.toggleMultiDropOrder}} @label="Toggle Multiple Dropoff's" />
+                <ShortToggle @isToggled={{@options.order.payload.isMultiDrop}} @onToggle={{@options.toggleMultiDropOrder}} @label={{t "fleet-ops.component.modals.order-route-form.toggle"}} />
             </div>
             <div class="flex flex-1 justify-end space-x-2">
                 {{#if @options.order.payload.isMultiDrop}}
-                    {{!-- <Button @type="magic" @icon="magic" @text="Optimize Route" @size="sm" @onClick={{fn @options.optimizeRoute}} @helpText="Fleetbase will automatically optimize the route." @disabled={{lt @options.order.payload.waypoints.length 3}} @isLoading={{@options.isOptimizingRoute}} /> --}}
-                    <Button @icon="map-marked-alt" @text="Add Waypoint" @size="sm" @onClick={{@options.addWaypoint}} @helpText="Use the `Add Waypoint` button to add more stops for this order. The Fleetbase routing engine will automatically optimize the route as each stop is added or removed." />
+                    {{!-- <Button @type="magic" @icon="magic" @text={{t "fleet-ops.component.modals.order-route-form.optimize"}} @size="sm" @onClick={{fn @options.optimizeRoute}} @helpText={{t "fleet-ops.component.modals.order-route-form.optimize-text"}} @disabled={{lt @options.order.payload.waypoints.length 3}} @isLoading={{@options.isOptimizingRoute}} /> --}}
+                    <Button @icon="map-marked-alt" @text={{t "fleet-ops.component.modals.order-route-form.add"}} @size="sm" @onClick={{@options.addWaypoint}} @helpText={{t "fleet-ops.component.modals.order-route-form.add-text"}} />
                 {{/if}}
             </div>
         </div>
@@ -24,13 +24,13 @@
                         </div>
 
                         <div class="flex-1 px-4">
-                            <ModelSelect @modelName="place" @selectedModel={{waypoint.place}} @placeholder={{concat "Select Waypoint " (add index 1)}} @triggerClass="form-select form-input truncate" @wrapperClass="w-96" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setWaypointPlace index}} as |model|>
+                            <ModelSelect @modelName="place" @selectedModel={{waypoint.place}} @placeholder={{concat (t "fleet-ops.component.modals.order-route-form.select-waypoint") (add index 1)}} @triggerClass="form-select form-input truncate" @wrapperClass="w-96" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setWaypointPlace index}} as |model|>
                                 {{model.address}}
                             </ModelSelect>
 
                             {{#if waypoint.place.hasInvalidCoordinates}}
                                 <div class="leading-5 text-sm text-red-400 mt-2">
-                                    <FaIcon @icon="exclamation-triangle" class="mr-1" /> Invalid coordinates!
+                                    <FaIcon @icon="exclamation-triangle" class="mr-1" /> {{t "fleet-ops.component.modals.order-route-form.invalid"}}
                                 </div>
                             {{/if}}
                         </div>
@@ -48,60 +48,60 @@
             <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-xs dark:text-gray-100">
                 <div class="input-group">
                     <div class="flex items-center justify-between">
-                        <label>Pickup</label>
+                        <label>{{t "fleet-ops.component.modals.order-route-form.pickup"}}</label>
 
                         {{#if @options.order.payload.pickup}}
-                            <a href="javascript:;" {{on "click" (fn @options.editPlace @options.order.payload.pickup)}}>Edit Address</a>
+                            <a href="javascript:;" {{on "click" (fn @options.editPlace @options.order.payload.pickup)}}>{{t "fleet-ops.component.modals.order-route-form.edit-address"}}</a>
                         {{/if}}
                     </div>
 
-                    <ModelSelect @modelName="place" @selectedModel={{@options.order.payload.pickup}} @placeholder="Select Pickup" @triggerClass="form-select form-input" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setPayloadPlace "pickup" }} as |model|>
+                    <ModelSelect @modelName="place" @selectedModel={{@options.order.payload.pickup}} @placeholder={{t "fleet-ops.component.modals.order-route-form.select-pickup"}} @triggerClass="form-select form-input" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setPayloadPlace "pickup" }} as |model|>
                         {{model.address}}
                     </ModelSelect>
 
                     {{#if @options.order.payload.pickup.hasInvalidCoordinates}}
                         <div class="leading-5 text-sm text-red-400 mt-2">
-                            <FaIcon @icon="exclamation-triangle" class="mr-1" /> Invalid coordinates!
+                            <FaIcon @icon="exclamation-triangle" class="mr-1" /> {{t "fleet-ops.component.modals.order-route-form.invalid"}}
                         </div>
                     {{/if}}
                 </div>
 
                 <div class="input-group">
                     <div class="flex items-center justify-between">
-                        <label>Dropoff</label>
+                        <label>{{t "fleet-ops.component.modals.order-route-form.dropoff"}}</label>
 
                         {{#if @options.order.payload.dropoff}}
-                            <a href="javascript:;" {{on "click" (fn @options.editPlace @options.order.payload.dropoff)}}>Edit Address</a>
+                            <a href="javascript:;" {{on "click" (fn @options.editPlace @options.order.payload.dropoff)}}>{{t "fleet-ops.component.modals.order-route-form.edit-address"}}</a>
                         {{/if}}
                     </div>
 
-                    <ModelSelect @modelName="place" @selectedModel={{@options.order.payload.dropoff}} @placeholder="Select Dropoff" @triggerClass="form-select form-input" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setPayloadPlace "dropoff" }} as |model|>
+                    <ModelSelect @modelName="place" @selectedModel={{@options.order.payload.dropoff}} @placeholder={{t "fleet-ops.component.modals.order-route-form.select-dropoff"}} @triggerClass="form-select form-input" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setPayloadPlace "dropoff" }} as |model|>
                         {{model.address}}
                     </ModelSelect>
 
                     {{#if @options.order.payload.dropoff.hasInvalidCoordinates}}
                         <div class="leading-5 text-sm text-red-400 mt-2">
-                            <FaIcon @icon="exclamation-triangle" class="mr-1" /> Invalid coordinates!
+                            <FaIcon @icon="exclamation-triangle" class="mr-1" /> {{t "fleet-ops.component.modals.order-route-form.invalid"}}
                         </div>
                     {{/if}}
                 </div>
 
                 <div class="input-group">
                     <div class="flex items-center justify-between">
-                        <label>Return</label>
+                        <label>{{t "fleet-ops.component.modals.order-route-form.return"}}</label>
 
                         {{#if @options.order.payload.return}}
-                            <a href="javascript:;" {{on "click" (fn @options.editPlace @options.order.payload.return)}}>Edit Address</a>
+                            <a href="javascript:;" {{on "click" (fn @options.editPlace @options.order.payload.return)}}>{{t "fleet-ops.component.modals.order-route-form.edit-address"}}</a>
                         {{/if}}
                     </div>
 
-                    <ModelSelect @modelName="place" @selectedModel={{@options.order.payload.return}} @placeholder="Select Return" @triggerClass="form-select form-input" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setPayloadPlace "return" }} as |model|>
+                    <ModelSelect @modelName="place" @selectedModel={{@options.order.payload.return}} @placeholder={{t "fleet-ops.component.modals.order-route-form.select-return"}} @triggerClass="form-select form-input" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=@options.userLatitude longitude=@options.userLongitude}} @renderInPlace={{true}} @onChange={{fn @options.setPayloadPlace "return" }} as |model|>
                         {{model.address}}
                     </ModelSelect>
 
                     {{#if @options.order.payload.return.hasInvalidCoordinates}}
                         <div class="leading-5 text-sm text-red-400 mt-2">
-                            <FaIcon @icon="exclamation-triangle" class="mr-1" /> Invalid coordinates!
+                            <FaIcon @icon="exclamation-triangle" class="mr-1" /> {{t "fleet-ops.component.modals.order-route-form.invalid"}}
                         </div>
                     {{/if}}
                 </div>

package/addon/components/modals/place-assign-vendor.hbs

@@ -1,11 +1,11 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
         <div class="grid grid-cols-1 gap-2 text-xs dark:text-gray-100">
-            <InputGroup @name="Select Vendor" @value={{@options.place.vendor_uuid}}>
+            <InputGroup @name={{t "fleet-ops.component.modals.place-assign-vendor.select-vendor"}} @value={{@options.place.vendor_uuid}}>
                 <ModelSelect
                     @modelName="vendor"
                     @selectedModel={{@options.place.vendor_uuid}}
-                    @placeholder="Select Vendor"
+                    @placeholder={{t "fleet-ops.component.modals.place-assign-vendor.select-vendor"}}
                     @triggerClass="form-select form-input"
                     @infiniteScroll={{false}}
                     @renderInPlace={{true}}

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

@@ -12,12 +12,12 @@
                 <div class="grid grid-cols-1 gap-2 text-xs dark:text-gray-100">
 
                     <div class="field-info-container">
-                        <div class="field-name">Name</div>
+                        <div class="field-name">{{t "fleet-ops.common.name"}}</div>
                         <div class="field-value">{{n-a @options.place.name}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">Street</div>
+                        <div class="field-name">{{t "fleet-ops.common.street"}}</div>
                         <div class="field-value">{{n-a @options.place.street1}}</div>
                     </div>
                 </div>
@@ -25,17 +25,17 @@
                 <div class="grid grid-cols-3 gap-2 text-xs dark:text-gray-100">
 
                     <div class="field-info-container">
-                        <div class="field-name">Neighborhood</div>
+                        <div class="field-name">{{t "fleet-ops.common.neighborhood"}}</div>
                         <div class="field-value">{{n-a @options.place.neighborhood}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">Building</div>
+                        <div class="field-name">{{t "fleet-ops.common.building"}}</div>
                         <div class="field-value">{{n-a @options.place.building}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">Security Access Code</div>
+                        <div class="field-name">{{t "fleet-ops.common.security-access-code"}}</div>
                         <div class="field-value">{{n-a @options.place.security_access_code}}</div>
                     </div>
                 </div>
@@ -43,17 +43,17 @@
                 <div class="grid grid-cols-3 gap-2 text-xs dark:text-gray-100">
 
                     <div class="field-info-container">
-                        <div class="field-name">City</div>
+                        <div class="field-name">{{t "fleet-ops.common.city"}}</div>
                         <div class="field-value">{{n-a @options.place.city}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">State</div>
+                        <div class="field-name">{{t "fleet-ops.common.state"}}</div>
                         <div class="field-value">{{n-a @options.place.province}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">Country</div>
+                        <div class="field-name">{{t "fleet-ops.common.country"}}</div>
                         <div class="field-value"><CountryName @country={{@options.place.country}} @showFlag={{true}} /></div>
                     </div>
                 </div>
@@ -61,17 +61,17 @@
                 <div class="grid grid-cols-3 gap-2 text-xs dark:text-gray-100">
 
                     <div class="field-info-container">
-                        <div class="field-name">Phone</div>
+                        <div class="field-name">{{t "fleet-ops.common.phone"}}</div>
                         <div class="field-value">{{n-a @options.place.phone}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">Email</div>
+                        <div class="field-name">{{t "fleet-ops.common.email"}}</div>
                         <div class="field-value">{{n-a @options.place.email}}</div>
                     </div>
 
                     <div class="field-info-container">
-                        <div class="field-name">Vendor</div>
+                        <div class="field-name">{{t "fleet-ops.common.vendor"}}</div>
                         <div class="field-value">
                             {{#if @options.place.vendor_uuid}}
                                 <a href="javascript:;" {{on "click" @options.viewVendor}}>
@@ -87,10 +87,10 @@
                 <div class="grid grid-cols-2 gap-2 text-xs dark:text-gray-100">
                     <div class="mb-5">
                         <label class="flex items-center mb-2 font-bold">
-                            Coordinates
+                            {{t "fleet-ops.common.coordinates"}}
                             <a href="javascript:;" class="block ml-3" {{on "click" @options.viewPlaceOnMap}}>
                                 <FaIcon @icon="map" class="mr-1" />
-                                View on map
+                                {{t "fleet-ops.component.modals.place-details.view"}}
                             </a>
                         </label>
                         <span class="block truncate">

package/addon/components/modals/place-form.hbs

@@ -1,30 +1,30 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
         <div class="grid grid-cols-3 gap-1 text-xs dark:text-gray-100">
-            <InputGroup @name="Name" @autocomplete="nope" @value={{@options.place.name}} @wrapperClass="col-span-3" />
-            <InputGroup @name="Street 1" @value={{@options.place.street1}} @wrapperClass="col-span-3">
-                <AutocompleteInput @value={{@options.place.street1}} @fetchUrl="places/lookup" @onSelect={{@options.autocomplete}} placeholder="Street 1" class="w-full" as |result|>
+            <InputGroup @name={{t "fleet-ops.common.name"}} @autocomplete="nope" @value={{@options.place.name}} @wrapperClass="col-span-3" />
+            <InputGroup @name={{t "fleet-ops.common.street-1"}} @value={{@options.place.street1}} @wrapperClass="col-span-3">
+                <AutocompleteInput @value={{@options.place.street1}} @fetchUrl="places/lookup" @onSelect={{@options.autocomplete}} placeholder={{t "fleet-ops.common.street-1"}} class="w-full" as |result|>
                     {{result.address}}
                 </AutocompleteInput>
             </InputGroup>
-            <InputGroup @name="Street 2" @autocomplete="nope" @value={{@options.place.street2}} @wrapperClass="col-span-3" />
-            <InputGroup @name="Neighborhood" @autocomplete="nope" @value={{@options.place.neighborhood}} />
-            <InputGroup @name="Building" @autocomplete="nope" @value={{@options.place.building}} />
-            <InputGroup @name="Security Access Code" @autocomplete="nope" @value={{@options.place.security_access_code}} />
-            <InputGroup @name="Postal Code" @autocomplete="nope" @value={{@options.place.postal_code}} />
-            <InputGroup @name="City" @autocomplete="nope" @value={{@options.place.city}} />
-            <InputGroup @name="State" @autocomplete="nope" @value={{@options.place.province}} />
-            <InputGroup @name="Country" @wrapperClass="col-span-2">
-                <CountrySelect class="w-full form-input form-select form-datalist" @value={{@options.place.country}} @onChange={{fn (mut @options.place.country)}} placeholder="Country" />
+            <InputGroup @name={{t "fleet-ops.common.street-2"}} @autocomplete="nope" @value={{@options.place.street2}} @wrapperClass="col-span-3" />
+            <InputGroup @name={{t "fleet-ops.common.neighborhood"}} @autocomplete="nope" @value={{@options.place.neighborhood}} />
+            <InputGroup @name={{t "fleet-ops.common.building"}} @autocomplete="nope" @value={{@options.place.building}} />
+            <InputGroup @name={{t "fleet-ops.common.security-access-code"}} @autocomplete="nope" @value={{@options.place.security_access_code}} />
+            <InputGroup @name={{t "fleet-ops.common.postal-code"}} @autocomplete="nope" @value={{@options.place.postal_code}} />
+            <InputGroup @name={{t "fleet-ops.common.city"}} @autocomplete="nope" @value={{@options.place.city}} />
+            <InputGroup @name={{t "fleet-ops.common.state"}} @autocomplete="nope" @value={{@options.place.province}} />
+            <InputGroup @name={{t "fleet-ops.common.country"}} @wrapperClass="col-span-2">
+                <CountrySelect class="w-full form-input form-select form-datalist" @value={{@options.place.country}} @onChange={{fn (mut @options.place.country)}} placeholder={{t "fleet-ops.common.country"}} />
             </InputGroup>
-            <InputGroup @name="Coordinates" @wrapperClass="col-span-2">
+            <InputGroup @name={{t "fleet-ops.common.coordinates"}} @wrapperClass="col-span-2">
                 <CoordinatesInput @value={{@options.place.location}} @onChange={{@options.updatePlaceCoordinates}} @onGeocode={{@options.autocomplete}} @onUpdatedFromMap={{@options.reverseGeocode}} @onInit={{@options.setCoordinatesInput}} />
             </InputGroup>
             <div class="col-span-1"></div>
-            <InputGroup @name="Phone">
+            <InputGroup @name={{t "fleet-ops.common.phone"}}>
                 <PhoneInput @value={{@options.place.phone}} @autocomplete="nope" @onInput={{fn (mut @options.place.phone)}} class="form-input w-full" />
             </InputGroup>
-            <InputGroup @name="Email" @autocomplete="nope" @value={{@options.place.email}} />
+            <InputGroup @name={{t "fleet-ops.common.email"}} @autocomplete="nope" @value={{@options.place.email}} />
         </div>
     </div>
 </Modal::Default>

package/addon/components/modals/policy-form.hbs

@@ -2,19 +2,19 @@
     <div class="modal-body-container" ...attributes>
         <div class="input-group">
             <label>
-                Policy Name
+                {{t "fleet-ops.component.modals.policy-form.name"}}
             </label>
-            <Input @value={{@options.policy.name}}  @type="text" class="w-full form-input" placeholder="Enter a name for your policy" />
+            <Input @value={{@options.policy.name}}  @type="text" class="w-full form-input" placeholder={{t "fleet-ops.component.modals.policy-form.name-text"}} />
         </div>
         <div class="input-group">
             <label>
-                Policy Description
+                {{t "fleet-ops.component.modals.policy-form.description"}}
             </label>
-            <Input @value={{@options.policy.description}}  @type="text" class="w-full form-input" placeholder="Enter a description for your policy" />
+            <Input @value={{@options.policy.description}}  @type="text" class="w-full form-input" placeholder={{t "fleet-ops.component.modals.policy-form.description-text"}} />
         </div>
         <div class="input-group">
             <label>
-               Select Permissions
+               {{t "fleet-ops.component.modals.policy-form.permissions"}}
             </label>
             <PermissionPicker @selected={{@options.policy.permissions}} @onChange={{fn (mut @options.policy.permissions)}} />
         </div>

package/addon/components/modals/role-form.hbs

@@ -2,13 +2,13 @@
     <div class="modal-body-container" ...attributes>
         <div class="input-group">
             <label>
-                Role Name
+                {{t "fleet-ops.component.modals.role-form.name"}}
             </label>
-            <Input @value={{@options.role.name}}  @type="text" class="w-full form-input" placeholder="Enter a name for this role" />
+            <Input @value={{@options.role.name}}  @type="text" class="w-full form-input" placeholder={{t "fleet-ops.component.modals.role-form.name-text"}} />
         </div>
         <div class="input-group">
             <label>
-               Select Permissions
+               {{t "fleet-ops.component.modals.role-form.permissions"}}
             </label>
             <PermissionPicker @selected={{@options.role.permissions}} @onChange={{fn (mut @options.role.permissions)}} />
         </div>

package/addon/components/modals/select-payment-method.hbs

@@ -4,7 +4,7 @@
             <a href="javascript:;" {{on "click" (fn @options.selectPaymentMethod paymentMethod)}} class="flex items-center justify-between px-3 py-2 shadow-sm rounded-md border border-gray-900 {{if (eq @options.selectedPaymentMethod.id paymentMethod.id) 'border-blue-500 shadow-outline-blue'}}">
                 <div class="flex items-center dark:text-gray-100">
                     <FaIcon @icon="cc-visa" class="mr-1" />
-                    <span class="mr-2">Card ending in {{paymentMethod.last4}}</span>
+                    <span class="mr-2">{{t "fleet-ops.component.modals.select-payment-method" htmlSafe=true method=@paymentMethod.last4}}</span>
                 </div>
             </a>
         {{/each}}

package/addon/components/modals/service-area-form.hbs

@@ -1,30 +1,30 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
-        <InputGroup @value={{@options.serviceArea.name}} @name="Service Area Name" @helpText="Set a display name for the service area." @required={{true}} />
-        <InputGroup @name="Service Area Type" @helpText="Select the type definition for this service area .">
+        <InputGroup @value={{@options.serviceArea.name}} @name={{t "fleet-ops.component.modals.service-area-form.name"}} @helpText={{t "fleet-ops.component.modals.service-area-form.name-text"}} @required={{true}} />
+        <InputGroup @name={{t "fleet-ops.component.modals.service-area-form.type"}} @helpText={{t "fleet-ops.component.modals.service-area-form.type-text"}}>
             <Select
                 @options={{@options.serviceAreaTypes}}
                 @value={{@options.serviceArea.type}}
                 @onSelect={{fn (mut @options.serviceArea.type)}}
-                @placeholder="Select service area type..."
+                @placeholder={{t "fleet-ops.component.modals.service-area-form.select-type"}}
                 class="w-full"
             />
         </InputGroup>
         <InputGroup
             @type="color"
             @value={{@options.serviceArea.stroke_color}}
-            @name="Service Area Border Color"
-            @helpText="Customize the border color for this service area."
+            @name={{t "fleet-ops.component.modals.service-area-form.border-color"}}
+            @helpText={{t "fleet-ops.component.modals.service-area-form.customize-border-color"}}
             class="p-0 border-0 m-0 w-8 h-8 bg-transparent rounded-none"
         />
         <InputGroup
             @type="color"
             @value={{@options.serviceArea.color}}
-            @name="Service Area Color"
-            @helpText="Customize the fill color for this service area."
+            @name={{t "fleet-ops.component.modals.service-area-form.area-color"}}
+            @helpText={{t "fleet-ops.component.modals.service-area-form.customize-area-color"}}
             class="p-0 border-0 m-0 w-8 h-8 bg-transparent rounded-none"
         />
-        <InputGroup @name="Service Area Country" @helpText="Optionally set the country in which this service area is located or based in.">
+        <InputGroup @name={{t "fleet-ops.component.modals.service-area-form.country"}} @helpText={{t "fleet-ops.component.modals.service-area-form.country-text"}}>
             <CountrySelect class="w-full form-input" @value={{@options.serviceArea.country}} @onChange={{fn (mut @options.serviceArea.country)}} />
         </InputGroup>
     </div>

package/addon/components/modals/set-password.hbs

@@ -5,11 +5,11 @@
                 <FaIcon @icon="info-circle" class="text-blue-900 mr-4" />
             </div>
             <p class="flex-1 text-sm text-blue-900 dark:text-blue-900">
-                Welcome to Fleetbase! Before you get started, set a new password to continue below.
+                {{t "fleet-ops.component.modals.set-password.message"}}
             </p>
         </div>
 
-        <InputGroup @name="New Password" @value={{@options.password}} @type="password" @inputClass="form-input-lg" @helpText="Enter a password at-least 8 characters to continue." />
-        <InputGroup @name="Confirm Password" @value={{@options.password_confirmation}} @type="password" @inputClass="form-input-lg" @helpText="Enter a password at-least 8 characters to continue." />
+        <InputGroup @name={{t "fleet-ops.component.modals.set-password.new-password"}} @value={{@options.password}} @type="password" @inputClass="form-input-lg" @helpText={{t "fleet-ops.component.modals.set-password.help-text"}} />
+        <InputGroup @name={{t "fleet-ops.component.modals.set-password.confirm-password"}} @value={{@options.password_confirmation}} @type="password" @inputClass="form-input-lg" @helpText={{t "fleet-ops.component.modals.set-password.help-text"}} />
     </div>
 </Modal::Default>

package/addon/components/modals/uninstall-prompt.hbs

@@ -7,9 +7,8 @@
                 </div>
             </div>
             <div class="flex-1 dark:text-gray-100">
-                <p class="text-base mb-2">You are attempting to uninstall the extension "{{or @options.extensionName}}".
-                    Are you sure you wish to proceed with this uninstallation?</p>
-                <small>All configuration and customized settings will be lost.</small>
+                <p class="text-base mb-2">{{t "fleet-ops.component.modals.uninstall-prompt.message" htmlSafe=true options=@options.extensionName}}</p>
+                <small>{{t "fleet-ops.component.modals.uninstall-prompt.sub-message"}}</small>
             </div>
         </div>
         {{#if @options.isUninstalling}}

package/addon/components/modals/user-form.hbs

@@ -8,12 +8,12 @@
                         {{#if queue.files.length}}
                             <Spinner class="mr-1" />
                             <span>
-                                Uploading...
+                                {{t "fleet-ops.common.uploading"}}
                             </span>
                         {{else}}
                             <FaIcon @icon="image" class="mr-1" />
                             <span>
-                                Upload new
+                                {{t "fleet-ops.common.upload-new"}}
                             </span>
                         {{/if}}
                     </a>
@@ -23,30 +23,30 @@
                 <div class="grid grid-cols-2 gap-3 text-xs dark:text-gray-100">
                     <div class="input-group">
                         <label>
-                            Name
+                            {{t "fleet-ops.common.name"}}
                         </label>
-                        <Input @value={{@options.user.name}}  @type="text" class="w-full form-input" placeholder="Name" />
+                        <Input @value={{@options.user.name}}  @type="text" class="w-full form-input" placeholder={{t "fleet-ops.common.name"}} />
                     </div>
 
                     <div class="input-group">
                         <label>
-                            Email
+                            {{t "fleet-ops.common.email"}}
                         </label>
-                        <Input @value={{@options.user.email}}  @type="text" class="w-full form-input" placeholder="Email" />
+                        <Input @value={{@options.user.email}}  @type="text" class="w-full form-input" placeholder={{t "fleet-ops.common.email"}} />
                     </div>
 
                     <div class="input-group">
                         <label>
-                            Phone
+                            {{t "fleet-ops.common.phone"}}
                         </label>
                         <PhoneInput @value={{@options.user.phone}} @onInput={{fn (mut @options.user.phone)}} class="form-input w-full" />
                     </div>
 
                     <div class="input-group">
                         <label>
-                            Country
+                            {{t "fleet-ops.common.country"}}
                         </label>
-                        <CountrySelect class="w-full form-input form-select form-datalist" @value={{@options.user.country}} @onChange={{fn (mut @options.user.country)}} placeholder="Country" />
+                        <CountrySelect class="w-full form-input form-select form-datalist" @value={{@options.user.country}} @onChange={{fn (mut @options.user.country)}} placeholder={{t "fleet-ops.common.country"}} />
                     </div>
                 </div>
             </div>