aboutsummaryrefslogtreecommitdiff
path: root/modern/src/main/MainPage.js
diff options
context:
space:
mode:
Diffstat (limited to 'modern/src/main/MainPage.js')
-rw-r--r--modern/src/main/MainPage.js19
1 files changed, 13 insertions, 6 deletions
diff --git a/modern/src/main/MainPage.js b/modern/src/main/MainPage.js
index 27e2631f..50209568 100644
--- a/modern/src/main/MainPage.js
+++ b/modern/src/main/MainPage.js
@@ -1,7 +1,7 @@
import React, { useState, useEffect, useCallback } from 'react';
import { useNavigate } from 'react-router-dom';
import {
- Paper, Toolbar, TextField, IconButton, Button,
+ Paper, Toolbar, IconButton, Button, OutlinedInput, InputAdornment,
} from '@mui/material';
import makeStyles from '@mui/styles/makeStyles';
@@ -12,6 +12,7 @@ import AddIcon from '@mui/icons-material/Add';
import CloseIcon from '@mui/icons-material/Close';
import ArrowBackIcon from '@mui/icons-material/ArrowBack';
import ListIcon from '@mui/icons-material/ViewList';
+import TuneIcon from '@mui/icons-material/Tune';
import { useDispatch, useSelector } from 'react-redux';
import DevicesList from './DevicesList';
@@ -192,13 +193,19 @@ const MainPage = () => {
<ArrowBackIcon />
</IconButton>
)}
- <TextField
- fullWidth
- name="searchKeyword"
+ <OutlinedInput
+ placeholder={t('sharedSearchDevices')}
value={searchKeyword}
- autoComplete="searchKeyword"
onChange={(event) => setSearchKeyword(event.target.value)}
- placeholder={t('sharedSearchDevices')}
+ endAdornment={(
+ <InputAdornment position="end">
+ <IconButton size="small" onClick={() => {}}>
+ <TuneIcon fontSize="small" />
+ </IconButton>
+ </InputAdornment>
+ )}
+ size="small"
+ fullWidth
/>
<IconButton onClick={() => navigate('/settings/device')} disabled={deviceReadonly}>
<AddIcon />