fix: add hostname check to decide http mode in windows (#739)

* fix: add hostname check to decide http mode in windows * chore: extract into utils isHttpMode function
getAlby · Oct 22, 2024 · 0e9abe5 · 0e9abe5
1 parent 252be86
commit 0e9abe5
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 13 deletions.
diff --git a/frontend/src/components/ExternalLink.tsx b/frontend/src/components/ExternalLink.tsx
@@ -1,4 +1,5 @@
 import { Link } from "react-router-dom";
+import { isHttpMode } from "src/utils/isHttpMode";
 import { openLink } from "src/utils/openLink";
 
 type Props = {
@@ -8,9 +9,9 @@ type Props = {
 };
 
 export default function ExternalLink({ to, className, children }: Props) {
-  const isHttpMode = window.location.protocol.startsWith("http");
+  const _isHttpMode = isHttpMode();
 
-  return isHttpMode ? (
+  return _isHttpMode ? (
     <Link
       to={to}
       target="_blank"

diff --git a/frontend/src/components/layouts/AppLayout.tsx b/frontend/src/components/layouts/AppLayout.tsx
@@ -53,6 +53,7 @@ import { useInfo } from "src/hooks/useInfo";
 import { useRemoveSuccessfulChannelOrder } from "src/hooks/useRemoveSuccessfulChannelOrder";
 import { deleteAuthToken } from "src/lib/auth";
 import { cn } from "src/lib/utils";
+import { isHttpMode } from "src/utils/isHttpMode";
 import { openLink } from "src/utils/openLink";
 import ExternalLink from "../ExternalLink";
 
@@ -65,6 +66,8 @@ export default function AppLayout() {
   const navigate = useNavigate();
   useRemoveSuccessfulChannelOrder();
 
+  const _isHttpMode = isHttpMode();
+
   React.useEffect(() => {
     setMobileMenuOpen(false);
   }, [location]);
@@ -73,15 +76,12 @@ export default function AppLayout() {
     deleteAuthToken();
     await refetchInfo();
 
-    const isHttpMode = window.location.protocol.startsWith("http");
-    if (isHttpMode) {
+    if (_isHttpMode) {
       window.location.href = "/logout";
     } else {
       navigate("/", { replace: true });
     }
-  }, [navigate, refetchInfo]);
-
-  const isHttpMode = window.location.protocol.startsWith("http");
+  }, [_isHttpMode, navigate, refetchInfo]);
 
   if (!info) {
     return null;
@@ -115,7 +115,7 @@ export default function AppLayout() {
           )}
         </DropdownMenuGroup>
         <DropdownMenuSeparator />
-        {isHttpMode && (
+        {_isHttpMode && (
           <DropdownMenuItem
             onClick={logout}
             className="w-full flex flex-row items-center gap-2 cursor-pointer"

diff --git a/frontend/src/screens/BackupNode.tsx b/frontend/src/screens/BackupNode.tsx
@@ -13,6 +13,7 @@ import { LoadingButton } from "src/components/ui/loading-button";
 import { useToast } from "src/components/ui/use-toast";
 
 import { handleRequestError } from "src/utils/handleRequestError";
+import { isHttpMode } from "src/utils/isHttpMode";
 import { request } from "src/utils/request";
 
 export function BackupNode() {
@@ -27,12 +28,12 @@ export function BackupNode() {
   const onSubmitPassword = async (e: React.FormEvent) => {
     e.preventDefault();
 
-    const isHttpMode = window.location.protocol.startsWith("http");
+    const _isHttpMode = isHttpMode();
 
     try {
       setLoading(true);
 
-      if (isHttpMode) {
+      if (_isHttpMode) {
         const response = await fetch("/api/backup", {
           method: "POST",
           headers: {

diff --git a/frontend/src/screens/setup/RestoreNode.tsx b/frontend/src/screens/setup/RestoreNode.tsx
@@ -21,6 +21,7 @@ import { useToast } from "src/components/ui/use-toast";
 
 import { useInfo } from "src/hooks/useInfo";
 import { handleRequestError } from "src/utils/handleRequestError";
+import { isHttpMode } from "src/utils/isHttpMode";
 import { request } from "src/utils/request";
 
 export function RestoreNode() {
@@ -34,7 +35,7 @@ export function RestoreNode() {
   const [loading, setLoading] = useState(false);
   const [restored, setRestored] = useState(false);
   const { data: info } = useInfo(restored);
-  const isHttpMode = window.location.protocol.startsWith("http");
+  const _isHttpMode = isHttpMode();
 
   React.useEffect(() => {
     if (restored && info?.setupCompleted) {
@@ -71,7 +72,7 @@ export function RestoreNode() {
     try {
       setLoading(true);
 
-      if (isHttpMode) {
+      if (_isHttpMode) {
         const formData = new FormData();
         formData.append("unlockPassword", unlockPassword);
         if (file !== null) {
@@ -128,7 +129,7 @@ export function RestoreNode() {
             placeholder="Unlock Password"
           />
         </div>
-        {isHttpMode && (
+        {_isHttpMode && (
           <div className="grid gap-2">
             <Label htmlFor="backup">Backup File</Label>
             <Input

diff --git a/frontend/src/utils/isHttpMode.ts b/frontend/src/utils/isHttpMode.ts
@@ -0,0 +1,6 @@
+export const isHttpMode = () => {
+  return (
+    window.location.protocol.startsWith("http") &&
+    !window.location.hostname.startsWith("wails")
+  );
+};