Skip to content

feat(site): add parameters usage to insights #8886

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 10 commits into from
Aug 8, 2023
Prev Previous commit
Next Next commit
Support boolean and array values
  • Loading branch information
BrunoQuaresma committed Aug 4, 2023
commit 352f9dab95e942cdbdb49601c4398d2f37873eff
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@ import { subDays, addHours, startOfHour } from "date-fns"
import { useDashboard } from "components/Dashboard/DashboardProvider"
import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined"
import Link from "@mui/material/Link"
import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"
import CancelOutlined from "@mui/icons-material/CancelOutlined"

export default function TemplateInsightsPage() {
const { template } = useTemplateLayoutContext()
Expand Down Expand Up @@ -327,6 +329,7 @@ const TemplateParametersUsagePanel = ({
alignItems: "baseline",
justifyContent: "space-between",
py: 0.5,
gap: 5,
}}
>
<ValueLabel value={value} parameter={parameter} />
Expand Down Expand Up @@ -412,6 +415,71 @@ const ValueLabel = ({
)
}

if (value.value.startsWith("[")) {
const values = JSON.parse(value.value) as string[]
return (
<Box sx={{ display: "flex", gap: 1, flexWrap: "wrap" }}>
{values.map((v, i) => {
return (
<Box
key={i}
sx={{
p: (theme) => theme.spacing(0.25, 1.5),
borderRadius: 999,
background: (theme) => theme.palette.divider,
whiteSpace: "nowrap",
}}
>
{v}
</Box>
)
})}
</Box>
)
}

if (value.value === "false") {
return (
<Box
sx={{
display: "flex",
alignItems: "center",
gap: 1,
}}
>
<CancelOutlined
sx={{
width: 16,
height: 16,
color: (theme) => theme.palette.error.light,
}}
/>
False
</Box>
)
}

if (value.value === "true") {
return (
<Box
sx={{
display: "flex",
alignItems: "center",
gap: 1,
}}
>
<CheckCircleOutlined
sx={{
width: 16,
height: 16,
color: (theme) => theme.palette.success.light,
}}
/>
True
</Box>
)
}

return <Box>{value.value}</Box>
}

Expand Down