Реализация функционала настроек

FRONT/DEV/src/components/UI/Dropdown/DeviceCard.tsx

@@ -5,6 +5,7 @@ import {buttonNames} from "../../../const/buttons/names";
 import {ModalMap} from "../../modalwindows/windowsType";
 import {IconComponent} from "../../../const/buttons/icons";
 import {useModalContext} from "../../../store";
+import {useNameSetting} from "../../../hooks/useSettings";
 
 interface DeviceCardProps {
     device: DeviceUser;
@@ -74,8 +75,8 @@ const Value = styled.span`
 
 const DeviceCard: React.FC<DeviceCardProps> = ({ device, status }) => {
     const [isExpanded, setIsExpanded] = useState(false);
-    const toggleExpanded = () => setIsExpanded(!isExpanded);
     const { openModal } = useModalContext();
+    const nameSetting = useNameSetting();
 
     const openModalNote = (e: React.MouseEvent) => {
         e.stopPropagation();
@@ -87,7 +88,7 @@ const DeviceCard: React.FC<DeviceCardProps> = ({ device, status }) => {
 
 
     return (
-        <CardWrapper status={status} onClick={toggleExpanded}>
+        <CardWrapper status={status} onClick={()=>setIsExpanded(!isExpanded)}>
             <CardHeader status={status}>
                 <p>
                     MAC: {device.mac}
@@ -100,7 +101,7 @@ const DeviceCard: React.FC<DeviceCardProps> = ({ device, status }) => {
             <CardContent isExpanded={isExpanded}>
                 <InfoRow>
                     <Label>Имя:</Label>
-                    <Value>{device.hostname || device.ip}</Value>
+                    <Value>{device.hostname || (nameSetting === 'ip' ? device.ip : 'Неизвестно')}</Value>
                 </InfoRow>
 
                 <InfoRow>