@ebubekirylmaz/link-test 1.2.45 → 1.2.47

package/src/widgets/Login/DemoLogin.jsx

@@ -62,13 +62,6 @@ export default function DemoLogin() {
           value={username}
           onChange={(e) => setUsername(e.target.value)}
           fullWidth
-          InputProps={{
-            startAdornment: (
-              <InputAdornment position="start">
-                <PersonOutline sx={{ color: "text.secondary", fontSize: 22 }} />
-              </InputAdornment>
-            ),
-          }}
           sx={{
             "& .MuiOutlinedInput-root": {
               fontSize: "1rem",
@@ -80,6 +73,15 @@ export default function DemoLogin() {
               },
             },
           }}
+          slotProps={{
+            input: {
+              startAdornment: (
+                <InputAdornment position="start">
+                  <PersonOutline sx={{ color: "text.secondary", fontSize: 22 }} />
+                </InputAdornment>
+              ),
+            }
+          }}
         />
 
         <TextField
@@ -88,25 +90,6 @@ export default function DemoLogin() {
           value={password}
           onChange={(e) => setPassword(e.target.value)}
           fullWidth
-          InputProps={{
-            startAdornment: (
-              <InputAdornment position="start">
-                <LockOutlined sx={{ color: "text.secondary", fontSize: 22 }} />
-              </InputAdornment>
-            ),
-            endAdornment: (
-              <InputAdornment position="end">
-                <IconButton
-                  onClick={() => setShowPassword(!showPassword)}
-                  edge="end"
-                  size="small"
-                  tabIndex={-1}
-                >
-                  {showPassword ? <VisibilityOff /> : <Visibility />}
-                </IconButton>
-              </InputAdornment>
-            ),
-          }}
           sx={{
             "& .MuiOutlinedInput-root": {
               fontSize: "1rem",
@@ -123,9 +106,29 @@ export default function DemoLogin() {
               handleLogin();
             }
           }}
+          slotProps={{
+            input: {
+              startAdornment: (
+                <InputAdornment position="start">
+                  <LockOutlined sx={{ color: "text.secondary", fontSize: 22 }} />
+                </InputAdornment>
+              ),
+              endAdornment: (
+                <InputAdornment position="end">
+                  <IconButton
+                    onClick={() => setShowPassword(!showPassword)}
+                    edge="end"
+                    size="small"
+                    tabIndex={-1}
+                  >
+                    {showPassword ? <VisibilityOff /> : <Visibility />}
+                  </IconButton>
+                </InputAdornment>
+              ),
+            }
+          }}
         />
       </Stack>
-
       <Button
         variant="contained"
         onClick={handleLogin}
@@ -153,7 +156,6 @@ export default function DemoLogin() {
       >
         Sign in
       </Button>
-
       <Box
         sx={{
           mt: 1,
@@ -167,9 +169,10 @@ export default function DemoLogin() {
       >
         <Typography
           variant="caption"
-          color="text.secondary"
-          sx={{ fontSize: "0.8125rem" }}
-        >
+          sx={{
+            color: "text.secondary",
+            fontSize: "0.8125rem"
+          }}>
           Demo credentials:{" "}
           <Box component="strong" sx={{ color: "text.primary" }}>
             admin / admin

package/src/widgets/SettingsDialog.jsx

@@ -167,11 +167,13 @@ function SettingsDialog({ handleClose, open }) {
       maxWidth={"md"}
       onClose={() => handleClose()}
       sx={{ bgcolor: "custom.darkDialogBg", zIndex: 2147483647 }}
-      PaperProps={{
-        style: {
-          color: "white",
-          minHeight: 600,
-        },
+      slotProps={{
+        paper: {
+          style: {
+            color: "white",
+            minHeight: 600,
+          },
+        }
       }}
     >
       <DialogContent>
@@ -212,9 +214,13 @@ const Permission = () => {
   }, [event, event2]);
 
   return (
-    <Stack direction="column" spacing={2} p={2}>
+    <Stack direction="column" spacing={2} sx={{
+      p: 2
+    }}>
       <Typography variant="h6">Users</Typography>
-      <Typography variant="subtitle2" color="text.secondary">
+      <Typography variant="subtitle2" sx={{
+        color: "text.secondary"
+      }}>
         Users with access to the project.
       </Typography>
       <List>
@@ -300,9 +306,13 @@ const Settings = () => {
   };
 
   return (
-    <Stack direction="column" spacing={2} p={2}>
+    <Stack direction="column" spacing={2} sx={{
+      p: 2
+    }}>
       <Typography variant="h6">Settings</Typography>
-      <Typography variant="subtitle2" color="text.secondary">
+      <Typography variant="subtitle2" sx={{
+        color: "text.secondary"
+      }}>
         Configure your application settings.
       </Typography>
       <List>
@@ -363,7 +373,9 @@ const About = () => {
   const description = pkg.description;
 
   return (
-    <Stack direction="column" spacing={2} p={2}>
+    <Stack direction="column" spacing={2} sx={{
+      p: 2
+    }}>
       <Box
         sx={{
           p: 3,
@@ -374,7 +386,9 @@ const About = () => {
             "linear-gradient(135deg, rgba(255,255,255,0.06), rgba(255,255,255,0.01))",
         }}
       >
-        <Stack direction="row" spacing={2.5} alignItems="center">
+        <Stack direction="row" spacing={2.5} sx={{
+          alignItems: "center"
+        }}>
           <Avatar
             src={iconSrc}
             variant="rounded"
@@ -390,16 +404,20 @@ const About = () => {
           </Avatar>
 
           <Box sx={{ flex: 1, minWidth: 0 }}>
-            <Typography variant="h5" fontWeight={600}>
+            <Typography variant="h5" sx={{
+              fontWeight: 600
+            }}>
               {appName.toUpperCase()}
             </Typography>
 
             {description && (
               <Typography
                 variant="body2"
-                color="text.secondary"
-                sx={{ mt: 0.5, maxWidth: 520 }}
-              >
+                sx={{
+                  color: "text.secondary",
+                  mt: 0.5,
+                  maxWidth: 520
+                }}>
                 {description}
               </Typography>
             )}
@@ -442,7 +460,9 @@ const About = () => {
             textAlign: "center",
           }}
         >
-          <Typography variant="caption" color="text.secondary">
+          <Typography variant="caption" sx={{
+            color: "text.secondary"
+          }}>
             © 2026 greycollar.ai. All rights reserved.
           </Typography>
         </Box>
@@ -453,11 +473,17 @@ const About = () => {
 
 const InfoRow = ({ label, value, link }) => {
   return (
-    <Stack direction="row" spacing={1.5} alignItems="center">
-      <Typography variant="body2" color="text.secondary" sx={{ minWidth: 110 }}>
+    <Stack direction="row" spacing={1.5} sx={{
+      alignItems: "center"
+    }}>
+      <Typography
+        variant="body2"
+        sx={{
+          color: "text.secondary",
+          minWidth: 110
+        }}>
         {label}
       </Typography>
-
       {link ? (
         <Link href={link} target="_blank" rel="noreferrer" underline="hover">
           {value}