Merge pull request #151 from stephb9959/main

[WIFI-11958] Device restriction details display

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "ucentral-client",
-  "version": "2.8.0(43)",
+  "version": "2.8.0(44)",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "ucentral-client",
-      "version": "2.8.0(43)",
+      "version": "2.8.0(44)",
       "license": "ISC",
       "dependencies": {
         "@chakra-ui/icons": "^2.0.11",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ucentral-client",
-  "version": "2.8.0(43)",
+  "version": "2.8.0(44)",
   "description": "",
   "private": true,
   "main": "index.tsx",

public/locales/de/translation.json

@@ -894,6 +894,20 @@
 		"title": "Ressourcen",
 		"variable": "Variable"
 	},
+	"restrictions": {
+		"algo": "Signaturalgorithmus",
+		"allowed": "dürfen",
+		"countries": "erlaubte Länder",
+		"developer": "Entwicklermodus",
+		"dfs": "DFS-Überschreibung",
+		"gw_commands": "Gateway-Befehle",
+		"identifier": "Identifikator",
+		"key_verification": "Überprüfung des Signaturschlüssels",
+		"restricted": "Beschränkt",
+		"signed_upgrade": "Nur signiertes Upgrade",
+		"title": "Beschränkungen",
+		"tty": "TTY-Zugriff"
+	},
 	"rrm": {
 		"algorithm": "Algorithmus",
 		"algorithm_other": "Algorithmen",

public/locales/en/translation.json

@@ -894,6 +894,20 @@
 		"title": "Resources",
 		"variable": "Variable"
 	},
+	"restrictions": {
+		"algo": "Signing Algorithm",
+		"allowed": "Allowed",
+		"countries": "Allowed Countries",
+		"developer": "Developer Mode",
+		"dfs": "DFS Override",
+		"gw_commands": "Gateway Commands",
+		"identifier": "Identifier",
+		"key_verification": "Signing Key Verification",
+		"restricted": "Restricted",
+		"signed_upgrade": "Signed Upgrade Only",
+		"title": "Restrictions",
+		"tty": "TTY Access"
+	},
 	"rrm": {
 		"algorithm": "Algorithm",
 		"algorithm_other": "Algorithms",

public/locales/es/translation.json

@@ -894,6 +894,20 @@
 		"title": "Recursos",
 		"variable": "Variable"
 	},
+	"restrictions": {
+		"algo": "Algoritmo de firma",
+		"allowed": "Permitido",
+		"countries": "países permitidos",
+		"developer": "Modo desarrollador",
+		"dfs": "Anulación de DFS",
+		"gw_commands": "Comandos de puerta de enlace",
+		"identifier": "Identificador",
+		"key_verification": "Verificación de clave de firma",
+		"restricted": "Restringido",
+		"signed_upgrade": "Solo actualización firmada",
+		"title": "Las restricciones",
+		"tty": "Acceso TTY"
+	},
 	"rrm": {
 		"algorithm": "Algoritmo",
 		"algorithm_other": "Algoritmos",

public/locales/fr/translation.json

@@ -894,6 +894,20 @@
 		"title": "Ressources",
 		"variable": "Variable"
 	},
+	"restrictions": {
+		"algo": "Algorithme de signature",
+		"allowed": "Permis",
+		"countries": "Pays autorisés",
+		"developer": "Mode développeur",
+		"dfs": "Remplacement DFS",
+		"gw_commands": "Commandes de passerelle",
+		"identifier": "Identifiant",
+		"key_verification": "Vérification de la clé de signature",
+		"restricted": "Limité",
+		"signed_upgrade": "Mise à niveau signée uniquement",
+		"title": "Restrictions",
+		"tty": "Accès ATS"
+	},
 	"rrm": {
 		"algorithm": "Algorithme",
 		"algorithm_other": "Algorithmes",

public/locales/pt/translation.json

@@ -894,6 +894,20 @@
 		"title": "Recursos",
 		"variable": "Variável"
 	},
+	"restrictions": {
+		"algo": "Algoritmo de Assinatura",
+		"allowed": "Permitido",
+		"countries": "países permitidos",
+		"developer": "Modo de desenvolvedor",
+		"dfs": "Substituição DFS",
+		"gw_commands": "Comandos de gateway",
+		"identifier": "Identificador",
+		"key_verification": "Verificação da chave de assinatura",
+		"restricted": "Restrito",
+		"signed_upgrade": "Somente atualização assinada",
+		"title": "RESTRIÇÕES",
+		"tty": "Acesso TTY"
+	},
 	"rrm": {
 		"algorithm": "Algoritmo",
 		"algorithm_other": "Algoritmos",

src/models/Device.ts

@@ -22,6 +22,20 @@ export interface GatewayDevice {
   notes: Note[];
   owner: string;
   restrictedDevice: boolean;
+  restrictionDetails?: {
+    dfs: boolean;
+    ssh: boolean;
+    rtty: boolean;
+    tty: boolean;
+    developer: boolean;
+    upgrade: boolean;
+    commands: boolean;
+    country: string[];
+    key_info: {
+      vendor: string;
+      algo: string;
+    };
+  };
   serialNumber: string;
   subscriber: string;
   venue: string;

src/pages/Device/RestrictionsCard/index.tsx

@@ -0,0 +1,89 @@
+import * as React from 'react';
+import { Box, Flex, Heading, ListItem, Text, UnorderedList } from '@chakra-ui/react';
+import { LockSimple, LockSimpleOpen } from 'phosphor-react';
+import { useTranslation } from 'react-i18next';
+import { Card } from 'components/Containers/Card';
+import { CardBody } from 'components/Containers/Card/CardBody';
+import { CardHeader } from 'components/Containers/Card/CardHeader';
+import { useGetDevice } from 'hooks/Network/Devices';
+
+type Props = {
+  serialNumber: string;
+};
+
+const RestrictionsCard = ({ serialNumber }: Props) => {
+  const { t } = useTranslation();
+  const getDevice = useGetDevice({ serialNumber });
+
+  const LABELS = {
+    dfs: t('restrictions.dfs'),
+    ssh: 'SSH',
+    rtty: 'RTTY',
+    tty: t('restrictions.tty'),
+    developer: t('restrictions.developer'),
+    upgrade: t('restrictions.signed_upgrade'),
+    commands: t('restrictions.gw_commands'),
+  } as { [key: string]: string };
+
+  const restrictions = getDevice.data?.restrictionDetails;
+
+  if (!restrictions || !getDevice.data?.restrictedDevice) return null;
+
+  const allowed = () => {
+    const allowedKeys = Object.entries(restrictions).filter(([k, v]) => v === false && LABELS[k] !== undefined);
+    return allowedKeys.map(([k]) => <ListItem key={k}>{LABELS[k]}</ListItem>);
+  };
+  const restricted = () => {
+    const restrictedKeys = Object.entries(restrictions).filter(([k, v]) => v === true && LABELS[k] !== undefined);
+    return restrictedKeys.map(([k]) => <ListItem key={k}>{LABELS[k]}</ListItem>);
+  };
+
+  return (
+    <Card mb={4}>
+      <CardHeader>
+        <Heading size="md">{t('restrictions.title')}</Heading>
+      </CardHeader>
+      <CardBody p={0} display="block">
+        <Flex mt={2}>
+          <Heading size="sm" mr={2}>
+            {t('restrictions.countries')}:
+          </Heading>
+          <Text>{restrictions.country.join(', ')}</Text>
+        </Flex>
+        <Heading size="sm" mt={2}>
+          {t('restrictions.key_verification')}
+        </Heading>
+        <UnorderedList>
+          <ListItem>
+            {t('controller.wifi.vendor')}: {restrictions.key_info?.vendor}
+          </ListItem>
+          <ListItem>
+            {t('restrictions.algo')}: {restrictions.key_info?.algo}
+          </ListItem>
+        </UnorderedList>
+        <Flex mt={2}>
+          <Box w="100%">
+            <Flex>
+              <Heading size="sm" mr={2}>
+                {t('restrictions.restricted')}
+              </Heading>
+              <LockSimple size={20} weight="bold" />
+            </Flex>
+            <UnorderedList>{restricted()}</UnorderedList>
+          </Box>
+          <Box w="100%">
+            <Flex>
+              <Heading size="sm" mr={2}>
+                {t('restrictions.allowed')}
+              </Heading>
+              <LockSimpleOpen size={20} weight="bold" />
+            </Flex>
+            <UnorderedList>{allowed()}</UnorderedList>
+          </Box>
+        </Flex>
+      </CardBody>
+    </Card>
+  );
+};
+
+export default RestrictionsCard;

src/pages/Device/Wrapper.tsx

@@ -19,6 +19,7 @@ import Masonry from 'react-masonry-css';
 import DeviceDetails from './Details';
 import DeviceLogsCard from './LogsCard';
 import DeviceNotes from './Notes';
+import RestrictionsCard from './RestrictionsCard';
 import DeviceStatisticsCard from './StatisticsCard';
 import DeviceSummary from './Summary';
 import WifiAnalysisCard from './WifiAnalysis';
@@ -232,6 +233,8 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
           <DeviceStatisticsCard serialNumber={serialNumber} />
           <WifiAnalysisCard serialNumber={serialNumber} />
           <DeviceLogsCard serialNumber={serialNumber} />
+          <RestrictionsCard serialNumber={serialNumber} />
+          <Box />
           <DeviceNotes serialNumber={serialNumber} />
         </Masonry>
       </Box>