update miletruth page and remove unwanted files

src/components/layout/LoadingScreen.tsx

@@ -0,0 +1,114 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+import { usePathname } from "next/navigation";
+import Image from "next/image";
+
+/**
+ * LoadingScreen
+ * ---------------------------------------------------------------------------
+ * Native reimplementation of the legacy WordPress page-loader: a black
+ * full-screen overlay with a centered, pulsing Doormile logo that fades out.
+ *
+ * Shows on initial load (until the window finishes loading, min ~450ms to avoid
+ * a flash, capped at 2.5s so it never blocks) and again briefly on each route
+ * navigation. CWV-safe: fixed/out-of-flow (no layout shift), logo is priority,
+ * and it never delays hydration.
+ */
+type Phase = "visible" | "hiding" | "gone";
+
+const MIN_SHOW_MS = 450;
+const MAX_SHOW_MS = 2500;
+const NAV_SHOW_MS = 520;
+
+export default function LoadingScreen() {
+  const pathname = usePathname();
+  const [phase, setPhase] = useState<Phase>("visible");
+  const isFirstRender = useRef(true);
+
+  // Initial load: hide once the page is ready.
+  useEffect(() => {
+    const start = performance.now();
+    let began = false;
+    let fadeTimer: ReturnType<typeof setTimeout>;
+
+    const begin = () => {
+      if (began) return;
+      began = true;
+      const wait = Math.max(0, MIN_SHOW_MS - (performance.now() - start));
+      fadeTimer = setTimeout(() => setPhase("hiding"), wait);
+    };
+
+    const cap = setTimeout(begin, MAX_SHOW_MS);
+    const onReady = () => begin();
+
+    if (document.readyState === "complete") begin();
+    else window.addEventListener("load", onReady, { once: true });
+
+    return () => {
+      clearTimeout(cap);
+      clearTimeout(fadeTimer);
+      window.removeEventListener("load", onReady);
+    };
+  }, []);
+
+  // Route navigations: flash the loader briefly for an app-like transition.
+  useEffect(() => {
+    if (isFirstRender.current) {
+      isFirstRender.current = false;
+      return;
+    }
+    setPhase("visible");
+    const t = setTimeout(() => setPhase("hiding"), NAV_SHOW_MS);
+    return () => clearTimeout(t);
+  }, [pathname]);
+
+  if (phase === "gone") return null;
+
+  return (
+    <div
+      className={`dm-loader${phase === "hiding" ? " is-hiding" : ""}`}
+      role="status"
+      aria-live="polite"
+      aria-label="Loading"
+      onTransitionEnd={(e) => {
+        if (e.propertyName === "opacity" && phase === "hiding") setPhase("gone");
+      }}
+    >
+      <div className="dm-loader__pulse">
+        <Image
+          src="/images/preloader.png"
+          alt="Doormile"
+          width={200}
+          height={38}
+          priority
+          className="dm-loader__logo"
+        />
+      </div>
+
+      <style>{`
+        .dm-loader {
+          position: fixed;
+          inset: 0;
+          z-index: 100000;
+          display: grid;
+          place-items: center;
+          background: #000;
+          opacity: 1;
+          transition: opacity 0.32s ease;
+          will-change: opacity;
+        }
+        .dm-loader.is-hiding { opacity: 0; pointer-events: none; }
+        .dm-loader__pulse { animation: dmLoaderPulse 1.5s linear infinite; }
+        .dm-loader__logo { width: clamp(140px, 18vw, 200px); height: auto; }
+        @keyframes dmLoaderPulse {
+          50%  { transform: scale(0.85); }
+          100% { transform: scale(1); }
+        }
+        @media (prefers-reduced-motion: reduce) {
+          .dm-loader__pulse { animation: none; }
+        }
+      `}</style>
+    </div>
+  );
+}