Merge pull request #178 from meienberger/fix/api-custom-port

fix: add port to api url if it is not 80

docker-compose.dev.yml

@@ -93,8 +93,9 @@ services:
     networks:
       - tipi_main_network
     environment:
-      - INTERNAL_IP=${INTERNAL_IP}
-      - DOMAIN=${DOMAIN}
+      INTERNAL_IP: ${INTERNAL_IP}
+      DOMAIN: ${DOMAIN}
+      NGINX_PORT: ${NGINX_PORT-80}
     volumes:
       - ${PWD}/packages/dashboard/src:/dashboard/src
       # - /dashboard/node_modules

docker-compose.rc.yml

@@ -99,6 +99,7 @@ services:
       INTERNAL_IP: ${INTERNAL_IP}
       NODE_ENV: production
       DOMAIN: ${DOMAIN}
+      NGINX_PORT: ${NGINX_PORT-80}
     labels:
       traefik.enable: true
       traefik.http.routers.dashboard-redirect.rule: PathPrefix("/")

docker-compose.yml

@@ -100,6 +100,7 @@ services:
       INTERNAL_IP: ${INTERNAL_IP}
       NODE_ENV: production
       DOMAIN: ${DOMAIN}
+      NGINX_PORT: ${NGINX_PORT-80}
     labels:
       traefik.enable: true
       traefik.http.routers.dashboard-redirect.rule: PathPrefix("/")

packages/dashboard/src/hooks/useCachedRessources.ts

@@ -16,7 +16,7 @@ const fetcher: BareFetcher<any> = (url: string) => {
 };
 
 export default function useCachedResources(): IReturnProps {
-  const { data } = useSWR<{ ip: string; domain: string }>('api/ip', fetcher);
+  const { data } = useSWR<{ ip: string; domain: string; port: string }>('api/ip', fetcher);
   const { baseUrl, setBaseUrl, setInternalIp, setDomain } = useSytemStore();
   const [isLoadingComplete, setLoadingComplete] = useState(false);
   const [client, setClient] = useState<ApolloClient<unknown>>();
@@ -35,13 +35,17 @@ export default function useCachedResources(): IReturnProps {
   }
 
   useEffect(() => {
-    const { ip, domain } = data || {};
+    const { ip, domain, port } = data || {};
     if (ip && !baseUrl) {
       setInternalIp(ip);
       setDomain(domain);
 
       if (!domain || domain === 'tipi.localhost') {
-        setBaseUrl(`http://${ip}/api`);
+        if (port === '80') {
+          setBaseUrl(`http://${ip}/api`);
+        } else {
+          setBaseUrl(`http://${ip}:${port}/api`);
+        }
       } else {
         setBaseUrl(`https://${domain}/api`);
       }

packages/dashboard/src/pages/api/ip.tsx

@@ -1,6 +1,7 @@
 export default function ip(_: any, res: any) {
   const { INTERNAL_IP } = process.env;
+  const { NGINX_PORT } = process.env;
   const { DOMAIN } = process.env;
 
-  res.status(200).json({ ip: INTERNAL_IP, domain: DOMAIN });
+  res.status(200).json({ ip: INTERNAL_IP, domain: DOMAIN, port: NGINX_PORT });
 }