From bbb5acb67c0de3009a85bd3c56d1d55972850d5f Mon Sep 17 00:00:00 2001
From: Sonika <kumari.sonika@seryfertsoft.com>
Date: Wed, 10 Jan 2024 10:49:04 +0530
Subject: [PATCH] active select

---
 src/components/admin/Admin.tsx                |  2 +-
 .../intranet_users/IntranetUsers.tsx          | 51 +++++++++++++++----
 src/components/manage_users/ManageUsers.tsx   | 49 +++++++++++++++---
 3 files changed, 84 insertions(+), 18 deletions(-)

diff --git a/src/components/admin/Admin.tsx b/src/components/admin/Admin.tsx
index bff68d8..eaf0e4f 100644
--- a/src/components/admin/Admin.tsx
+++ b/src/components/admin/Admin.tsx
@@ -15,7 +15,7 @@ export default function Admin(){
             <Paper  className='projectScreen-background' sx={{ margin:'1%', width: '100%', overflow: 'hidden' }}>
               
                     <Paper style={{  padding: '20px',  backgroundColor: "#181817", color: 'white', display:'flex',flexDirection:'row' }}>
-                    <CloudUploadIcon />
+                        <CloudUploadIcon />
                     <input type="file" multiple onChange={handleFileUpload} />
                     <ul>
                         {files.map((file:any, index:number) => (
diff --git a/src/components/intranet_users/IntranetUsers.tsx b/src/components/intranet_users/IntranetUsers.tsx
index 27628ac..2fe7da1 100644
--- a/src/components/intranet_users/IntranetUsers.tsx
+++ b/src/components/intranet_users/IntranetUsers.tsx
@@ -20,6 +20,9 @@ import {
   Grid,
   InputAdornment,
   Box,
+  Select,
+  MenuItem,
+  InputLabel,
 } from '@mui/material';
 import EditIcon from '@mui/icons-material/Edit';
 import AddIcon from '@mui/icons-material/Add';
@@ -49,6 +52,31 @@ const StyledTextField = (props:any) => (
     />
   );
 
+  const StyledSelect = (props: any) => (
+    <div>
+      <InputLabel htmlFor={props.name} sx={{ color: 'white', fontSize:13 }}>
+        {props.label}
+      </InputLabel>
+      <Select
+        variant="standard"
+        margin="dense"
+        fullWidth
+        {...props}
+        sx={{
+          color: 'white',
+          '& .MuiInputBase-input': { color: 'white' },
+          '& .MuiInput-underline:after': { borderBottomColor: 'white' },
+          '& .MuiOutlinedInput-root': {
+            '& fieldset': { borderColor: 'white' },
+            '&:hover fieldset': { borderColor: 'white', borderWidth: 2 },
+          },
+          ...props.sx,
+        }}
+      >
+        {props.children}
+      </Select>
+    </div>
+  );
   interface Row {
     username: string;
     role: string;
@@ -233,7 +261,7 @@ export default function IntranetUsers(){
                 />
                 <Dialog  open={open} onClose={handleClose}>
                     <DialogTitle sx={{bgcolor:'rgb(24 24 23)', color:'white'}}>{selectedRow && selectedRow.id ? 'Edit Row' : 'Add New Row'}</DialogTitle>
-                    <DialogContent sx={{ bgcolor: 'rgb(24 24 23)' }}>
+                    <DialogContent sx={{ bgcolor: 'rgb(24 24 23)' }} className="dialog-class">
                         <StyledTextField
                         label="Name"
                         type="text"
@@ -247,14 +275,19 @@ export default function IntranetUsers(){
                         value={selectedRow && selectedRow.role}
                         onChange={handleChange}
                         />
-                        <StyledTextField
-                        label="Active"
-                        name="active"
-                        value={selectedRow && selectedRow.active}
-                        onChange={handleChange}
-                        />
-                    </DialogContent>
-                    <DialogActions sx={{bgcolor:'rgb(24 24 23)'}}>
+                        <StyledSelect
+                          label="Active"
+                          placeholder="Active"
+                          name="active"
+                          value={selectedRow && selectedRow.active}
+                          onChange={handleChange}
+                        >
+                          <MenuItem value='Active'>Active</MenuItem>
+                          <MenuItem value='Inactive'>Inactive</MenuItem>
+                        </StyledSelect>
+
+                    </DialogContent >
+                    <DialogActions sx={{bgcolor:'rgb(24 24 23)'}} className="dialog-class-actions">
                     <Button onClick={handleClose} color="primary">
                         Cancel
                     </Button>
diff --git a/src/components/manage_users/ManageUsers.tsx b/src/components/manage_users/ManageUsers.tsx
index 5005812..e269409 100644
--- a/src/components/manage_users/ManageUsers.tsx
+++ b/src/components/manage_users/ManageUsers.tsx
@@ -19,6 +19,9 @@ import {
   TablePagination,
   InputAdornment,
   Box,
+  InputLabel,
+  Select,
+  MenuItem,
 } from '@mui/material';
 import SearchIcon from '@mui/icons-material/Search';
 import EditIcon from '@mui/icons-material/Edit';
@@ -47,6 +50,32 @@ const StyledTextField = (props:any) => (
     />
   );
 
+  const StyledSelect = (props: any) => (
+    <div>
+      <InputLabel htmlFor={props.name} sx={{ color: 'white', fontSize:13 }}>
+        {props.label}
+      </InputLabel>
+      <Select
+        variant="standard"
+        margin="dense"
+        fullWidth
+        {...props}
+        sx={{
+          color: 'white',
+          '& .MuiInputBase-input': { color: 'white' },
+          '& .MuiInput-underline:after': { borderBottomColor: 'white' },
+          '& .MuiOutlinedInput-root': {
+            '& fieldset': { borderColor: 'white' },
+            '&:hover fieldset': { borderColor: 'white', borderWidth: 2 },
+          },
+          ...props.sx,
+        }}
+      >
+        {props.children}
+      </Select>
+    </div>
+  );
+
   interface Row {
     username: string;
     email_id: string;
@@ -236,7 +265,7 @@ export default function ManageUsers(){
                 />
                 <Dialog  open={open} onClose={handleClose}>
                     <DialogTitle sx={{bgcolor:'rgb(24 24 23)', color:'white'}}>{selectedRow && selectedRow.id ? 'Edit Row' : 'Add New Row'}</DialogTitle>
-                    <DialogContent sx={{ bgcolor: 'rgb(24 24 23)' }}>
+                    <DialogContent sx={{ bgcolor: 'rgb(24 24 23)' }} className="dialog-class">
                         <StyledTextField
                         label="Name"
                         type="text"
@@ -256,14 +285,18 @@ export default function ManageUsers(){
                         value={selectedRow && selectedRow.last_login}
                         onChange={handleChange}
                         />
-                        <StyledTextField
-                        label="Active"
-                        name="active"
-                        value={selectedRow && selectedRow.active}
-                        onChange={handleChange}
-                        />
+                        <StyledSelect
+                          label="Active"
+                          placeholder="Active"
+                          name="active"
+                          value={selectedRow && selectedRow.active}
+                          onChange={handleChange}
+                        >
+                          <MenuItem value='Active'>Active</MenuItem>
+                          <MenuItem value='Inactive'>Inactive</MenuItem>
+                        </StyledSelect>
                     </DialogContent>
-                    <DialogActions sx={{bgcolor:'rgb(24 24 23)'}}>
+                    <DialogActions sx={{bgcolor:'rgb(24 24 23)'}} className="dialog-class-actions">
                     <Button onClick={handleClose} color="primary">
                         Cancel
                     </Button>