chore(deps): update node.js to v25

.drone.yml

@@ -5,13 +5,13 @@ name: default
 
 steps:
 - name: web_build
-  image: node:23
+  image: node:25
   volumes:
     - name: web_app
       path: /tmp/web_build
   commands:
   - cd virtweb_frontend
-  - npm install
+  - npm install --legacy-peer-deps # TODO remove --legacy-peer-deps ASAP
   - npm run lint
   - npm run build
   - mv dist /tmp/web_build

virtweb_backend/Cargo.toml

@@ -6,44 +6,44 @@ edition = "2024"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-log = "0.4.27"
+log = "0.4.29"
-env_logger = "0.11.8"
+env_logger = "0.11.10"
-clap = { version = "4.5.40", features = ["derive", "env"] }
+clap = { version = "4.6.0", features = ["derive", "env"] }
-light-openid = { version = "1.0.4", features = ["crypto-wrapper"] }
+light-openid = { version = "1.1.0", features = ["crypto-wrapper"] }
 lazy_static = "1.5.0"
 actix = "0.13.5"
-actix-web = "4.11.0"
+actix-web = "4.13.0"
-actix-remote-ip = "0.1.0"
+actix-remote-ip = "1.0.0"
-actix-session = { version = "0.10.1", features = ["cookie-session"] }
+actix-session = { version = "0.11.0", features = ["cookie-session"] }
-actix-identity = "0.8.0"
+actix-identity = "0.9.0"
 actix-cors = "0.7.1"
-actix-files = "0.6.6"
+actix-files = "0.6.10"
-actix-ws = "0.3.0"
+actix-ws = "0.4.0"
-actix-http = "3.11.0"
+actix-http = "3.12.0"
-serde = { version = "1.0.219", features = ["derive"] }
+serde = { version = "1.0.228", features = ["derive"] }
-serde_json = "1.0.140"
+serde_json = "1.0.149"
 serde_yml = "0.0.12"
-quick-xml = { version = "0.37.5", features = ["serialize", "overlapped-lists"] }
+quick-xml = { version = "0.39.2", features = ["serialize", "overlapped-lists"] }
-futures-util = "0.3.31"
+futures-util = "0.3.32"
-anyhow = "1.0.98"
+anyhow = "1.0.102"
 actix-multipart = "0.7.2"
-tempfile = "3.20.0"
+tempfile = "3.27.0"
-reqwest = { version = "0.12.20", features = ["stream"] }
+reqwest = { version = "0.13.2", features = ["stream"] }
-url = "2.5.4"
+url = "2.5.8"
-virt = "0.4.2"
+virt = "0.4.3"
-sysinfo = { version = "0.35.1", features = ["serde"] }
+sysinfo = { version = "0.38.4", features = ["serde"] }
-uuid = { version = "1.16.0", features = ["v4", "serde"] }
+uuid = { version = "1.22.0", features = ["v4", "serde"] }
-lazy-regex = "3.4.1"
+lazy-regex = "3.6.0"
-thiserror = "2.0.12"
+thiserror = "2.0.18"
-image = "0.25.6"
+image = "0.25.10"
-rand = "0.9.1"
+rand = "0.10.0"
-tokio = { version = "1.45.0", features = ["rt", "time", "macros"] }
+tokio = { version = "1.50.0", features = ["rt", "time", "macros"] }
-futures = "0.3.31"
+futures = "0.3.32"
 ipnetwork = { version = "0.21.1", features = ["serde"] }
 num = "0.4.3"
-rust-embed = { version = "8.7.2", features = ["mime-guess"] }
+rust-embed = { version = "8.11.0", features = ["mime-guess"] }
 dotenvy = "0.15.7"
-nix = { version = "0.30.1", features = ["net"] }
+nix = { version = "0.31.2", features = ["net"] }
-basic-jwt = "0.3.0"
+basic-jwt = "0.4.0"
-zip = "4.1.0"
+zip = "8.4.0"
-chrono = "0.4.41"
+chrono = "0.4.44"

virtweb_backend/src/actors/libvirt_actor.rs

@@ -27,10 +27,7 @@ impl LibVirtActor {
     /// Connect to hypervisor
     pub async fn connect() -> anyhow::Result<Self> {
         let hypervisor_uri = AppConfig::get().hypervisor_uri.as_deref().unwrap_or("");
-        log::info!(
+        log::info!("Will connect to hypvervisor at address '{hypervisor_uri}'",);
-            "Will connect to hypvervisor at address '{}'",
-            hypervisor_uri
-        );
         let conn = Connect::open(Some(hypervisor_uri))?;
 
         Ok(Self { m: conn })
@@ -102,7 +99,7 @@ impl Handler<GetDomainXMLReq> for LibVirtActor {
         log::debug!("Get domain XML:\n{}", msg.0.as_string());
         let domain = Domain::lookup_by_uuid_string(&self.m, &msg.0.as_string())?;
         let xml = domain.get_xml_desc(VIR_DOMAIN_XML_SECURE)?;
-        log::debug!("XML = {}", xml);
+        log::debug!("XML = {xml}");
         DomainXML::parse_xml(&xml)
     }
 }
@@ -131,7 +128,7 @@ impl Handler<DefineDomainReq> for LibVirtActor {
     fn handle(&mut self, mut msg: DefineDomainReq, _ctx: &mut Self::Context) -> Self::Result {
         let xml = msg.1.as_xml()?;
 
-        log::debug!("Define domain:\n{}", xml);
+        log::debug!("Define domain:\n{xml}");
         let domain = Domain::define_xml(&self.m, &xml)?;
         let uuid = XMLUuid::parse_from_str(&domain.get_uuid_string()?)?;
 
@@ -446,7 +443,7 @@ impl Handler<GetNetworkXMLReq> for LibVirtActor {
         log::debug!("Get network XML:\n{}", msg.0.as_string());
         let network = Network::lookup_by_uuid_string(&self.m, &msg.0.as_string())?;
         let xml = network.get_xml_desc(0)?;
-        log::debug!("XML = {}", xml);
+        log::debug!("XML = {xml}");
         NetworkXML::parse_xml(&xml)
     }
 }
@@ -602,7 +599,7 @@ impl Handler<GetNWFilterXMLReq> for LibVirtActor {
         log::debug!("Get network filter XML:\n{}", msg.0.as_string());
         let filter = NWFilter::lookup_by_uuid_string(&self.m, &msg.0.as_string())?;
         let xml = filter.get_xml_desc(0)?;
-        log::debug!("XML = {}", xml);
+        log::debug!("XML = {xml}");
         NetworkFilterXML::parse_xml(xml)
     }
 }
@@ -617,7 +614,7 @@ impl Handler<DefineNWFilterReq> for LibVirtActor {
     fn handle(&mut self, mut msg: DefineNWFilterReq, _ctx: &mut Self::Context) -> Self::Result {
         let xml = msg.1.into_xml()?;
 
-        log::debug!("Define network filter:\n{}", xml);
+        log::debug!("Define network filter:\n{xml}");
         let filter = NWFilter::define_xml(&self.m, &xml)?;
         let uuid = XMLUuid::parse_from_str(&filter.get_uuid_string()?)?;
 

virtweb_backend/src/api_tokens.rs

@@ -83,7 +83,8 @@ pub struct Token {
     pub pub_key: Option<JWTPublicKey>,
     pub rights: TokenRights,
     pub last_used: u64,
-    pub ip_restriction: Option<ipnetwork::IpNetwork>,
+    #[serde(default, skip_serializing_if = "Vec::is_empty")]
+    pub allowed_ip_networks: Vec<ipnetwork::IpNetwork>,
     pub max_inactivity: Option<u64>,
 }
 
@@ -104,10 +105,10 @@ impl Token {
 
     /// Check whether a token is expired or not
     pub fn is_expired(&self) -> bool {
-        if let Some(max_inactivity) = self.max_inactivity {
+        if let Some(max_inactivity) = self.max_inactivity
-            if max_inactivity + self.last_used < time() {
+            && max_inactivity + self.last_used < time()
-                return true;
+        {
-            }
+            return true;
         }
 
         false
@@ -161,7 +162,8 @@ pub struct NewToken {
     pub name: String,
     pub description: String,
     pub rights: TokenRights,
-    pub ip_restriction: Option<ipnetwork::IpNetwork>,
+    #[serde(default, skip_serializing_if = "Vec::is_empty")]
+    pub allowed_ip_networks: Vec<ipnetwork::IpNetwork>,
     pub max_inactivity: Option<u64>,
 }
 
@@ -188,10 +190,10 @@ impl NewToken {
             return Some(err);
         }
 
-        if let Some(t) = self.max_inactivity {
+        if let Some(t) = self.max_inactivity
-            if t < 3600 {
+            && t < 3600
-                return Some("API tokens shall be valid for at least 1 hour!");
+        {
-            }
+            return Some("API tokens shall be valid for at least 1 hour!");
         }
 
         None
@@ -212,7 +214,7 @@ pub async fn create(t: &NewToken) -> anyhow::Result<(Token, JWTPrivateKey)> {
         pub_key: Some(pub_key),
         rights: t.rights.clone(),
         last_used: time(),
-        ip_restriction: t.ip_restriction,
+        allowed_ip_networks: t.allowed_ip_networks.clone(),
         max_inactivity: t.max_inactivity,
     };
 

virtweb_backend/src/app_config.rs

@@ -280,7 +280,7 @@ impl AppConfig {
 
     /// Get VM vnc sockets path for domain
     pub fn vnc_socket_for_domain(&self, name: &str) -> PathBuf {
-        self.vnc_sockets_path().join(format!("vnc-{}", name))
+        self.vnc_sockets_path().join(format!("vnc-{name}"))
     }
 
     /// Get VM root disks storage directory

virtweb_backend/src/controllers/disk_images_controller.rs

@@ -31,13 +31,12 @@ pub async fn upload(MultipartForm(mut form): MultipartForm<UploadDiskImageForm>)
     }
 
     // Check file mime type
-    if let Some(mime_type) = file.content_type {
+    if let Some(mime_type) = file.content_type
-        if !constants::ALLOWED_DISK_IMAGES_MIME_TYPES.contains(&mime_type.as_ref()) {
+        && !constants::ALLOWED_DISK_IMAGES_MIME_TYPES.contains(&mime_type.as_ref())
-            return Ok(HttpResponse::BadRequest().json(format!(
+    {
-                "Unsupported file type for disk upload: {}",
+        return Ok(HttpResponse::BadRequest().json(format!(
-                mime_type
+            "Unsupported file type for disk upload: {mime_type}"
-            )));
+        )));
-        }
     }
 
     // Extract and check file name

virtweb_backend/src/controllers/iso_controller.rs

@@ -31,11 +31,11 @@ pub async fn upload_file(MultipartForm(mut form): MultipartForm<UploadIsoForm>)
         return Ok(HttpResponse::BadRequest().json("File is too large!"));
     }
 
-    if let Some(m) = &file.content_type {
+    if let Some(m) = &file.content_type
-        if !constants::ALLOWED_ISO_MIME_TYPES.contains(&m.to_string().as_str()) {
+        && !constants::ALLOWED_ISO_MIME_TYPES.contains(&m.to_string().as_str())
-            log::error!("Uploaded ISO file has an invalid mimetype!");
+    {
-            return Ok(HttpResponse::BadRequest().json("Invalid mimetype!"));
+        log::error!("Uploaded ISO file has an invalid mimetype!");
-        }
+        return Ok(HttpResponse::BadRequest().json("Invalid mimetype!"));
     }
 
     let file_name = match &file.file_name {
@@ -52,7 +52,7 @@ pub async fn upload_file(MultipartForm(mut form): MultipartForm<UploadIsoForm>)
     }
 
     let dest_file = AppConfig::get().iso_storage_path().join(file_name);
-    log::info!("Will save ISO file {:?}", dest_file);
+    log::info!("Will save ISO file {dest_file:?}");
 
     if dest_file.exists() {
         log::error!("Conflict with uploaded iso file name!");
@@ -87,16 +87,16 @@ pub async fn upload_from_url(req: web::Json<DownloadFromURLReq>) -> HttpResult {
 
     let response = reqwest::get(&req.url).await?;
 
-    if let Some(len) = response.content_length() {
+    if let Some(len) = response.content_length()
-        if len > constants::ISO_MAX_SIZE.as_bytes() as u64 {
+        && len > constants::ISO_MAX_SIZE.as_bytes() as u64
-            return Ok(HttpResponse::BadRequest().json("File is too large!"));
+    {
-        }
+        return Ok(HttpResponse::BadRequest().json("File is too large!"));
     }
 
-    if let Some(ct) = response.headers().get("content-type") {
+    if let Some(ct) = response.headers().get("content-type")
-        if !constants::ALLOWED_ISO_MIME_TYPES.contains(&ct.to_str()?) {
+        && !constants::ALLOWED_ISO_MIME_TYPES.contains(&ct.to_str()?)
-            return Ok(HttpResponse::BadRequest().json("Invalid file mimetype!"));
+    {
-        }
+        return Ok(HttpResponse::BadRequest().json("Invalid file mimetype!"));
     }
 
     let mut stream = response.bytes_stream();

virtweb_backend/src/controllers/mod.rs

@@ -2,6 +2,7 @@ use crate::libvirt_client::LibVirtClient;
 use actix_http::StatusCode;
 use actix_web::body::BoxBody;
 use actix_web::{HttpResponse, web};
+use light_openid::errors::OpenIdError;
 use std::error::Error;
 use std::fmt::{Display, Formatter};
 use zip::result::ZipError;
@@ -43,7 +44,7 @@ impl actix_web::error::ResponseError for HttpErr {
         }
     }
     fn error_response(&self) -> HttpResponse<BoxBody> {
-        log::error!("Error while processing request! {}", self);
+        log::error!("Error while processing request! {self}");
 
         HttpResponse::InternalServerError().body("Failed to execute request!")
     }
@@ -109,11 +110,18 @@ impl From<ZipError> for HttpErr {
     }
 }
 
+impl From<OpenIdError> for HttpErr {
+    fn from(err: OpenIdError) -> HttpErr {
+        HttpErr::Err(std::io::Error::other(err.to_string()).into())
+    }
+}
+
 impl From<HttpResponse> for HttpErr {
     fn from(value: HttpResponse) -> Self {
         HttpErr::HTTPResponse(value)
     }
 }
+
 pub type HttpResult = Result<HttpResponse, HttpErr>;
 
 pub type LibVirtReq = web::Data<LibVirtClient>;

virtweb_backend/src/extractors/api_auth_extractor.rs

@@ -9,7 +9,7 @@ use actix_web::{Error, FromRequest, HttpRequest};
 use std::future::Future;
 use std::pin::Pin;
 
-#[derive(serde::Serialize, serde::Deserialize, Debug)]
+#[derive(serde::Serialize, serde::Deserialize, Clone, Debug)]
 pub struct TokenClaims {
     pub sub: String,
     pub iat: usize,
@@ -128,21 +128,24 @@ impl FromRequest for ApiAuthExtractor {
                 ));
             }
 
-            if let Some(ip) = token.ip_restriction {
+            if !token.allowed_ip_networks.is_empty()
-                if !ip.contains(remote_ip.0) {
+                && !token
-                    log::error!(
+                    .allowed_ip_networks
-                        "Attempt to use a token for an unauthorized IP! {remote_ip:?} token_id={}",
+                    .iter()
-                        token.id.0
+                    .any(|n| n.contains(remote_ip.0))
-                    );
+            {
-                    return Err(ErrorUnauthorized("Token cannot be used from this IP!"));
+                log::error!(
-                }
+                    "Attempt to use a token for an unauthorized IP! {remote_ip:?} token_id={}",
+                    token.id.0
+                );
+                return Err(ErrorUnauthorized("Token cannot be used from this IP!"));
             }
 
-            if token.should_update_last_activity() {
+            if token.should_update_last_activity()
-                if let Err(e) = api_tokens::refresh_last_used(token.id).await {
+                && let Err(e) = api_tokens::refresh_last_used(token.id).await
-                    log::error!("Could not update token last activity! {e}");
+            {
-                    return Err(ErrorBadRequest("Couldn't refresh token last activity!"));
+                log::error!("Could not update token last activity! {e}");
-                }
+                return Err(ErrorBadRequest("Couldn't refresh token last activity!"));
             }
 
             Ok(ApiAuthExtractor { token, claims })

virtweb_backend/src/libvirt_rest_structures/net.rs

@@ -96,28 +96,28 @@ impl NetworkInfo {
             return Err(StructureExtraction("network name is invalid!").into());
         }
 
-        if let Some(n) = &self.title {
+        if let Some(n) = &self.title
-            if n.contains('\n') {
+            && n.contains('\n')
-                return Err(StructureExtraction("Network title contain newline char!").into());
+        {
-            }
+            return Err(StructureExtraction("Network title contain newline char!").into());
         }
 
-        if let Some(dev) = &self.device {
+        if let Some(dev) = &self.device
-            if !regex!("^[a-zA-Z0-9]+$").is_match(dev) {
+            && !regex!("^[a-zA-Z0-9]+$").is_match(dev)
-                return Err(StructureExtraction("Network device name is invalid!").into());
+        {
-            }
+            return Err(StructureExtraction("Network device name is invalid!").into());
         }
 
-        if let Some(bridge) = &self.bridge_name {
+        if let Some(bridge) = &self.bridge_name
-            if !regex!("^[a-zA-Z0-9]+$").is_match(bridge) {
+            && !regex!("^[a-zA-Z0-9]+$").is_match(bridge)
-                return Err(StructureExtraction("Network bridge name is invalid!").into());
+        {
-            }
+            return Err(StructureExtraction("Network bridge name is invalid!").into());
         }
 
-        if let Some(domain) = &self.domain {
+        if let Some(domain) = &self.domain
-            if !regex!("^[a-zA-Z0-9.]+$").is_match(domain) {
+            && !regex!("^[a-zA-Z0-9.]+$").is_match(domain)
-                return Err(StructureExtraction("Domain name is invalid!").into());
+        {
-            }
+            return Err(StructureExtraction("Domain name is invalid!").into());
         }
 
         let mut ips = Vec::with_capacity(2);
@@ -303,16 +303,16 @@ impl NetworkInfo {
 
     /// Check if at least one NAT definition was specified on this interface
     pub fn has_nat_def(&self) -> bool {
-        if let Some(ipv4) = &self.ip_v4 {
+        if let Some(ipv4) = &self.ip_v4
-            if ipv4.nat.is_some() {
+            && ipv4.nat.is_some()
-                return true;
+        {
-            }
+            return true;
         }
 
-        if let Some(ipv6) = &self.ip_v6 {
+        if let Some(ipv6) = &self.ip_v6
-            if ipv6.nat.is_some() {
+            && ipv6.nat.is_some()
-                return true;
+        {
-            }
+            return true;
         }
 
         false

virtweb_backend/src/libvirt_rest_structures/nw_filter.rs

@@ -43,14 +43,12 @@ impl From<&String> for NetworkFilterMacAddressOrVar {
 fn extract_mac_address_or_var(
     n: &Option<NetworkFilterMacAddressOrVar>,
 ) -> anyhow::Result<Option<String>> {
-    if let Some(mac) = n {
+    if let Some(mac) = n
-        if !mac.is_valid() {
+        && !mac.is_valid()
-            return Err(NetworkFilterExtraction(format!(
+    {
-                "Invalid mac address or variable! {}",
+        return Err(
-                mac.0
+            NetworkFilterExtraction(format!("Invalid mac address or variable! {}", mac.0)).into(),
-            ))
+        );
-            .into());
-        }
     }
 
     Ok(n.as_ref().map(|n| n.0.to_string()))
@@ -83,34 +81,34 @@ impl<const V: usize> From<&String> for NetworkFilterIPOrVar<V> {
 fn extract_ip_or_var<const V: usize>(
     n: &Option<NetworkFilterIPOrVar<V>>,
 ) -> anyhow::Result<Option<String>> {
-    if let Some(ip) = n {
+    if let Some(ip) = n
-        if !ip.is_valid() {
+        && !ip.is_valid()
-            return Err(NetworkFilterExtraction(format!(
+    {
-                "Invalid IPv{V} address or variable! {}",
+        return Err(NetworkFilterExtraction(format!(
-                ip.0
+            "Invalid IPv{V} address or variable! {}",
-            ))
+            ip.0
-            .into());
+        ))
-        }
+        .into());
     }
 
     Ok(n.as_ref().map(|n| n.0.to_string()))
 }
 
 fn extract_ip_mask<const V: usize>(n: Option<u8>) -> anyhow::Result<Option<u8>> {
-    if let Some(mask) = n {
+    if let Some(mask) = n
-        if !net_utils::is_mask_valid(V, mask) {
+        && !net_utils::is_mask_valid(V, mask)
-            return Err(NetworkFilterExtraction(format!("Invalid IPv{V} mask! {mask}")).into());
+    {
-        }
+        return Err(NetworkFilterExtraction(format!("Invalid IPv{V} mask! {mask}")).into());
     }
 
     Ok(n)
 }
 
 fn extract_nw_filter_comment(n: &Option<String>) -> anyhow::Result<Option<String>> {
-    if let Some(comment) = n {
+    if let Some(comment) = n
-        if comment.len() > 256 || comment.contains('\"') || comment.contains('\n') {
+        && (comment.len() > 256 || comment.contains('\"') || comment.contains('\n'))
-            return Err(NetworkFilterExtraction(format!("Invalid comment! {}", comment)).into());
+    {
-        }
+        return Err(NetworkFilterExtraction(format!("Invalid comment! {comment}")).into());
     }
 
     Ok(n.clone())
@@ -869,12 +867,10 @@ impl NetworkFilter {
             );
         }
 
-        if let Some(priority) = self.priority {
+        if let Some(priority) = self.priority
-            if !(-1000..=1000).contains(&priority) {
+            && !(-1000..=1000).contains(&priority)
-                return Err(
+        {
-                    NetworkFilterExtraction("Network priority is invalid!".to_string()).into(),
+            return Err(NetworkFilterExtraction("Network priority is invalid!".to_string()).into());
-                );
-            }
         }
 
         for fref in &self.join_filters {

virtweb_backend/src/libvirt_rest_structures/vm.rs

@@ -118,22 +118,22 @@ impl VMInfo {
             XMLUuid::new_random()
         };
 
-        if let Some(n) = &self.genid {
+        if let Some(n) = &self.genid
-            if !n.is_valid() {
+            && !n.is_valid()
-                return Err(StructureExtraction("VM genid is invalid!").into());
+        {
-            }
+            return Err(StructureExtraction("VM genid is invalid!").into());
         }
 
-        if let Some(n) = &self.title {
+        if let Some(n) = &self.title
-            if n.contains('\n') {
+            && n.contains('\n')
-                return Err(StructureExtraction("VM title contain newline char!").into());
+        {
-            }
+            return Err(StructureExtraction("VM title contain newline char!").into());
         }
 
-        if let Some(group) = &self.group {
+        if let Some(group) = &self.group
-            if !regex!("^[a-zA-Z0-9]+$").is_match(&group.0) {
+            && !regex!("^[a-zA-Z0-9]+$").is_match(&group.0)
-                return Err(StructureExtraction("VM group name is invalid!").into());
+        {
-            }
+            return Err(StructureExtraction("VM group name is invalid!").into());
         }
 
         if self.memory < constants::MIN_VM_MEMORY || self.memory > constants::MAX_VM_MEMORY {

virtweb_backend/src/main.rs

@@ -1,7 +1,7 @@
 use actix::Actor;
 use actix_cors::Cors;
 use actix_identity::IdentityMiddleware;
-use actix_identity::config::LogoutBehaviour;
+use actix_identity::config::LogoutBehavior;
 use actix_multipart::form::MultipartFormConfig;
 use actix_multipart::form::tempfile::TempFileConfig;
 use actix_remote_ip::RemoteIPConfig;
@@ -98,7 +98,7 @@ async fn main() -> std::io::Result<()> {
         .build();
 
         let identity_middleware = IdentityMiddleware::builder()
-            .logout_behaviour(LogoutBehaviour::PurgeSession)
+            .logout_behavior(LogoutBehavior::PurgeSession)
             .visit_deadline(Some(Duration::from_secs(MAX_INACTIVITY_DURATION)))
             .login_deadline(Some(Duration::from_secs(MAX_SESSION_DURATION)))
             .build();
@@ -123,9 +123,9 @@ async fn main() -> std::io::Result<()> {
             .wrap(cors)
             .app_data(state_manager.clone())
             .app_data(vnc_tokens.clone())
-            .app_data(Data::new(RemoteIPConfig {
+            .app_data(Data::new(RemoteIPConfig::parse_opt(
-                proxy: AppConfig::get().proxy_ip.clone(),
+                AppConfig::get().proxy_ip.clone(),
-            }))
+            )))
             .app_data(conn.clone())
             // Uploaded files
             .app_data(MultipartFormConfig::default().total_limit(

virtweb_backend/src/middlewares/auth_middleware.rs

@@ -69,8 +69,7 @@ where
 
             if !AppConfig::get().is_allowed_ip(remote_ip.0) {
                 log::error!(
-                    "An attempt to access VirtWeb from an unauthorized network has been intercepted! {:?}",
+                    "An attempt to access VirtWeb from an unauthorized network has been intercepted! {remote_ip:?}"
-                    remote_ip
                 );
                 return Ok(req
                     .into_response(

virtweb_backend/src/nat/nat_definition.rs

@@ -60,10 +60,10 @@ pub struct Nat<IPv> {
 
 impl<IPv> Nat<IPv> {
     pub fn check(&self) -> anyhow::Result<()> {
-        if let NatSourceIP::Interface { name } = &self.host_ip {
+        if let NatSourceIP::Interface { name } = &self.host_ip
-            if !net_utils::is_net_interface_name_valid(name) {
+            && !net_utils::is_net_interface_name_valid(name)
-                return Err(NatDefError::InvalidNatDef("Invalid nat interface name!").into());
+        {
-            }
+            return Err(NatDefError::InvalidNatDef("Invalid nat interface name!").into());
         }
 
         if let NatHostPort::Range { start, end } = &self.host_port {
@@ -84,10 +84,10 @@ impl<IPv> Nat<IPv> {
             return Err(NatDefError::InvalidNatDef("Invalid guest port!").into());
         }
 
-        if let Some(comment) = &self.comment {
+        if let Some(comment) = &self.comment
-            if comment.len() > constants::NET_NAT_COMMENT_MAX_SIZE {
+            && comment.len() > constants::NET_NAT_COMMENT_MAX_SIZE
-                return Err(NatDefError::InvalidNatDef("Comment is too large!").into());
+        {
-            }
+            return Err(NatDefError::InvalidNatDef("Comment is too large!").into());
         }
 
         Ok(())

virtweb_backend/src/utils/cloud_init_utils.rs

@@ -81,10 +81,10 @@ impl CloudInitConfig {
         // Process metadata
         let mut metadatas = vec![];
         if let Some(inst_id) = &self.instance_id {
-            metadatas.push(format!("instance-id: {}", inst_id));
+            metadatas.push(format!("instance-id: {inst_id}"));
         }
         if let Some(local_hostname) = &self.local_hostname {
-            metadatas.push(format!("local-hostname: {}", local_hostname));
+            metadatas.push(format!("local-hostname: {local_hostname}"));
         }
         if let Some(dsmode) = &self.dsmode {
             metadatas.push(format!(

virtweb_frontend/eslint.config.js

@@ -49,6 +49,7 @@ export default tseslint.config(
       "@typescript-eslint/no-unsafe-member-access": "off",
       "@typescript-eslint/no-unsafe-argument": "off",
       "react-refresh/only-export-components": "off",
+      "react-hooks/immutability": "off",
     },
   }
 );

virtweb_frontend/package.json

@@ -11,46 +11,48 @@
   },
   "dependencies": {
     "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
-    "@fontsource/roboto": "^5.2.6",
+    "@fontsource/roboto": "^5.2.10",
     "@mdi/js": "^7.4.47",
     "@mdi/react": "^1.6.1",
     "@monaco-editor/react": "^4.7.0",
-    "@mui/icons-material": "^7.1.1",
+    "@mui/icons-material": "^7.3.9",
-    "@mui/material": "^7.1.1",
+    "@mui/material": "^7.3.9",
-    "@mui/x-charts": "^8.3.1",
+    "@mui/x-charts": "^8.28.0",
-    "@mui/x-data-grid": "^8.3.1",
+    "@mui/x-data-grid": "^8.28.0",
-    "date-and-time": "^3.6.0",
+    "date-and-time": "^4.3.1",
-    "filesize": "^10.1.6",
+    "filesize": "^11.0.13",
-    "humanize-duration": "^3.32.2",
+    "humanize-duration": "^3.33.2",
-    "monaco-editor": "^0.52.2",
+    "is-cidr": "^6.0.3",
-    "monaco-yaml": "^5.4.0",
+    "monaco-editor": "^0.55.1",
-    "react": "^19.1.0",
+    "monaco-yaml": "^5.4.1",
-    "react-dom": "^19.1.0",
+    "react": "^19.2.4",
-    "react-router-dom": "^7.6.2",
+    "react-dom": "^19.2.4",
-    "react-syntax-highlighter": "^15.6.1",
+    "react-router-dom": "^7.13.2",
-    "react-vnc": "^3.1.0",
+    "react-syntax-highlighter": "^16.1.1",
-    "uuid": "^11.1.0",
+    "react-vnc": "^3.2.0",
-    "xml-formatter": "^3.6.6",
+    "uuid": "^13.0.0",
-    "yaml": "^2.8.0"
+    "xml-formatter": "^3.7.0",
+    "yaml": "^2.8.3"
   },
   "devDependencies": {
-    "@eslint/js": "^9.27.0",
+    "@eslint/js": "^10.0.1",
     "@types/humanize-duration": "^3.27.4",
-    "@types/jest": "^29.5.14",
+    "@types/jest": "^30.0.0",
-    "@types/react": "^19.1.8",
+    "@types/node": "^25.5.0",
-    "@types/react-dom": "^19.1.6",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
     "@types/react-syntax-highlighter": "^15.5.13",
     "@types/uuid": "^10.0.0",
-    "@vitejs/plugin-react": "^4.4.1",
+    "@vitejs/plugin-react": "^6.0.1",
-    "eslint": "^9.27.0",
+    "eslint": "^10.1.0",
-    "eslint-plugin-react-dom": "^1.49.0",
+    "eslint-plugin-react-dom": "^3.0.0",
-    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-hooks": "^7.0.1",
-    "eslint-plugin-react-refresh": "^0.4.20",
+    "eslint-plugin-react-refresh": "^0.5.2",
-    "eslint-plugin-react-x": "^1.49.0",
+    "eslint-plugin-react-x": "^3.0.0",
-    "globals": "^16.1.0",
+    "globals": "^17.4.0",
-    "typescript": "^5.8.3",
+    "typescript": "^6.0.2",
-    "typescript-eslint": "^8.32.1",
+    "typescript-eslint": "^8.57.2",
-    "vite": "^6.3.5"
+    "vite": "^8.0.2"
   }
 }

virtweb_frontend/src/api/TokensApi.ts

@@ -16,7 +16,7 @@ export interface APIToken {
   updated: number;
   rights: TokenRight[];
   last_used: number;
-  ip_restriction?: string;
+  allowed_ip_networks?: string[];
   max_inactivity?: number;
 }
 

virtweb_frontend/src/routes/DiskImagesRoute.tsx

@@ -61,6 +61,7 @@ export function DiskImagesRoute(): React.ReactElement {
       }
     >
       <AsyncWidget
+        // eslint-disable-next-line react-hooks/refs
         loadKey={loadKey.current}
         errMsg="Failed to load disk images list!"
         load={load}
@@ -84,7 +85,7 @@ function UploadDiskImageCard(p: {
 
   const [value, setValue] = React.useState<File | null>(null);
   const [uploadProgress, setUploadProgress] = React.useState<number | null>(
-    null
+    null,
   );
 
   const handleChange = (newValue: File | null) => {
@@ -94,8 +95,8 @@ function UploadDiskImageCard(p: {
     ) {
       alert(
         `The file is too big (max size allowed: ${filesize(
-          ServerApi.Config.constraints.disk_image_max_size
+          ServerApi.Config.constraints.disk_image_max_size,
-        )}`
+        )}`,
       );
       return;
     }
@@ -200,7 +201,7 @@ function DiskImageList(p: {
   const deleteDiskImage = async (entry: DiskImage) => {
     if (
       !(await confirm(
-        `Do you really want to delete this disk image (${entry.file_name}) ?`
+        `Do you really want to delete this disk image (${entry.file_name}) ?`,
       ))
     )
       return;

virtweb_frontend/src/routes/EditAPITokenRoute.tsx

@@ -28,14 +28,16 @@ export function CreateApiTokenRoute(): React.ReactElement {
     CreatedAPIToken | undefined
   >();
 
-  const [token] = React.useState<APIToken>({
+  const [token] = React.useState<APIToken>(() => {
-    id: "",
+    return {
-    name: "",
+      id: "",
-    description: "",
+      name: "",
-    created: time(),
+      description: "",
-    updated: time(),
+      created: time(),
-    last_used: time(),
+      updated: time(),
-    rights: [],
+      last_used: time(),
+      rights: [],
+    };
   });
 
   const createApiToken = async (n: APIToken) => {
@@ -115,8 +117,11 @@ function EditApiTokenRouteInner(p: {
 
   const [changed, setChanged] = React.useState(false);
 
+  // eslint-disable-next-line react-x/use-state
   const [, updateState] = React.useState<any>();
-  const forceUpdate = React.useCallback(() => { updateState({}); }, []);
+  const forceUpdate = React.useCallback(() => {
+    updateState({});
+  }, []);
 
   const valueChanged = () => {
     setChanged(true);

virtweb_frontend/src/routes/EditNWFilterRoute.tsx

@@ -15,7 +15,7 @@ export function CreateNWFilterRoute(): React.ReactElement {
   const snackbar = useSnackbar();
   const navigate = useNavigate();
 
-  const [nwfilter, setNWFilter] = React.useState<NWFilter>({
+  const [nwFilter, setNWFilter] = React.useState<NWFilter>({
     name: "my-filter",
     chain: { protocol: "root" },
     join_filters: [],
@@ -35,7 +35,7 @@ export function CreateNWFilterRoute(): React.ReactElement {
 
   return (
     <EditNetworkFilterRouteInner
-      nwfilter={nwfilter}
+      nwfilter={nwFilter}
       creating={true}
       onCancel={() => navigate("/nwfilter")}
       onSave={createNWFilter}
@@ -51,7 +51,7 @@ export function EditNWFilterRoute(): React.ReactElement {
   const { uuid } = useParams();
   const navigate = useNavigate();
 
-  const [nwfilter, setNWFilter] = React.useState<NWFilter | undefined>();
+  const [nwFilter, setNWFilter] = React.useState<NWFilter | undefined>();
 
   const load = async () => {
     setNWFilter(await NWFilterApi.GetSingle(uuid!));
@@ -61,7 +61,7 @@ export function EditNWFilterRoute(): React.ReactElement {
     try {
       await NWFilterApi.Update(n);
       snackbar("The network filter was successfully updated!");
-      navigate(NWFilterURL(nwfilter!));
+      navigate(NWFilterURL(nwFilter!));
     } catch (e) {
       console.error(e);
       alert(`Failed to update network filter!\n${e}`);
@@ -71,12 +71,12 @@ export function EditNWFilterRoute(): React.ReactElement {
   return (
     <AsyncWidget
       loadKey={uuid}
-      ready={nwfilter !== undefined}
+      ready={nwFilter !== undefined}
       errMsg="Failed to fetch network filter information!"
       load={load}
       build={() => (
         <EditNetworkFilterRouteInner
-          nwfilter={nwfilter!}
+          nwfilter={nwFilter!}
           creating={false}
           onCancel={() => navigate(`/nwfilter/${uuid}`)}
           onSave={updateNetworkFilter}
@@ -98,8 +98,11 @@ function EditNetworkFilterRouteInner(p: {
 
   const [changed, setChanged] = React.useState(false);
 
+  // eslint-disable-next-line react-x/use-state
   const [, updateState] = React.useState<any>();
-  const forceUpdate = React.useCallback(() => { updateState({}); }, []);
+  const forceUpdate = React.useCallback(() => {
+    updateState({});
+  }, []);
 
   const valueChanged = () => {
     setChanged(true);

virtweb_frontend/src/routes/EditNetworkRoute.tsx

@@ -96,8 +96,11 @@ function EditNetworkRouteInner(p: {
 
   const [changed, setChanged] = React.useState(false);
 
+  // eslint-disable-next-line react-x/use-state
   const [, updateState] = React.useState<any>();
-  const forceUpdate = React.useCallback(() => { updateState({}); }, []);
+  const forceUpdate = React.useCallback(() => {
+    updateState({});
+  }, []);
 
   const valueChanged = () => {
     setChanged(true);

virtweb_frontend/src/routes/EditVMRoute.tsx

@@ -102,6 +102,7 @@ function EditVMInner(p: {
 
   const [changed, setChanged] = React.useState(false);
 
+  // eslint-disable-next-line react-x/use-state
   const [, updateState] = React.useState<any>();
   const forceUpdate = React.useCallback(() => {
     updateState({});

virtweb_frontend/src/routes/IsoFilesRoute.tsx

@@ -46,6 +46,7 @@ export function IsoFilesRoute(): React.ReactElement {
   return (
     <>
       <AsyncWidget
+        // eslint-disable-next-line react-hooks/refs
         loadKey={loadKey.current}
         errMsg="Failed to load ISO files list!"
         load={load}
@@ -56,7 +57,11 @@ export function IsoFilesRoute(): React.ReactElement {
             actions={
               <span>
                 <Tooltip title="Open the ISO catalog">
-                  <IconButton onClick={() => { setIsoCatalog(true); }}>
+                  <IconButton
+                    onClick={() => {
+                      setIsoCatalog(true);
+                    }}
+                  >
                     <MenuBookIcon />
                   </IconButton>
                 </Tooltip>
@@ -76,7 +81,9 @@ export function IsoFilesRoute(): React.ReactElement {
       />
       <IsoCatalogDialog
         open={isoCatalog}
-        onClose={() => { setIsoCatalog(false); }}
+        onClose={() => {
+          setIsoCatalog(false);
+        }}
       />
     </>
   );
@@ -90,15 +97,15 @@ function UploadIsoFileCard(p: {
 
   const [value, setValue] = React.useState<File | null>(null);
   const [uploadProgress, setUploadProgress] = React.useState<number | null>(
-    null
+    null,
   );
 
   const handleChange = (newValue: File | null) => {
     if (newValue && newValue.size > ServerApi.Config.constraints.iso_max_size) {
       alert(
         `The file is too big (max size allowed: ${filesize(
-          ServerApi.Config.constraints.iso_max_size
+          ServerApi.Config.constraints.iso_max_size,
-        )}`
+        )}`,
       );
       return;
     }
@@ -244,7 +251,7 @@ function IsoFilesList(p: {
   const deleteIso = async (entry: IsoFile) => {
     if (
       !(await confirm(
-        `Do you really want to delete this file (${entry.filename}) ?`
+        `Do you really want to delete this file (${entry.filename}) ?`,
       ))
     )
       return;

virtweb_frontend/src/routes/SysInfoRoute.tsx

@@ -6,7 +6,7 @@ import {
   mdiNetwork,
   mdiPackageVariantClosed,
 } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import {
   Box,
   IconButton,
@@ -81,7 +81,7 @@ export function SysInfoRouteInner(p: {
         free: prev.free + disk.available_space,
       };
     },
-    { used: 0, free: 0 }
+    { used: 0, free: 0 },
   );
 
   return (
@@ -199,6 +199,7 @@ export function SysInfoRouteInner(p: {
           },
           {
             label: "Bootime",
+            // eslint-disable-next-line react-x/purity
             value: new Date(p.info.system.boot_time * 1000).toString(),
           },
           {

virtweb_frontend/src/routes/TokensListRoute.tsx

@@ -69,7 +69,7 @@ export function TokensListRouteInner(p: {
                 <TableCell>Created</TableCell>
                 <TableCell>Updated</TableCell>
                 <TableCell>Last used</TableCell>
-                <TableCell>IP restriction</TableCell>
+                <TableCell>Allowed networks</TableCell>
                 <TableCell>Max inactivity</TableCell>
                 <TableCell>Rights</TableCell>
                 <TableCell>Actions</TableCell>
@@ -97,7 +97,7 @@ export function TokensListRouteInner(p: {
                     <TableCell>
                       <TimeWidget time={t.last_used} />
                     </TableCell>
-                    <TableCell>{t.ip_restriction}</TableCell>
+                    <TableCell>{t.allowed_ip_networks?.join(", ")}</TableCell>
                     <TableCell>
                       {t.max_inactivity && timeDiff(0, t.max_inactivity)}
                     </TableCell>

virtweb_frontend/src/routes/VMListRoute.tsx

@@ -47,6 +47,7 @@ export function VMListRoute(): React.ReactElement {
 
   return (
     <AsyncWidget
+      // eslint-disable-next-line react-hooks/refs
       loadKey={loadKey.current}
       errMsg="Failed to load Virtual Machines list!"
       load={load}
@@ -76,11 +77,11 @@ function VMListWidget(p: {
 }): React.ReactElement {
   const navigate = useNavigate();
 
-  const [hiddenGroups, setHiddenGroups] = React.useState<
+  const [hiddenGroups, setHiddenGroups] = React.useState(() => new Set());
-    Set<string | undefined>
-  >(new Set());
 
-  const [runningVMs, setRunningVMs] = React.useState<Set<string>>(new Set());
+  const [runningVMs, setRunningVMs] = React.useState<Set<string>>(
+    () => new Set(),
+  );
 
   const toggleHiddenGroup = (g: string | undefined) => {
     if (hiddenGroups.has(g)) hiddenGroups.delete(g);
@@ -186,7 +187,7 @@ function VMListWidget(p: {
               {filesize(
                 p.list
                   .filter((v) => runningVMs.has(v.name))
-                  .reduce((s, v) => s + v.memory, 0)
+                  .reduce((s, v) => s + v.memory, 0),
               )}
               {" / "}
               {filesize(p.list.reduce((s, v) => s + v.memory, 0))}

virtweb_frontend/src/routes/VNCRoute.tsx

@@ -88,6 +88,7 @@ function VNCInner(p: { vm: VMInfo }): React.ReactElement {
   };
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     connect(false);
 
     if (vncRef.current) {

virtweb_frontend/src/routes/ViewNWFilterRoute.tsx

@@ -15,7 +15,7 @@ import { NWFilterDetails } from "../widgets/nwfilter/NWFilterDetails";
 export function ViewNWFilterRoute() {
   const { uuid } = useParams();
 
-  const [nwfilter, setNWFilter] = React.useState<NWFilter | undefined>();
+  const [nwFilter, setNWFilter] = React.useState<NWFilter | undefined>();
 
   const load = async () => {
     setNWFilter(await NWFilterApi.GetSingle(uuid!));
@@ -24,10 +24,10 @@ export function ViewNWFilterRoute() {
   return (
     <AsyncWidget
       loadKey={uuid}
-      ready={nwfilter !== undefined}
+      ready={nwFilter !== undefined}
       errMsg="Failed to fetch network filter information!"
       load={load}
-      build={() => <ViewNetworkFilterRouteInner nwfilter={nwfilter!} />}
+      build={() => <ViewNetworkFilterRouteInner nwfilter={nwFilter!} />}
     />
   );
 }

virtweb_frontend/src/routes/auth/LoginRoute.tsx

@@ -41,12 +41,14 @@ export function LoginRoute(): React.ReactElement {
   };
 
   const handleMouseDownPassword = (
-    event: React.MouseEvent<HTMLButtonElement>
+    event: React.MouseEvent<HTMLButtonElement>,
   ) => {
     event.preventDefault();
   };
 
-  const handleLoginSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
+  const handleLoginSubmit = async (
+    event: React.SubmitEvent<HTMLFormElement>,
+  ) => {
     event.preventDefault();
     if (!canSubmit) return;
 

virtweb_frontend/src/utils/NetworkUtils.ts

@@ -0,0 +1,11 @@
+import isCidr from "is-cidr";
+
+/**
+ * Check whether a given IP network address is valid or not
+ *
+ * @param ip The IP network to check
+ * @returns true if the address is valid, false otherwise
+ */
+export function isIPNetworkValid(ip: string): boolean {
+  return isCidr(ip) !== 0;
+}

virtweb_frontend/src/widgets/AsyncWidget.tsx

@@ -1,26 +1,25 @@
 import { Alert, Box, Button, CircularProgress } from "@mui/material";
-import React, { useEffect, useRef, useState } from "react";
+import React from "react";
 
-enum State {
+const State = {
-  Loading,
+  Loading: 0,
-  Ready,
+  Ready: 1,
-  Error,
+  Error: 2,
-}
+} as const;
+
+type State = keyof typeof State;
 
 export function AsyncWidget(p: {
-  loadKey: any;
+  loadKey: unknown;
   load: () => Promise<void>;
   errMsg: string;
   build: () => React.ReactElement;
-  ready?: boolean;
   buildLoading?: () => React.ReactElement;
   buildError?: (e: string) => React.ReactElement;
+  ready?: boolean;
   errAdditionalElement?: () => React.ReactElement;
 }): React.ReactElement {
-  const [state, setState] = useState(State.Loading);
+  const [state, setState] = React.useState(State.Loading as number);
-
-  const counter = useRef<any>(null);
-
   const load = async () => {
     try {
       setState(State.Loading);
@@ -32,12 +31,10 @@ export function AsyncWidget(p: {
     }
   };
 
-  useEffect(() => {
+  React.useEffect(() => {
-    if (counter.current === p.loadKey) return;
-    counter.current = p.loadKey;
-
     load();
-  });
+    // eslint-disable-next-line react-hooks/exhaustive-deps, react-x/exhaustive-deps
+  }, [p.loadKey]);
 
   if (state === State.Error)
     return (
@@ -51,10 +48,6 @@ export function AsyncWidget(p: {
             height: "100%",
             flex: "1",
             flexDirection: "column",
-            backgroundColor: (theme) =>
-              theme.palette.mode === "light"
-                ? theme.palette.grey[100]
-                : theme.palette.grey[900],
           }}
         >
           <Alert
@@ -83,10 +76,6 @@ export function AsyncWidget(p: {
             alignItems: "center",
             height: "100%",
             flex: "1",
-            backgroundColor: (theme) =>
-              theme.palette.mode === "light"
-                ? theme.palette.grey[100]
-                : theme.palette.grey[900],
           }}
         >
           <CircularProgress />

virtweb_frontend/src/widgets/BaseAuthenticatedPage.tsx

@@ -8,7 +8,7 @@ import {
   mdiLan,
   mdiSecurityNetwork,
 } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import {
   Box,
   List,

virtweb_frontend/src/widgets/BaseLoginPage.tsx

@@ -1,5 +1,6 @@
+/* eslint-disable react-x/purity */
 import { mdiServer } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import Avatar from "@mui/material/Avatar";
 import Box from "@mui/material/Box";
 import CssBaseline from "@mui/material/CssBaseline";

virtweb_frontend/src/widgets/DateWidget.tsx

@@ -1,5 +1,7 @@
+import React from "react";
+
 export function DateWidget(p: { time: number }): React.ReactElement {
-  const date = new Date(p.time * 1000);
+  const date = React.useMemo(() => new Date(p.time * 1000), [p.time]);
 
   return (
     <>

virtweb_frontend/src/widgets/FileDiskImageWidget.tsx

@@ -2,7 +2,7 @@ import { Avatar, ListItem, ListItemAvatar, ListItemText } from "@mui/material";
 import { DiskImage } from "../api/DiskImageApi";
 import { mdiHarddisk } from "@mdi/js";
 import { filesize } from "filesize";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 
 export function FileDiskImageWidget(p: {
   image: DiskImage;

virtweb_frontend/src/widgets/TimeWidget.tsx

@@ -1,11 +1,11 @@
 import { Tooltip } from "@mui/material";
-import date from "date-and-time";
+import { format } from "date-and-time";
 import { time } from "../utils/DateUtils";
 
 export function formatDate(time: number): string {
   const t = new Date();
   t.setTime(1000 * time);
-  return date.format(t, "DD/MM/YYYY HH:mm:ss");
+  return format(t, "DD/MM/YYYY HH:mm:ss");
 }
 
 export function timeDiff(a: number, b: number): string {

virtweb_frontend/src/widgets/VirtWebAppBar.tsx

@@ -1,5 +1,5 @@
 import { mdiLogout, mdiServer } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import { AppBar, IconButton, Toolbar, Typography } from "@mui/material";
 import { RouterLink } from "./RouterLink";
 import { AsyncWidget } from "./AsyncWidget";

virtweb_frontend/src/widgets/forms/IPInput.tsx

@@ -33,6 +33,7 @@ export function IPInputWithMask(p: {
 
   const currValue =
     p.ipAndMask ??
+    // eslint-disable-next-line react-hooks/refs
     `${p.ip ?? ""}${p.mask || showSlash.current ? "/" : ""}${p.mask ?? ""}`;
 
   const { onValueChange, ...props } = p;
@@ -58,7 +59,7 @@ export function IPInputWithMask(p: {
         onValueChange?.(
           ip,
           mask,
-          mask || showSlash.current ? `${ip}/${mask ?? ""}` : ip
+          mask || showSlash.current ? `${ip}/${mask ?? ""}` : ip,
         );
       }}
       value={currValue}

virtweb_frontend/src/widgets/forms/NWFSelectReferencedFilters.tsx

@@ -20,12 +20,13 @@ export function NWFSelectReferencedFilters(p: {
       p.excludedFilters
         ? p.nwFiltersList.filter((f) => !p.excludedFilters!.includes(f.name))
         : p.nwFiltersList,
-    [p.excludedFilters]
+    [p.excludedFilters, p.nwFiltersList],
   );
 
   const selectedFilters = React.useMemo(
     () => p.selected.map((f) => p.nwFiltersList.find((s) => s.name === f)),
-    [p.selected.length]
+    // eslint-disable-next-line react-x/exhaustive-deps
+    [p.selected.length, p.nwFiltersList],
   );
 
   return (

virtweb_frontend/src/widgets/forms/NetDHCPHostReservations.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react-x/no-array-index-key */
 import { mdiIp } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import DeleteIcon from "@mui/icons-material/Delete";
 import {
   Avatar,

virtweb_frontend/src/widgets/forms/NetworksInput.tsx

@@ -0,0 +1,28 @@
+import { isIPNetworkValid } from "../../utils/NetworkUtils";
+import { TextInput } from "./TextInput";
+
+function rebuildNetworksList(val?: string): string[] | undefined {
+  if (!val || val.trim() === "") return undefined;
+
+  return val.split(",").map((v) => v.trim());
+}
+
+export function NetworksInput(p: {
+  editable: boolean;
+  label: string;
+  value?: string[];
+  onChange: (n: string[] | undefined) => void;
+}): React.ReactElement {
+  const textValue = (p.value ?? []).join(", ").trim();
+  return (
+    <TextInput
+      {...p}
+      type="string"
+      value={textValue}
+      onValueChange={(i) => {
+        p.onChange(rebuildNetworksList(i));
+      }}
+      checkValue={(v) => (rebuildNetworksList(v) ?? []).every(isIPNetworkValid)}
+    />
+  );
+}

virtweb_frontend/src/widgets/forms/VMDisksList.tsx

@@ -1,5 +1,5 @@
 import { mdiHarddiskPlus } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import CheckCircleIcon from "@mui/icons-material/CheckCircle";
 import DeleteIcon from "@mui/icons-material/Delete";
 import ExpandIcon from "@mui/icons-material/Expand";
@@ -125,7 +125,7 @@ function DiskInfo(p: {
       `You asked to delete the disk ${p.disk.name}. Do you want to keep the block file or not ? `,
       "Delete disk",
       "Keep the file",
-      "Delete the file"
+      "Delete the file",
     );
 
     if (!(await confirm("Do you really want to delete this disk?"))) return;

virtweb_frontend/src/widgets/forms/VMNetworksList.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react-x/no-array-index-key */
 import { mdiNetworkOutline } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import DeleteIcon from "@mui/icons-material/Delete";
 import {
   Avatar,
@@ -191,7 +191,7 @@ function NetworkInfoWidget(p: {
             editable={p.editable}
             label="Defined network"
             options={p.networksList.map((n) => {
-              const chars = [n.forward_mode.toString()];
+              const chars = [n.forward_mode as string];
               if (n.ip_v4) chars.push("IPv4");
               if (n.ip_v6) chars.push("IPv6");
               if (n.description) chars.push(n.description);

virtweb_frontend/src/widgets/forms/VMSelectIsoInput.tsx

@@ -11,7 +11,7 @@ import {
 } from "@mui/material";
 import DeleteIcon from "@mui/icons-material/Delete";
 import { mdiDisc } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 
 export function VMSelectIsoInput(p: {
   editable: boolean;

virtweb_frontend/src/widgets/nwfilter/NWFilterItem.tsx

@@ -1,5 +1,5 @@
 import { mdiSecurityNetwork } from "@mdi/js";
-import Icon from "@mdi/react";
+import { Icon } from "@mdi/react";
 import DeleteIcon from "@mui/icons-material/Delete";
 
 import {

virtweb_frontend/src/widgets/tokens/APITokenDetails.tsx

@@ -14,8 +14,7 @@ import { useSnackbar } from "../../hooks/providers/SnackbarProvider";
 import { AsyncWidget } from "../AsyncWidget";
 import { TabsWidget } from "../TabsWidget";
 import { EditSection } from "../forms/EditSection";
-import { IPInputWithMask } from "../forms/IPInput";
+import { NetworksInput } from "../forms/NetworksInput";
-import { RadioGroupInput } from "../forms/RadioGroupInput";
 import { TextInput } from "../forms/TextInput";
 import { TokenRawRightsEditor } from "./TokenRawRightsEditor";
 import { TokenRightsEditor } from "./TokenRightsEditor";
@@ -35,17 +34,17 @@ interface DetailsProps {
 }
 
 export function APITokenDetails(p: DetailsProps): React.ReactElement {
-  const [vms, setVMs] = React.useState<VMInfo[]>();
+  const [vms, setVms] = React.useState<VMInfo[]>();
   const [groups, setGroups] = React.useState<string[]>();
   const [networks, setNetworks] = React.useState<NetworkInfo[]>();
-  const [nwFilters, setNetworkFilters] = React.useState<NWFilter[]>();
+  const [nwFilters, setNwFilters] = React.useState<NWFilter[]>();
   const [tokens, setTokens] = React.useState<APIToken[]>();
 
   const load = async () => {
-    setVMs(await VMApi.GetList());
+    setVms(await VMApi.GetList());
     setGroups(await GroupApi.GetList());
     setNetworks(await NetworkApi.GetList());
-    setNetworkFilters(await NWFilterApi.GetList());
+    setNwFilters(await NWFilterApi.GetList());
     setTokens(await TokensApi.GetList());
   };
 
@@ -121,10 +120,6 @@ function APITokenDetailsInner(p: DetailsInnerProps): React.ReactElement {
 }
 
 function APITokenTabGeneral(p: DetailsInnerProps): React.ReactElement {
-  const [ipVersion, setIpVersion] = React.useState<4 | 6>(
-    (p.token.ip_restriction ?? "").includes(":") ? 6 : 4
-  );
-
   return (
     <Grid container spacing={2}>
       {/* Metadata section */}
@@ -158,29 +153,13 @@ function APITokenTabGeneral(p: DetailsInnerProps): React.ReactElement {
       </EditSection>
 
       <EditSection title="General settings">
-        {p.status === TokenWidgetStatus.Create && (
+        <NetworksInput
-          <RadioGroupInput
-            {...p}
-            editable={true}
-            options={[
-              { label: "IPv4", value: "4" },
-              { label: "IPv6", value: "6" },
-            ]}
-            value={ipVersion.toString()}
-            onValueChange={(v) => {
-              setIpVersion(Number(v) as 4 | 6);
-            }}
-            label="Token IP restriction version"
-          />
-        )}
-        <IPInputWithMask
           {...p}
-          label="Token IP network restriction"
+          label="Allowd IP networks (comma-separated list, leave empty to allow from anywhere)"
-          ipAndMask={p.token.ip_restriction}
           editable={p.status === TokenWidgetStatus.Create}
-          version={ipVersion}
+          value={p.token.allowed_ip_networks}
-          onValueChange={(_ip, _mask, ipAndMask) => {
+          onChange={(v) => {
-            p.token.ip_restriction = ipAndMask;
+            p.token.allowed_ip_networks = v;
             p.onChange?.();
           }}
         />
@@ -239,7 +218,7 @@ function APITokenTabDanger(p: DetailsInnerProps): React.ReactElement {
         !(await confirm(
           "Do you really want to delete this API token?",
           `Delete API token ${p.token.name}`,
-          "Delete"
+          "Delete",
         ))
       )
         return;

virtweb_frontend/tsconfig.app.json

@@ -6,6 +6,7 @@
     "lib": ["ES2020", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,
+    "types": ["node"],
 
     /* Bundler mode */
     "moduleResolution": "bundler",