[Init] Initial commit - NetMesh terminal manager

components/ui/lazy-load-boundary.tsx

@@ -0,0 +1,72 @@
+import React, { Component } from "react";
+import { cn } from "../../lib/utils";
+
+type LazyLoadBoundaryProps = {
+  children: React.ReactNode;
+  className?: string;
+  fallback?: React.ReactNode | ((error: Error) => React.ReactNode);
+  name?: string;
+  resetKey?: React.Key | null;
+};
+
+type LazyLoadBoundaryState = {
+  error: Error | null;
+  retryKey: number;
+};
+
+export class LazyLoadBoundary extends Component<LazyLoadBoundaryProps, LazyLoadBoundaryState> {
+  declare props: Readonly<LazyLoadBoundaryProps>;
+  declare setState: React.Component<LazyLoadBoundaryProps, LazyLoadBoundaryState>["setState"];
+  state: LazyLoadBoundaryState = { error: null, retryKey: 0 };
+
+  static getDerivedStateFromError(error: Error): Partial<LazyLoadBoundaryState> {
+    return { error };
+  }
+
+  componentDidUpdate(prevProps: LazyLoadBoundaryProps) {
+    if (prevProps.resetKey !== this.props.resetKey && this.state.error) {
+      this.setState({ error: null });
+    }
+  }
+
+  private retry = () => {
+    if (typeof window !== "undefined" && typeof window.location?.reload === "function") {
+      window.location.reload();
+      return;
+    }
+    this.setState(({ retryKey }) => ({ error: null, retryKey: retryKey + 1 }));
+  };
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    console.error(`[LazyLoadBoundary] ${this.props.name || "content"} failed:`, error, errorInfo.componentStack);
+  }
+
+  render() {
+    if (this.state.error) {
+      const { fallback } = this.props;
+      if (typeof fallback === "function") return fallback(this.state.error);
+      if (fallback) return fallback;
+      const label = this.props.name || "This area";
+      return (
+        <div
+          className={cn(
+            "flex h-full min-h-[120px] flex-col items-center justify-center gap-2 p-4 text-center text-sm text-muted-foreground",
+            this.props.className,
+          )}
+          role="alert"
+        >
+          <div className="font-medium text-foreground">{label} could not load.</div>
+          <button
+            type="button"
+            className="rounded-md border border-border px-3 py-1.5 text-xs font-medium text-foreground transition-colors hover:bg-muted"
+            onClick={this.retry}
+          >
+            Reload
+          </button>
+        </div>
+      );
+    }
+
+    return <React.Fragment key={this.state.retryKey}>{this.props.children}</React.Fragment>;
+  }
+}