Fix reactivity issue for CIDR to mask (#27)

.codacy.yml

@@ -19,10 +19,6 @@ duplication:
   exclude_paths:
     - "tests/**"
 
-engines:
-  eslint:
-    config_file: eslintrc.config.js
-
 # Exclude patterns - ignore test files and build artifacts from analysis
 exclude_paths:
   - "tests/**"
@@ -47,6 +43,7 @@ engines:
   # ESLint configuration (if you want to customize)
   eslint:
     enabled: true
+    config_file: eslintrc.config.js
     exclude_paths:
       - "tests/**"
 
@@ -56,12 +53,6 @@ engines:
     exclude_paths:
       - "tests/**"
 
-# Additional configuration
-duplication:
-  enabled: true
-  exclude_paths:
-    - "tests/**"
-
 # Complexity and code style checks
 metrics:
   enabled: true

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "networking-toolbox",
 	"private": true,
-	"version": "1.5.0",
+	"version": "1.6.0",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",

src/lib/stores/theme.ts

@@ -64,17 +64,7 @@ function loadCustomFont(fontConfig: { name: string; url: string; fallback?: stri
           if (fontLoaded) {
             document.documentElement.classList.remove('fonts-loading');
             document.documentElement.classList.add('fonts-loaded');
-            logger.debug(`Font loaded successfully: ${fontFamily}`, {
-              font: fontFamily,
-              component: 'ThemeStore',
-            });
           } else {
-            // Font stylesheet loaded but font not available yet
-            logger.debug(`Font stylesheet loaded, waiting for font: ${fontFamily}`, {
-              font: fontFamily,
-              component: 'ThemeStore',
-            });
-
             // Set a timeout fallback (3 seconds)
             setTimeout(() => {
               document.documentElement.classList.remove('fonts-loading');

src/routes/cidr/mask-converter/+layout.svelte

@@ -32,13 +32,17 @@
 
   function getSubnetInfo(c: number) {
     const subnet = COMMON_SUBNETS.find((s) => s.cidr === c);
-    return (
-      subnet || {
-        cidr: c,
-        mask: cidrToMask(c).octets.join('.'),
-        hosts: Math.pow(2, 32 - c) - 2,
-      }
-    );
+    if (subnet) return subnet;
+
+    // Calculate usable hosts per RFC 3021
+    const totalAddresses = Math.pow(2, 32 - c);
+    const hosts = c === 32 ? 1 : c === 31 ? 2 : totalAddresses - 2;
+
+    return {
+      cidr: c,
+      mask: cidrToMask(c).octets.join('.'),
+      hosts,
+    };
   }
 
   const subnetInfo = derived(cidr, ($c) => getSubnetInfo($c));
@@ -121,7 +125,7 @@
         <div class="info-metric">
           <span class="info-label">Usable Hosts</span>
           <span class="metric-value success">
-            {get(subnetInfo).hosts.toLocaleString()}
+            {$subnetInfo.hosts.toLocaleString()}
           </span>
         </div>
       </Tooltip>