feat: centralize URL generation with customGetHostProtocol and customGetMCPUrl utilities (#8076)

 (index.tsx): introduce customGetHostProtocol function to get host protocol dynamically for URL construction
♻️ (index.tsx): refactor URL construction in index.tsx to use customGetHostProtocol function for better code organization and reusability
📝 (custom-mcp-url.ts): add customGetMCPUrl function to generate MCP URL based on project ID
📝 (McpServerTab.tsx): update McpServerTab component to use customGetMCPUrl function for constructing MCP URL based on project ID and improve code readability
This commit is contained in:
Cristhian Zanforlin Lousa 2025-05-16 14:55:51 -03:00 committed by GitHub
commit 7e8d902d3f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 17 additions and 8 deletions

View file

@ -1,4 +1,5 @@
import { GRADIENT_CLASS_DISABLED } from "@/constants/constants";
import { customGetHostProtocol } from "@/customization/utils/custom-get-host-protocol";
import useAlertStore from "@/stores/alertStore";
import useFlowStore from "@/stores/flowStore";
import { useMemo, useRef, useState } from "react";
@ -9,8 +10,9 @@ import { InputProps, TextAreaComponentType } from "../../types";
const BACKEND_URL = "BACKEND_URL";
const MCP_SSE_VALUE = "MCP_SSE";
const URL_WEBHOOK = `${window.location.protocol}//${window.location.host}/api/v1/webhook/`;
const URL_MCP_SSE = `${window.location.protocol}//${window.location.host}/api/v1/mcp/sse`;
const { protocol, host } = customGetHostProtocol();
const URL_WEBHOOK = `${protocol}//${host}/api/v1/webhook/`;
const URL_MCP_SSE = `${protocol}//${host}/api/v1/mcp/sse`;
const inputClasses = {
base: ({ isFocused }: { isFocused: boolean }) =>

View file

@ -1,4 +1,5 @@
import { GRADIENT_CLASS } from "@/constants/constants";
import { customGetHostProtocol } from "@/customization/utils/custom-get-host-protocol";
import { getCurlWebhookCode } from "@/modals/apiModal/utils/get-curl-code";
import ComponentTextModal from "@/modals/textAreaModal";
import { useEffect, useMemo, useRef, useState } from "react";
@ -21,7 +22,9 @@ const inputClasses = {
const WEBHOOK_VALUE = "CURL_WEBHOOK";
const MCP_SSE_VALUE = "MCP_SSE";
const URL_MCP_SSE = `${window.location.protocol}//${window.location.host}/api/v1/mcp/sse`;
const { protocol, host } = customGetHostProtocol();
const URL_MCP_SSE = `${protocol}//${host}/api/v1/mcp/sse`;
const externalLinkIconClasses = {
gradient: ({

View file

@ -0,0 +1,7 @@
import { api } from "@/controllers/API/api";
export const customGetMCPUrl = (projectId: string) => {
const apiHost = api.defaults.baseURL || window.location.origin;
const apiUrl = `${apiHost}/api/v1/mcp/project/${projectId}/sse`;
return apiUrl;
};

View file

@ -3,13 +3,12 @@ import ShadTooltip from "@/components/common/shadTooltipComponent";
import ToolsComponent from "@/components/core/parameterRenderComponent/components/ToolsComponent";
import { Button } from "@/components/ui/button";
import { createApiKey } from "@/controllers/API";
import { api } from "@/controllers/API/api";
import {
useGetFlowsMCP,
usePatchFlowsMCP,
} from "@/controllers/API/queries/mcp";
import { PROXY_TARGET } from "@/customization/config-constants";
import useTheme from "@/customization/hooks/use-custom-theme";
import { customGetMCPUrl } from "@/customization/utils/custom-mcp-url";
import useAuthStore from "@/stores/authStore";
import { useFolderStore } from "@/stores/foldersStore";
import { MCPSettingsType } from "@/types/mcp";
@ -62,9 +61,7 @@ const McpServerTab = ({ folderName }: { folderName: string }) => {
},
};
const apiHost = api.defaults.baseURL || window.location.origin;
const apiUrl = `${apiHost}/api/v1/mcp/project/${projectId}/sse`;
const apiUrl = customGetMCPUrl(projectId);
const MCP_SERVER_JSON = `{
"mcpServers": {