Merge pull request #23362 from BerriAI/litellm_ui_model_mcp

[Fix] Null safe checks for MCP Hub Tab
This commit is contained in:
yuneng-jiang
2026-03-11 10:50:54 -07:00
committed by GitHub
@@ -136,7 +136,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
setLoading(true);
const _modelHubData = await modelHubPublicModelsCall();
console.log("ModelHubData:", _modelHubData);
setModelHubData(_modelHubData);
setModelHubData(Array.isArray(_modelHubData) ? _modelHubData : []);
} catch (error) {
console.error("There was an error fetching the public model data", error);
setServiceStatus("Service unavailable");
@@ -150,7 +150,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
setAgentLoading(true);
const _agentHubData = await agentHubPublicModelsCall();
console.log("AgentHubData:", _agentHubData);
setAgentHubData(_agentHubData);
setAgentHubData(Array.isArray(_agentHubData) ? _agentHubData : []);
} catch (error) {
console.error("There was an error fetching the public agent data", error);
} finally {
@@ -163,7 +163,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
setMcpLoading(true);
const _mcpHubData = await mcpHubPublicServersCall();
console.log("MCPHubData:", _mcpHubData);
setMcpHubData(_mcpHubData);
setMcpHubData(Array.isArray(_mcpHubData) ? _mcpHubData : []);
} catch (error) {
console.error("There was an error fetching the public MCP server data", error);
} finally {
@@ -199,7 +199,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
const getUniqueProviders = (data: ModelGroupInfo[]) => {
const providers = new Set<string>();
data.forEach((model) => {
model.providers.forEach((provider) => providers.add(provider));
(model.providers ?? []).forEach((provider) => providers.add(provider));
});
return Array.from(providers);
};
@@ -532,7 +532,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
accessorKey: "providers",
enableSorting: true,
cell: ({ row }) => {
const providers = row.original.providers;
const providers = row.original.providers ?? [];
return (
<div className="flex flex-wrap gap-1">
@@ -760,7 +760,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
accessorKey: "description",
enableSorting: false,
cell: ({ row }) => {
const description = row.original.description;
const description = row.original.description ?? "";
const truncated = description.length > 80 ? description.substring(0, 80) + "..." : description;
return (
<Tooltip title={description}>
@@ -897,7 +897,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
accessorKey: "mcp_info.description",
enableSorting: false,
cell: ({ row }) => {
const description = row.original.mcp_info?.description || "-";
const description = String(row.original.mcp_info?.description ?? "-");
const truncated = description.length > 80 ? description.substring(0, 80) + "..." : description;
return (
<Tooltip title={description}>
@@ -912,7 +912,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
accessorKey: "url",
enableSorting: false,
cell: ({ row }) => {
const url = row.original.url;
const url = row.original.url ?? "";
const truncated = url.length > 40 ? url.substring(0, 40) + "..." : url;
return (
<Tooltip title={url}>
@@ -1336,7 +1336,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
<div>
<Text className="font-medium">Providers:</Text>
<div className="flex flex-wrap gap-1 mt-1">
{selectedModel.providers.map((provider) => {
{(selectedModel.providers ?? []).map((provider) => {
const { logo } = getProviderLogoAndName(provider);
return (
<Tag key={provider} color="blue">
@@ -1460,7 +1460,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
)}
{/* Supported OpenAI Parameters */}
{selectedModel.supported_openai_params && (
{selectedModel.supported_openai_params && selectedModel.supported_openai_params.length > 0 && (
<div>
<Text className="text-lg font-semibold mb-4">Supported OpenAI Parameters</Text>
<div className="flex flex-wrap gap-2">
@@ -1634,7 +1634,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
<div>
<Text className="font-medium">Input Modes:</Text>
<div className="flex flex-wrap gap-1 mt-1">
{selectedAgent.defaultInputModes?.map((mode) => (
{(selectedAgent.defaultInputModes ?? []).map((mode) => (
<Tag key={mode} color="blue">
{mode}
</Tag>
@@ -1644,7 +1644,7 @@ const PublicModelHub: React.FC<PublicModelHubProps> = ({ accessToken, isEmbedded
<div>
<Text className="font-medium">Output Modes:</Text>
<div className="flex flex-wrap gap-1 mt-1">
{selectedAgent.defaultOutputModes?.map((mode) => (
{(selectedAgent.defaultOutputModes ?? []).map((mode) => (
<Tag key={mode} color="blue">
{mode}
</Tag>