From ddae2346ec124697b13b97033bb66cfaca0a3126 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 5 Nov 2024 08:32:47 -0800 Subject: [PATCH 1/4] form --- web/src/components/admin/CardSection.tsx | 2 +- web/src/components/credentials/actions/CreateCredential.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/web/src/components/admin/CardSection.tsx b/web/src/components/admin/CardSection.tsx index c44088b3999..fb449e57933 100644 --- a/web/src/components/admin/CardSection.tsx +++ b/web/src/components/admin/CardSection.tsx @@ -11,7 +11,7 @@ export default function CardSection({ return (
diff --git a/web/src/components/credentials/actions/CreateCredential.tsx b/web/src/components/credentials/actions/CreateCredential.tsx index 43d24d3a120..f3f12c73bf8 100644 --- a/web/src/components/credentials/actions/CreateCredential.tsx +++ b/web/src/components/credentials/actions/CreateCredential.tsx @@ -188,7 +188,7 @@ export default function CreateCredential({ onSubmit={() => {}} // This will be overridden by our custom submit handlers > {(formikProps) => ( -
+ {!hideSource && (

Check our From bd6baf39c36b33c8ad4efa8dbcce812288b07cca Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 5 Nov 2024 10:23:52 -0800 Subject: [PATCH 2/4] update --- .../usage/QueryPerformanceChart.tsx | 24 ++++++++++++++++- web/src/components/admin/connectors/Field.tsx | 26 +++++++++---------- web/src/components/ui/areaChart.tsx | 4 ++- 3 files changed, 38 insertions(+), 16 deletions(-) diff --git a/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx b/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx index 4a3aaaf168c..c3d7e5a2238 100644 --- a/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx +++ b/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx @@ -45,6 +45,7 @@ export function QueryPerformanceChart({ } else { const initialDate = timeRange.from || new Date(queryAnalyticsData[0].date); const dateRange = getDatesList(initialDate); + console.log("dateRange", dateRange); const dateToQueryAnalytics = new Map( queryAnalyticsData.map((queryAnalyticsEntry) => [ @@ -58,6 +59,8 @@ export function QueryPerformanceChart({ userAnalyticsEntry, ]) ); + // console.log("dateToQueryAnalytics", dateToQueryAnalytics); + // console.log("dateToUserAnalytics", dateToUserAnalytics); chart = ( - `${Intl.NumberFormat("us").format(number).toString()}` + new Intl.NumberFormat("en-US", { + notation: "standard", + maximumFractionDigits: 0, + }).format(number) } + xAxisFormatter={(dateStr: string) => { + const date = new Date(dateStr); + return date.toLocaleDateString("en-US", { + month: "short", + day: "numeric", + }); + }} + tooltipFormatter={(dateStr: string) => { + const date = new Date(dateStr); + return date.toLocaleDateString("en-US", { + year: "numeric", + month: "short", + day: "numeric", + }); + }} yAxisWidth={60} + allowDecimals={false} /> ); } diff --git a/web/src/components/admin/connectors/Field.tsx b/web/src/components/admin/connectors/Field.tsx index 271a7447f3d..3f62a5953ff 100644 --- a/web/src/components/admin/connectors/Field.tsx +++ b/web/src/components/admin/connectors/Field.tsx @@ -637,22 +637,20 @@ export function SelectorFormField({ className={maxHeight ? `max-h-[${maxHeight}]` : undefined} container={container} > - {options.length == 0 && ( + {options.length === 0 ? ( Select... + ) : ( + options.map((option) => ( + + {option.name} + + )) )} - {defaultValue && ( - {defaultValue} - )} - {options.map((option) => ( - - {option.name} - - ))} )} diff --git a/web/src/components/ui/areaChart.tsx b/web/src/components/ui/areaChart.tsx index a2c2045596a..1762c239c1a 100644 --- a/web/src/components/ui/areaChart.tsx +++ b/web/src/components/ui/areaChart.tsx @@ -42,6 +42,7 @@ interface AreaChartProps { className?: string; title?: string; description?: string; + xAxisFormatter?: (dateStr: string) => string; } export function AreaChartDisplay({ @@ -49,6 +50,7 @@ export function AreaChartDisplay({ categories = [], index, colors = ["indigo", "fuchsia"], + xAxisFormatter, valueFormatter = (number: number) => `${Intl.NumberFormat("us").format(number).toString()}`, startEndOnly = false, @@ -94,7 +96,7 @@ export function AreaChartDisplay({ tickLine={false} axisLine={false} tickMargin={8} - tickFormatter={(value) => value.slice(0, 3)} + tickFormatter={(value) => xAxisFormatter?.(value) || value} /> )} {showYAxis && ( From 257dbecd1d4b4fb40cd926f339dd24f752082a2d Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 5 Nov 2024 10:24:48 -0800 Subject: [PATCH 3/4] k --- .../app/ee/admin/performance/usage/QueryPerformanceChart.tsx | 3 --- web/src/components/ui/areaChart.tsx | 4 ++-- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx b/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx index c3d7e5a2238..7cf9a0c1084 100644 --- a/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx +++ b/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx @@ -45,7 +45,6 @@ export function QueryPerformanceChart({ } else { const initialDate = timeRange.from || new Date(queryAnalyticsData[0].date); const dateRange = getDatesList(initialDate); - console.log("dateRange", dateRange); const dateToQueryAnalytics = new Map( queryAnalyticsData.map((queryAnalyticsEntry) => [ @@ -59,8 +58,6 @@ export function QueryPerformanceChart({ userAnalyticsEntry, ]) ); - // console.log("dateToQueryAnalytics", dateToQueryAnalytics); - // console.log("dateToUserAnalytics", dateToUserAnalytics); chart = ( dateStr, valueFormatter = (number: number) => `${Intl.NumberFormat("us").format(number).toString()}`, startEndOnly = false, @@ -96,7 +96,7 @@ export function AreaChartDisplay({ tickLine={false} axisLine={false} tickMargin={8} - tickFormatter={(value) => xAxisFormatter?.(value) || value} + tickFormatter={(value) => xAxisFormatter(value)} /> )} {showYAxis && ( From afce57b29fb211b25cb4aae83e79d2c697eef52c Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 5 Nov 2024 10:44:12 -0800 Subject: [PATCH 4/4] clarity --- .../ee/admin/performance/usage/DanswerBotChart.tsx | 3 --- .../app/ee/admin/performance/usage/FeedbackChart.tsx | 3 --- .../admin/performance/usage/QueryPerformanceChart.tsx | 10 +--------- web/src/components/ui/areaChart.tsx | 11 +++++------ 4 files changed, 6 insertions(+), 21 deletions(-) diff --git a/web/src/app/ee/admin/performance/usage/DanswerBotChart.tsx b/web/src/app/ee/admin/performance/usage/DanswerBotChart.tsx index 3e4966b5454..efdbe9aee5c 100644 --- a/web/src/app/ee/admin/performance/usage/DanswerBotChart.tsx +++ b/web/src/app/ee/admin/performance/usage/DanswerBotChart.tsx @@ -58,9 +58,6 @@ export function DanswerBotChart({ categories={["Total Queries", "Automatically Resolved"]} index="Day" colors={["indigo", "fuchsia"]} - valueFormatter={(number: number) => - `${Intl.NumberFormat("us").format(number).toString()}` - } yAxisWidth={60} /> ); diff --git a/web/src/app/ee/admin/performance/usage/FeedbackChart.tsx b/web/src/app/ee/admin/performance/usage/FeedbackChart.tsx index c254f1cec5f..da14506fca6 100644 --- a/web/src/app/ee/admin/performance/usage/FeedbackChart.tsx +++ b/web/src/app/ee/admin/performance/usage/FeedbackChart.tsx @@ -56,9 +56,6 @@ export function FeedbackChart({ categories={["Positive Feedback", "Negative Feedback"]} index="Day" colors={["indigo", "fuchsia"]} - valueFormatter={(number: number) => - `${Intl.NumberFormat("us").format(number).toString()}` - } yAxisWidth={60} /> ); diff --git a/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx b/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx index 7cf9a0c1084..ffbf4e8c93e 100644 --- a/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx +++ b/web/src/app/ee/admin/performance/usage/QueryPerformanceChart.tsx @@ -74,7 +74,7 @@ export function QueryPerformanceChart({ categories={["Queries", "Unique Users"]} index="Day" colors={["indigo", "fuchsia"]} - valueFormatter={(number: number) => + yAxisFormatter={(number: number) => new Intl.NumberFormat("en-US", { notation: "standard", maximumFractionDigits: 0, @@ -87,14 +87,6 @@ export function QueryPerformanceChart({ day: "numeric", }); }} - tooltipFormatter={(dateStr: string) => { - const date = new Date(dateStr); - return date.toLocaleDateString("en-US", { - year: "numeric", - month: "short", - day: "numeric", - }); - }} yAxisWidth={60} allowDecimals={false} /> diff --git a/web/src/components/ui/areaChart.tsx b/web/src/components/ui/areaChart.tsx index 0dcf947d005..71f593b4f7b 100644 --- a/web/src/components/ui/areaChart.tsx +++ b/web/src/components/ui/areaChart.tsx @@ -24,7 +24,6 @@ interface AreaChartProps { categories?: string[]; index?: string; colors?: string[]; - valueFormatter?: (value: number) => string; startEndOnly?: boolean; showXAxis?: boolean; showYAxis?: boolean; @@ -42,7 +41,8 @@ interface AreaChartProps { className?: string; title?: string; description?: string; - xAxisFormatter?: (dateStr: string) => string; + xAxisFormatter?: (value: any) => string; + yAxisFormatter?: (value: any) => string; } export function AreaChartDisplay({ @@ -50,9 +50,6 @@ export function AreaChartDisplay({ categories = [], index, colors = ["indigo", "fuchsia"], - xAxisFormatter = (dateStr: string) => dateStr, - valueFormatter = (number: number) => - `${Intl.NumberFormat("us").format(number).toString()}`, startEndOnly = false, showXAxis = true, showYAxis = true, @@ -70,6 +67,8 @@ export function AreaChartDisplay({ className, title, description, + xAxisFormatter = (dateStr: string) => dateStr, + yAxisFormatter = (number: number) => number.toString(), }: AreaChartProps) { return ( @@ -104,7 +103,7 @@ export function AreaChartDisplay({ width={yAxisWidth} tickLine={false} axisLine={false} - tickFormatter={valueFormatter} + tickFormatter={(value) => yAxisFormatter(value)} allowDecimals={allowDecimals} /> )}