diff --git a/packages/frontend/pages/logs/index.tsx b/packages/frontend/pages/logs/index.tsx index 1d9105dd..be6a4d89 100644 --- a/packages/frontend/pages/logs/index.tsx +++ b/packages/frontend/pages/logs/index.tsx @@ -17,6 +17,7 @@ import { import { costColumn, durationColumn, + enrichmentColumn, feedbackColumn, inputColumn, nameColumn, @@ -59,13 +60,13 @@ import { useDebouncedState, useDidUpdate } from "@mantine/hooks" import { ProjectContext } from "@/utils/context" import { CheckLogic, deserializeLogic, serializeLogic } from "shared" import { useRouter } from "next/router" -import useSWR from "swr" const columns = { llm: [ timeColumn("createdAt"), nameColumn("Model"), durationColumn(), + enrichmentColumn(), userColumn(), { header: "Tokens", @@ -103,6 +104,7 @@ const columns = { const CHECKS_BY_TYPE = { llm: [ "models", + // "enrichment", "tags", "users", "status", diff --git a/packages/frontend/utils/datatable.tsx b/packages/frontend/utils/datatable.tsx index 5f653d96..0e1b1ed7 100644 --- a/packages/frontend/utils/datatable.tsx +++ b/packages/frontend/utils/datatable.tsx @@ -2,13 +2,18 @@ import AppUserAvatar from "@/components/blocks/AppUserAvatar" import Feedback from "@/components/blocks/OldFeedback" import ProtectedText from "@/components/blocks/ProtectedText" import SmartViewer from "@/components/SmartViewer" -import { Badge, Group } from "@mantine/core" +import { Badge, Group, Tooltip } from "@mantine/core" import { createColumnHelper } from "@tanstack/react-table" import { useEffect } from "react" import analytics from "./analytics" import { formatCost, formatDateTime, msToTime } from "./format" import { useProjectSWR } from "./dataHooks" +import { + IconMoodNeutral, + IconMoodSad, + IconMoodSmile, +} from "@tabler/icons-react" const columnHelper = createColumnHelper() export function timeColumn(timeColumn, label = "Time") { @@ -214,3 +219,68 @@ export function feedbackColumn(withRelatedRuns = false) { cell, }) } + +const enrichRenderer = (data) => { + switch (data.id) { + case "sentiment": + let emoji + let type + + if (data.value > 0.5) { + emoji = + type = "positive" + } else if (data.value < -0.5) { + emoji = + type = "negative" + } else { + emoji = + type = "neutral" + } + + return { + element: ( + + {emoji} {data.value} + + ), + help: "Sentiment: " + type, + } + case "pii": + return { element: data.value ? "Yes" : "No" } + default: + return { element: data.value, help: data.id } + } +} + +// return a value between 0 and 1, static for a given seed runID +function valueBetween0and1forRunID(runID: string) { + const seed = parseInt(runID, 16) + return (Math.sin(seed) + 1) / 2 +} + +export function enrichmentColumn() { + return columnHelper.accessor("enrichment", { + header: "Enrichment", + size: 100, + cell: (props) => { + // for testing, random value between -1 and 1 + const runID = props.row.original.id + + const enrichedData = [ + { + id: "sentiment", + value: (valueBetween0and1forRunID(runID) * 2 - 1).toFixed(2), + }, + ] + + return enrichedData.map((data) => { + const { element, help } = enrichRenderer(data) + return ( + +
{element}
+
+ ) + }) + }, + }) +}