fix: translate text select device

src/layouts/Header/Header.tsx

@@ -94,6 +94,7 @@ const Header: React.FC = () => {
             disabled={!devices.length}
             style={{ width: "220px" }}
             className="header__device-select"
+            placeholder={t("common.selectDevice")}
           />
         </div>
       </div>

src/layouts/SectionHeader/SectionHeader.tsx

@@ -9,6 +9,7 @@ import {
 import CDeviceSelect from "../../components/CDeviceSelect";
 import { setSelectedDevice } from "../../stores/slices/deviceSlice";
 import { BiArrowBack } from "react-icons/bi";
+import { useTranslation } from "react-i18next";
 
 interface SectionHeaderProps {
   to?: string;
@@ -20,6 +21,7 @@ const SectionHeader: React.FC<SectionHeaderProps> = ({ to }) => {
   );
   const dispatch = useAppDispatch();
   const navigate = useNavigate();
+  const { t } = useTranslation();
 
   const handleNavigate = (e: React.MouseEvent) => {
     if (!to) {
@@ -35,7 +37,7 @@ const SectionHeader: React.FC<SectionHeaderProps> = ({ to }) => {
         onClick={handleNavigate}
         className="sectionheader__link"
       >
-        <BiArrowBack className="sectionheader__link__icon"/>
+        <BiArrowBack className="sectionheader__link__icon" />
       </Link>
 
       <CDeviceSelect
@@ -45,6 +47,7 @@ const SectionHeader: React.FC<SectionHeaderProps> = ({ to }) => {
         disabled={!devices.length}
         style={{ width: "220px" }}
         className="header__device-select"
+        placeholder={t("common.selectDevice")}
       />
     </div>
   );

src/locales/en/en.json

@@ -12,7 +12,8 @@
     "to": "To",
     "confirm": "Confirm",
     "password": "Password",
-    "passwordPlaceholder": "Enter your password"
+    "passwordPlaceholder": "Enter your password",
+    "selectDevice": "Select Device"
   },
   "auth": {
     "entrance": "Sign In",

src/locales/ru/ru.json

@@ -12,7 +12,8 @@
     "to": "До",
     "confirm": "Подтвердить",
     "password": "Пароль",
-    "passwordPlaceholder": "Введите ваш пароль"
+    "passwordPlaceholder": "Введите ваш пароль",
+    "selectDevice": "Выбрать устройство"
   },
   "auth": {
     "entrance": "Вход",

src/stores/slices/deviceSlice.ts

@@ -17,7 +17,7 @@ interface IDeviceState {
   selectedDevice: IDevice | null;
   loadingDevices: boolean;
   errorDevices: string;
-  isFetched: boolean
+  isFetched: boolean;
 }
 
 const initialState: IDeviceState = {
@@ -26,7 +26,7 @@ const initialState: IDeviceState = {
   selectedDevice: null,
   loadingDevices: false,
   errorDevices: "",
-  isFetched: false
+  isFetched: false,
 };
 
 export const fetchDevices = createAsyncThunk(
@@ -83,18 +83,18 @@ const deviceSlice = createSlice({
     builder
       .addCase(fetchDevices.pending, (state) => {
         state.loadingDevices = true;
-        state.isFetched = false; 
+        state.isFetched = false;
       })
       .addCase(fetchDevices.fulfilled, (state, action) => {
         state.loadingDevices = false;
         state.devices = action.payload;
         state.selectedDevice = action.payload[0] ?? null;
-        state.isFetched = true; 
+        state.isFetched = true;
       })
       .addCase(fetchDevices.rejected, (state, action) => {
         state.loadingDevices = false;
         state.errorDevices = action.payload as string;
-         state.isFetched = false;
+        state.isFetched = false;
       })
 
       .addCase(fetchDeviceData.fulfilled, (state, action) => {