Function LANSyncDialog

packages/app/src/components/settings/LANSyncDialog.tsx:23–383

({ open, onClose, mode }: LANSyncDialogProps)

}

export function LANSyncDialog({ open, onClose, mode }: LANSyncDialogProps) {
  const { t } = useTranslation();
  const { syncWithBackend } = useSyncStore();

  const isManualIPError = useCallback((message: string): boolean => {
    return (
      message.includes("Could not determine local IP address") ||
      message.includes("Failed to get local IP") ||
      message.includes("Cannot auto-detect IP address")
    );
  }, []);

  const normalizeServerError = useCallback(
    (message: string): string => {
      if (message.includes("Tauri desktop runtime is required")) {
        return t("settings.syncLANTauriRequired");
      }
      return message;
    },
    [t],
  );

  // Server state
  const [serverStatus, setServerStatus] = useState<LANServerStatus>("idle");
  const [qrData, setQRData] = useState<LANQRData | null>(null);
  const [server, setServer] = useState<ReturnType<typeof createLANServer> | null>(null);

  // Client state
  const [connectionState, setConnectionState] = useState<LANConnectionState>("idle");
  const [manualIP, setManualIP] = useState("");
  const [manualPort, setManualPort] = useState("");
  const [manualPairCode, setManualPairCode] = useState("");

  // Manual IP for server (when auto-detection fails)
  const [showManualIPInput, setShowManualIPInput] = useState(false);
  const [manualServerIP, setManualServerIP] = useState("");

  const [error, setError] = useState("");

  const confirmLanImport = useCallback(() => {
    return window.confirm(
      t(
        "settings.syncLANImportWarning",
        "This will overwrite this device's database, books, and covers with the server device data. Use it for migration, not two-way merge.",
      ),
    );
  }, [t]);

  // Server mode: start/stop server
  const handleStartServer = useCallback(async () => {
    setError("");
    setServerStatus("starting");
    setShowManualIPInput(false);

    try {
      const deviceName = `ReadAny Desktop`;

      const newServer = createLANServer({