Better display of connector metadata on main status page (#280)

This commit is contained in:
Chris Weaver 2023-08-12 17:03:20 -07:00 committed by GitHub
parent 0381715fdd
commit ec478d97fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 85 additions and 47 deletions

View File

@ -161,9 +161,10 @@ const MainSection = () => {
header: "Channels", header: "Channels",
key: "channels", key: "channels",
getValue: (connector) => getValue: (connector) =>
connector.connector_specific_config.channels connector.connector_specific_config.channels &&
connector.connector_specific_config.channels.length > 0
? connector.connector_specific_config.channels.join(", ") ? connector.connector_specific_config.channels.join(", ")
: "All channels", : "",
}, },
]} ]}
onUpdate={() => onUpdate={() =>

View File

@ -14,55 +14,100 @@ import { fetcher } from "@/lib/fetcher";
import { getSourceMetadata } from "@/components/source"; import { getSourceMetadata } from "@/components/source";
import { CheckCircle, XCircle } from "@phosphor-icons/react"; import { CheckCircle, XCircle } from "@phosphor-icons/react";
import { HealthCheckBanner } from "@/components/health/healthcheck"; import { HealthCheckBanner } from "@/components/health/healthcheck";
import { ConnectorIndexingStatus } from "@/lib/types"; import {
ConfluenceConfig,
Connector,
ConnectorIndexingStatus,
GithubConfig,
GoogleDriveConfig,
JiraConfig,
SlackConfig,
WebConfig,
} from "@/lib/types";
import { useState } from "react"; import { useState } from "react";
import { getDocsProcessedPerMinute } from "@/lib/indexAttempt"; import { getDocsProcessedPerMinute } from "@/lib/indexAttempt";
const getSourceDisplay = ( interface ConnectorTitleProps {
connectorIndexingStatus: ConnectorIndexingStatus<any, any> connectorIndexingStatus: ConnectorIndexingStatus<any, any>;
) => { }
const ConnectorTitle = ({ connectorIndexingStatus }: ConnectorTitleProps) => {
const connector = connectorIndexingStatus.connector; const connector = connectorIndexingStatus.connector;
const sourceMetadata = getSourceMetadata(connector.source); const sourceMetadata = getSourceMetadata(connector.source);
let additionalMetadata = new Map<string, string>();
if (connector.source === "web") { if (connector.source === "web") {
return ( const typedConnector = connector as Connector<WebConfig>;
sourceMetadata.displayName + additionalMetadata.set(
(connector.connector_specific_config?.base_url && "Base URL",
` [${connector.connector_specific_config?.base_url}]`) typedConnector.connector_specific_config.base_url
); );
} } else if (connector.source === "github") {
const typedConnector = connector as Connector<GithubConfig>;
if (connector.source === "github") { additionalMetadata.set(
return ( "Repo",
sourceMetadata.displayName + `${typedConnector.connector_specific_config.repo_owner}/${typedConnector.connector_specific_config.repo_name}`
` [${connector.connector_specific_config?.repo_owner}/${connector.connector_specific_config?.repo_name}]`
); );
} } else if (connector.source === "confluence") {
const typedConnector = connector as Connector<ConfluenceConfig>;
if (connector.source === "confluence") { additionalMetadata.set(
return ( "Wiki URL",
sourceMetadata.displayName + typedConnector.connector_specific_config.wiki_page_url
` [${connector.connector_specific_config?.wiki_page_url}]`
); );
} } else if (connector.source === "jira") {
const typedConnector = connector as Connector<JiraConfig>;
if (connector.source === "jira") { additionalMetadata.set(
return ( "Jira Project URL",
sourceMetadata.displayName + typedConnector.connector_specific_config.jira_project_url
` [${connector.connector_specific_config?.jira_project_url}]`
); );
} } else if (connector.source === "google_drive") {
const typedConnector = connector as Connector<GoogleDriveConfig>;
if ( if (
connector.source === "google_drive" && typedConnector.connector_specific_config?.folder_paths &&
!connectorIndexingStatus.public_doc typedConnector.connector_specific_config?.folder_paths.length > 0
) { ) {
if (connectorIndexingStatus.owner) { additionalMetadata.set(
return `${sourceMetadata.displayName} [${connectorIndexingStatus.owner}]`; "Folders",
typedConnector.connector_specific_config.folder_paths.join(", ")
);
}
if (!connectorIndexingStatus.public_doc && connectorIndexingStatus.owner) {
additionalMetadata.set("Owner", connectorIndexingStatus.owner);
}
} else if (connector.source === "slack") {
const typedConnector = connector as Connector<SlackConfig>;
if (
typedConnector.connector_specific_config?.channels &&
typedConnector.connector_specific_config?.channels.length > 0
) {
additionalMetadata.set(
"Channels",
typedConnector.connector_specific_config.channels.join(", ")
);
} }
return `${sourceMetadata.displayName} [private]`;
} }
return sourceMetadata.displayName; return (
<>
<a
className="text-blue-500 flex w-fit"
href={sourceMetadata.adminPageLink}
>
{sourceMetadata.icon({ size: 20 })}
<div className="ml-1">{sourceMetadata.displayName}</div>
</a>
<div className="text-xs text-gray-300 mt-1">
{Array.from(additionalMetadata.entries()).map(([key, value]) => {
return (
<div key={key}>
<i>{key}:</i> {value}
</div>
);
})}
</div>
</>
);
}; };
const ErrorDisplay = ({ message }: { message: string }) => { const ErrorDisplay = ({ message }: { message: string }) => {
@ -195,15 +240,7 @@ function Main() {
? `${connectorIndexingStatus?.docs_indexed} documents` ? `${connectorIndexingStatus?.docs_indexed} documents`
: "-", : "-",
connector: ( connector: (
<a <ConnectorTitle connectorIndexingStatus={connectorIndexingStatus} />
className="text-blue-500 flex w-fit"
href={sourceMetadata.adminPageLink}
>
{sourceMetadata.icon({ size: 20 })}
<div className="ml-1">
{getSourceDisplay(connectorIndexingStatus)}
</div>
</a>
), ),
status: statusDisplay, status: statusDisplay,
// TODO: add the below back in after this is supported in the backend // TODO: add the below back in after this is supported in the backend