feat: added plus icon to device select configuration and localization

sigp · Jul 3, 2023 · 9813d99 · 9813d99
1 parent 78000f2
commit 9813d99
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/src/locales/translations/en-US.json b/src/locales/translations/en-US.json
@@ -426,6 +426,8 @@
   "deviceSelect": {
     "label": "Select Device",
     "confirmText": "Are you sure you want to remove <0>{{target}}</0> device?",
-    "confirmCta": "Remove Device"
+    "confirmCta": "Remove Device",
+    "addDevice": "Add Device",
+    "selectDevice": "Select stored device"
   }
 }
diff --git a/src/views/Onboard/views/ConfigureConnection.tsx b/src/views/Onboard/views/ConfigureConnection.tsx
@@ -135,11 +135,14 @@ const ConfigureConnection = () => {
                       <div onClick={toggleDeviceInput}>
                         <Typography
                           color='text-primaryBright'
-                          className='cursor-pointer'
+                          className='cursor-pointer flex items-center'
                           isBold
                           type='text-caption2'
                         >
-                          {isAddDevice ? 'Add Device' : 'Select stored device'}
+                          {isAddDevice && (
+                            <span className='text-caption1 bi bi-plus-circle text-primaryBright mr-2' />
+                          )}{' '}
+                          {t(`deviceSelect.${isAddDevice ? 'addDevice' : 'selectDevice'}`)}
                         </Typography>
                       </div>
                     )}