diff --git a/apps/web/core/components/analytics/insight-card.tsx b/apps/web/core/components/analytics/insight-card.tsx index 739de6645..abfbdf8b9 100644 --- a/apps/web/core/components/analytics/insight-card.tsx +++ b/apps/web/core/components/analytics/insight-card.tsx @@ -1,28 +1,17 @@ // plane package imports -import React, { useMemo } from "react"; +import React from "react"; import { IAnalyticsResponseFields } from "@plane/types"; import { Loader } from "@plane/ui"; -// components -import TrendPiece from "./trend-piece"; export type InsightCardProps = { data?: IAnalyticsResponseFields; label: string; isLoading?: boolean; - versus?: string | null; }; const InsightCard = (props: InsightCardProps) => { - const { data, label, isLoading, versus } = props; - const { count, filter_count } = data || {}; - const percentage = useMemo(() => { - if (count != null && filter_count != null) { - const result = ((count - filter_count) / count) * 100; - const isFiniteAndNotNaNOrZero = Number.isFinite(result) && !Number.isNaN(result) && result !== 0; - return isFiniteAndNotNaNOrZero ? result : null; - } - return null; - }, [count, filter_count]); + const { data, label, isLoading = false } = props; + const count = data?.count ?? 0; return (
@@ -30,12 +19,6 @@ const InsightCard = (props: InsightCardProps) => { {!isLoading ? (
{count}
- {/* {percentage && ( -
- - {versus &&
vs {versus}
} -
- )} */}
) : ( diff --git a/apps/web/core/components/analytics/total-insights.tsx b/apps/web/core/components/analytics/total-insights.tsx index 258ac11e1..0ac1f4f87 100644 --- a/apps/web/core/components/analytics/total-insights.tsx +++ b/apps/web/core/components/analytics/total-insights.tsx @@ -92,7 +92,6 @@ const TotalInsights: React.FC<{ isLoading={isLoading} data={totalInsightsData?.[item.key]} label={getInsightLabel(analyticsType, item, isEpic, t)} - versus={selectedDurationLabel} /> ))}
diff --git a/packages/i18n/src/locales/cs/translations.json b/packages/i18n/src/locales/cs/translations.json index 9881f5e6d..aa25abc5d 100644 --- a/packages/i18n/src/locales/cs/translations.json +++ b/packages/i18n/src/locales/cs/translations.json @@ -882,7 +882,8 @@ "in_progress": "Probíhá", "planned": "Plánováno", "paused": "Pozastaveno", - "no_of": "Počet {entity}" + "no_of": "Počet {entity}", + "resolved": "Vyřešeno" }, "chart": { "x_axis": "Osa X", @@ -2490,7 +2491,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane se nespustil. To může být způsobeno tím, že se jeden nebo více služeb Plane nepodařilo spustit.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Vyberte View Logs z setup.sh a Docker logů, abyste si byli jisti." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/de/translations.json b/packages/i18n/src/locales/de/translations.json index bcce9268f..fc404e636 100644 --- a/packages/i18n/src/locales/de/translations.json +++ b/packages/i18n/src/locales/de/translations.json @@ -882,7 +882,8 @@ "in_progress": "In Bearbeitung", "planned": "Geplant", "paused": "Pausiert", - "no_of": "Anzahl {entity}" + "no_of": "Anzahl {entity}", + "resolved": "Gelöst" }, "chart": { "x_axis": "X-Achse", @@ -2489,7 +2490,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane ist nicht gestartet. Dies könnte daran liegen, dass einer oder mehrere Plane-Services nicht starten konnten.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Wählen Sie View Logs aus setup.sh und Docker-Logs, um sicherzugehen." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/en/translations.json b/packages/i18n/src/locales/en/translations.json index 026fc90c1..39087d43a 100644 --- a/packages/i18n/src/locales/en/translations.json +++ b/packages/i18n/src/locales/en/translations.json @@ -725,7 +725,8 @@ "apply": "Apply", "applying": "Applying", "overview": "Overview", - "no_of": "No. of {entity}" + "no_of": "No. of {entity}", + "resolved": "Resolved" }, "chart": { "x_axis": "X-axis", @@ -2366,7 +2367,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane didn't start up. This could be because one or more Plane services failed to start.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Choose View Logs from setup.sh and Docker logs to be sure." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/es/translations.json b/packages/i18n/src/locales/es/translations.json index 823d427b4..1621a1c8e 100644 --- a/packages/i18n/src/locales/es/translations.json +++ b/packages/i18n/src/locales/es/translations.json @@ -885,7 +885,8 @@ "in_progress": "En progreso", "planned": "Planificado", "paused": "Pausado", - "no_of": "N.º de {entity}" + "no_of": "N.º de {entity}", + "resolved": "Resuelto" }, "chart": { "x_axis": "Eje X", @@ -2492,7 +2493,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane no se inició. Esto podría deberse a que uno o más servicios de Plane fallaron al iniciar.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Selecciona View Logs desde setup.sh y los logs de Docker para estar seguro." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/fr/translations.json b/packages/i18n/src/locales/fr/translations.json index 5a24044cb..cf6fdd87a 100644 --- a/packages/i18n/src/locales/fr/translations.json +++ b/packages/i18n/src/locales/fr/translations.json @@ -883,7 +883,8 @@ "in_progress": "En cours", "planned": "Planifié", "paused": "En pause", - "no_of": "Nº de {entity}" + "no_of": "Nº de {entity}", + "resolved": "Résolu" }, "chart": { "x_axis": "Axe X", @@ -2490,7 +2491,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane n'a pas démarré. Cela pourrait être dû au fait qu'un ou plusieurs services Plane ont échoué à démarrer.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Choisissez View Logs depuis setup.sh et les logs Docker pour en être sûr." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/id/translations.json b/packages/i18n/src/locales/id/translations.json index caa973bd0..9fd407bde 100644 --- a/packages/i18n/src/locales/id/translations.json +++ b/packages/i18n/src/locales/id/translations.json @@ -882,7 +882,8 @@ "in_progress": "Sedang berlangsung", "planned": "Direncanakan", "paused": "Dijedaikan", - "no_of": "Jumlah {entity}" + "no_of": "Jumlah {entity}", + "resolved": "Terselesaikan" }, "chart": { "x_axis": "Sumbu-X", @@ -2485,7 +2486,6 @@ "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Pilih View Logs dari setup.sh dan log Docker untuk memastikan." }, "no_of": "Jumlah {entity}", - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/it/translations.json b/packages/i18n/src/locales/it/translations.json index 11b5f93c9..a29e0295d 100644 --- a/packages/i18n/src/locales/it/translations.json +++ b/packages/i18n/src/locales/it/translations.json @@ -881,7 +881,8 @@ "in_progress": "In corso", "planned": "Pianificato", "paused": "In pausa", - "no_of": "N. di {entity}" + "no_of": "N. di {entity}", + "resolved": "Risolto" }, "chart": { "x_axis": "Asse X", @@ -2489,7 +2490,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane non si è avviato. Questo potrebbe essere dovuto al fatto che uno o più servizi Plane non sono riusciti ad avviarsi.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Scegli View Logs da setup.sh e dai log Docker per essere sicuro." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/ja/translations.json b/packages/i18n/src/locales/ja/translations.json index b7a43808a..bff522b37 100644 --- a/packages/i18n/src/locales/ja/translations.json +++ b/packages/i18n/src/locales/ja/translations.json @@ -883,7 +883,8 @@ "in_progress": "進行中", "planned": "計画済み", "paused": "一時停止", - "no_of": "{entity} の数" + "no_of": "{entity} の数", + "resolved": "解決済み" }, "chart": { "x_axis": "エックス アクシス", @@ -2490,7 +2491,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Planeが起動しませんでした。これは1つまたは複数のPlaneサービスの起動に失敗したことが原因である可能性があります。", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "setup.shとDockerログからView Logsを選択して確認してください。" }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/ko/translations.json b/packages/i18n/src/locales/ko/translations.json index bc23bc6e1..9a86dab61 100644 --- a/packages/i18n/src/locales/ko/translations.json +++ b/packages/i18n/src/locales/ko/translations.json @@ -884,7 +884,8 @@ "in_progress": "진행 중", "planned": "계획된", "paused": "일시 중지됨", - "no_of": "{entity} 수" + "no_of": "{entity} 수", + "resolved": "해결됨" }, "chart": { "x_axis": "X축", @@ -2492,7 +2493,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane이 시작되지 않았습니다. 이는 하나 이상의 Plane 서비스가 시작에 실패했기 때문일 수 있습니다.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "확실히 하려면 setup.sh와 Docker 로그에서 View Logs를 선택하세요." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/pl/translations.json b/packages/i18n/src/locales/pl/translations.json index 56dbf089b..a9f5190f6 100644 --- a/packages/i18n/src/locales/pl/translations.json +++ b/packages/i18n/src/locales/pl/translations.json @@ -884,7 +884,8 @@ "in_progress": "W trakcie", "planned": "Zaplanowane", "paused": "Wstrzymane", - "no_of": "Liczba {entity}" + "no_of": "Liczba {entity}", + "resolved": "Rozwiązane" }, "chart": { "x_axis": "Oś X", @@ -2491,7 +2492,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane nie uruchomił się. Może to być spowodowane tym, że jedna lub więcej usług Plane nie mogła się uruchomić.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Wybierz View Logs z setup.sh i logów Docker, aby mieć pewność." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/pt-BR/translations.json b/packages/i18n/src/locales/pt-BR/translations.json index 831b3515e..f52a220fc 100644 --- a/packages/i18n/src/locales/pt-BR/translations.json +++ b/packages/i18n/src/locales/pt-BR/translations.json @@ -884,7 +884,8 @@ "in_progress": "Em andamento", "planned": "Planejado", "paused": "Pausado", - "no_of": "Nº de {entity}" + "no_of": "Nº de {entity}", + "resolved": "Resolvido" }, "chart": { "x_axis": "Eixo X", @@ -2486,7 +2487,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "O Plane não inicializou. Isso pode ser porque um ou mais serviços do Plane falharam ao iniciar.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Escolha View Logs do setup.sh e logs do Docker para ter certeza." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/ro/translations.json b/packages/i18n/src/locales/ro/translations.json index 82cf21bfc..46c42f683 100644 --- a/packages/i18n/src/locales/ro/translations.json +++ b/packages/i18n/src/locales/ro/translations.json @@ -882,7 +882,8 @@ "in_progress": "În desfășurare", "planned": "Planificat", "paused": "Pauzat", - "no_of": "Nr. de {entity}" + "no_of": "Nr. de {entity}", + "resolved": "Rezolvat" }, "chart": { "x_axis": "axa-X", @@ -2484,7 +2485,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane nu a pornit. Aceasta ar putea fi din cauza că unul sau mai multe servicii Plane au eșuat să pornească.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Alegeți View Logs din setup.sh și logurile Docker pentru a fi siguri." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/ru/translations.json b/packages/i18n/src/locales/ru/translations.json index 7d11338b7..c6c84ed8e 100644 --- a/packages/i18n/src/locales/ru/translations.json +++ b/packages/i18n/src/locales/ru/translations.json @@ -884,7 +884,8 @@ "in_progress": "В процессе", "planned": "Запланировано", "paused": "На паузе", - "no_of": "Количество {entity}" + "no_of": "Количество {entity}", + "resolved": "Решено" }, "chart": { "x_axis": "Ось X", @@ -2492,8 +2493,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane не запустился. Это может быть из-за того, что один или несколько сервисов Plane не смогли запуститься.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Выберите View Logs из setup.sh и логов Docker, чтобы убедиться." }, - "no_of": "Количество {entity}", - "page_navigation_pane": { "tabs": { "outline": { @@ -2533,4 +2532,4 @@ "close_button": "Закрыть панель навигации", "outline_floating_button": "Открыть структуру" } -} +} \ No newline at end of file diff --git a/packages/i18n/src/locales/sk/translations.json b/packages/i18n/src/locales/sk/translations.json index f04165391..08da7e2dd 100644 --- a/packages/i18n/src/locales/sk/translations.json +++ b/packages/i18n/src/locales/sk/translations.json @@ -884,7 +884,8 @@ "in_progress": "Prebieha", "planned": "Plánované", "paused": "Pozastavené", - "no_of": "Počet {entity}" + "no_of": "Počet {entity}", + "resolved": "Vyriešené" }, "chart": { "x_axis": "Os X", @@ -2491,7 +2492,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane sa nespustil. Toto môže byť spôsobené tým, že sa jedna alebo viac služieb Plane nepodarilo spustiť.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Vyberte View Logs z setup.sh a Docker logov, aby ste si boli istí." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/tr-TR/translations.json b/packages/i18n/src/locales/tr-TR/translations.json index 8da90adc8..8088ff213 100644 --- a/packages/i18n/src/locales/tr-TR/translations.json +++ b/packages/i18n/src/locales/tr-TR/translations.json @@ -886,7 +886,8 @@ "in_progress": "Devam ediyor", "planned": "Planlandı", "paused": "Durduruldu", - "no_of": "{entity} sayısı" + "no_of": "{entity} sayısı", + "resolved": "Çözüldü" }, "chart": { "x_axis": "X ekseni", @@ -2471,7 +2472,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane başlatılamadı. Bu, bir veya daha fazla Plane servisinin başlatılamaması nedeniyle olabilir.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Emin olmak için setup.sh ve Docker loglarından View Logs'u seçin." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/ua/translations.json b/packages/i18n/src/locales/ua/translations.json index bd2158d96..6f9cccd4e 100644 --- a/packages/i18n/src/locales/ua/translations.json +++ b/packages/i18n/src/locales/ua/translations.json @@ -884,7 +884,8 @@ "in_progress": "В процесі", "planned": "Заплановано", "paused": "Призупинено", - "no_of": "Кількість {entity}" + "no_of": "Кількість {entity}", + "resolved": "Вирішено" }, "chart": { "x_axis": "Вісь X", @@ -2491,7 +2492,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane не запустився. Це може бути через те, що один або декілька сервісів Plane не змогли запуститися.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Виберіть View Logs з setup.sh та логів Docker, щоб переконатися." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/vi-VN/translations.json b/packages/i18n/src/locales/vi-VN/translations.json index b8610c2e0..12139dd6c 100644 --- a/packages/i18n/src/locales/vi-VN/translations.json +++ b/packages/i18n/src/locales/vi-VN/translations.json @@ -883,7 +883,8 @@ "in_progress": "Đang tiến hành", "planned": "Đã lên kế hoạch", "paused": "Tạm dừng", - "no_of": "Số lượng {entity}" + "no_of": "Số lượng {entity}", + "resolved": "Đã giải quyết" }, "chart": { "x_axis": "Trục X", @@ -2489,7 +2490,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane không khởi động được. Điều này có thể do một hoặc nhiều dịch vụ Plane không khởi động được.", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "Chọn View Logs từ setup.sh và log Docker để chắc chắn." }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/zh-CN/translations.json b/packages/i18n/src/locales/zh-CN/translations.json index 55ace9a66..03b35d9f6 100644 --- a/packages/i18n/src/locales/zh-CN/translations.json +++ b/packages/i18n/src/locales/zh-CN/translations.json @@ -883,7 +883,8 @@ "in_progress": "进行中", "planned": "已计划", "paused": "暂停", - "no_of": "{entity} 的数量" + "no_of": "{entity} 的数量", + "resolved": "已解决" }, "chart": { "x_axis": "X轴", @@ -2471,7 +2472,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane 未能启动。这可能是因为一个或多个 Plane 服务启动失败。", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "请选择“查看日志”来查看 setup.sh 和 Docker 日志，以确认问题。" }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/i18n/src/locales/zh-TW/translations.json b/packages/i18n/src/locales/zh-TW/translations.json index 6c6a85f20..0b7273b32 100644 --- a/packages/i18n/src/locales/zh-TW/translations.json +++ b/packages/i18n/src/locales/zh-TW/translations.json @@ -884,7 +884,8 @@ "planned": "已計劃", "paused": "暫停", "at_risk": "有風險", - "no_of": "{entity} 的數量" + "no_of": "{entity} 的數量", + "resolved": "已解決" }, "chart": { "x_axis": "X 軸", @@ -2492,7 +2493,6 @@ "plane_didnt_start_up_this_could_be_because_one_or_more_plane_services_failed_to_start": "Plane 未能啟動。這可能是因為一個或多個 Plane 服務啟動失敗。", "choose_view_logs_from_setup_sh_and_docker_logs_to_be_sure": "從 setup.sh 和 Docker 日誌中選擇 View Logs 來確認。" }, - "page_navigation_pane": { "tabs": { "outline": { diff --git a/packages/propel/src/charts/area-chart/root.tsx b/packages/propel/src/charts/area-chart/root.tsx index 11a1db2ef..db602fedb 100644 --- a/packages/propel/src/charts/area-chart/root.tsx +++ b/packages/propel/src/charts/area-chart/root.tsx @@ -23,6 +23,7 @@ export const AreaChart = React.memo((props: x: undefined, y: 10, }, + customTicks, showTooltip = true, comparisonLine, } = props; @@ -114,7 +115,10 @@ export const AreaChart = React.memo((props: } + tick={(props) => { + const TickComponent = customTicks?.x || CustomXAxisTick; + return ; + }} tickLine={false} axisLine={false} label={ @@ -140,7 +144,10 @@ export const AreaChart = React.memo((props: className: AXIS_LABEL_CLASSNAME, } } - tick={(props) => } + tick={(props) => { + const TickComponent = customTicks?.y || CustomYAxisTick; + return ; + }} tickCount={tickCount.y} allowDecimals={!!yAxis.allowDecimals} /> diff --git a/packages/propel/src/charts/bar-chart/root.tsx b/packages/propel/src/charts/bar-chart/root.tsx index 96efff32c..0d34b2783 100644 --- a/packages/propel/src/charts/bar-chart/root.tsx +++ b/packages/propel/src/charts/bar-chart/root.tsx @@ -35,6 +35,7 @@ export const BarChart = React.memo((props: T x: undefined, y: 10, }, + customTicks, showTooltip = true, customTooltipContent, } = props; @@ -52,7 +53,7 @@ export const BarChart = React.memo((props: T keys.push(bar.key); labels[bar.key] = bar.label; // For tooltip, we need a string color. If fill is a function, use a default color - colors[bar.key] = typeof bar.fill === "function" ? "#000000" : bar.fill; + colors[bar.key] = typeof bar.fill === "function" ? bar.fill({}) : bar.fill; } return { stackKeys: keys, stackLabels: labels, stackDotColors: colors }; @@ -65,6 +66,7 @@ export const BarChart = React.memo((props: T key={bar.key} dataKey={bar.key} stackId={bar.stackId} + fill={typeof bar.fill === "function" ? bar.fill({}) : bar.fill} opacity={!!activeLegend && activeLegend !== bar.key ? 0.1 : 1} shape={(shapeProps: any) => { const shapeVariant = barShapeVariants[bar.shapeVariant ?? "bar"]; @@ -96,7 +98,10 @@ export const BarChart = React.memo((props: T } + tick={(props) => { + const TickComponent = customTicks?.x || CustomXAxisTick; + return ; + }} tickLine={false} axisLine={false} label={{ @@ -118,7 +123,10 @@ export const BarChart = React.memo((props: T dx: yAxis.dx ?? -16, className: AXIS_LABEL_CLASSNAME, }} - tick={(props) => } + tick={(props) => { + const TickComponent = customTicks?.y || CustomYAxisTick; + return ; + }} tickCount={tickCount.y} allowDecimals={!!yAxis.allowDecimals} /> diff --git a/packages/propel/src/charts/line-chart/root.tsx b/packages/propel/src/charts/line-chart/root.tsx index 28a02fc30..e59978692 100644 --- a/packages/propel/src/charts/line-chart/root.tsx +++ b/packages/propel/src/charts/line-chart/root.tsx @@ -32,8 +32,10 @@ export const LineChart = React.memo((props: x: undefined, y: 10, }, + customTicks, legend, showTooltip = true, + customTooltipContent, } = props; // states const [activeLine, setActiveLine] = useState(null); @@ -100,7 +102,10 @@ export const LineChart = React.memo((props: } + tick={(props) => { + const TickComponent = customTicks?.x || CustomXAxisTick; + return ; + }} tickLine={false} axisLine={false} label={ @@ -126,7 +131,10 @@ export const LineChart = React.memo((props: className: AXIS_LABEL_CLASSNAME, } } - tick={(props) => } + tick={(props) => { + const TickComponent = customTicks?.y || CustomYAxisTick; + return ; + }} tickCount={tickCount.y} allowDecimals={!!yAxis.allowDecimals} /> @@ -148,17 +156,20 @@ export const LineChart = React.memo((props: wrapperStyle={{ pointerEvents: "auto", }} - content={({ active, label, payload }) => ( - - )} + content={({ active, label, payload }) => { + if (customTooltipContent) return customTooltipContent({ active, label, payload }); + return ( + + ); + }} /> )} {renderLines} diff --git a/packages/propel/src/charts/scatter-chart/root.tsx b/packages/propel/src/charts/scatter-chart/root.tsx index 25d7b84b4..4ed4eecc1 100644 --- a/packages/propel/src/charts/scatter-chart/root.tsx +++ b/packages/propel/src/charts/scatter-chart/root.tsx @@ -28,6 +28,7 @@ export const ScatterChart = React.memo((prop xAxis, yAxis, className, + customTicks, tickCount = { x: undefined, y: 10, @@ -85,7 +86,10 @@ export const ScatterChart = React.memo((prop } + tick={(props) => { + const TickComponent = customTicks?.x || CustomXAxisTick; + return ; + }} tickLine={false} axisLine={false} label={ @@ -111,7 +115,10 @@ export const ScatterChart = React.memo((prop className: AXIS_LABEL_CLASSNAME, } } - tick={(props) => } + tick={(props) => { + const TickComponent = customTicks?.y || CustomYAxisTick; + return ; + }} tickCount={tickCount.y} allowDecimals={!!yAxis.allowDecimals} /> diff --git a/packages/types/src/charts/index.ts b/packages/types/src/charts/index.ts index fb49c7172..8ee4739b2 100644 --- a/packages/types/src/charts/index.ts +++ b/packages/types/src/charts/index.ts @@ -21,8 +21,17 @@ export type TChartData = { [key in K]: string | number; } & Record; -export type TChartProps = { +export type TBaseChartProps = { data: TChartData[]; + className?: string; + legend?: TChartLegend; + margin?: TChartMargin; + showTooltip?: boolean; + customTooltipContent?: (props: { active?: boolean; label: string; payload: any }) => React.ReactNode; +}; + +// Props specific to charts with X and Y axes +export type TAxisChartProps = TBaseChartProps & { xAxis: { key: keyof TChartData; label?: string; @@ -38,15 +47,14 @@ export type TChartProps = { offset?: number; dx?: number; }; - className?: string; - legend?: TChartLegend; - margin?: TChartMargin; tickCount?: { x?: number; y?: number; }; - showTooltip?: boolean; - customTooltipContent?: (props: { active?: boolean; label: string; payload: any }) => React.ReactNode; + customTicks?: { + x?: React.ComponentType; + y?: React.ComponentType; + }; }; // ============================================================ @@ -67,7 +75,7 @@ export type TBarItem = { shapeVariant?: TBarChartShapeVariant; }; -export type TBarChartProps = TChartProps & { +export type TBarChartProps = TAxisChartProps & { bars: TBarItem[]; barSize?: number; }; @@ -87,7 +95,7 @@ export type TLineItem = { style?: Record; }; -export type TLineChartProps = TChartProps & { +export type TLineChartProps = TAxisChartProps & { lines: TLineItem[]; }; @@ -102,7 +110,7 @@ export type TScatterPointItem = { stroke: string; }; -export type TScatterChartProps = TChartProps & { +export type TScatterChartProps = TAxisChartProps & { scatterPoints: TScatterPointItem[]; }; @@ -123,7 +131,7 @@ export type TAreaItem = { style?: Record; }; -export type TAreaChartProps = TChartProps & { +export type TAreaChartProps = TAxisChartProps & { areas: TAreaItem[]; comparisonLine?: { dashedLine: boolean; @@ -141,7 +149,7 @@ export type TCellItem = { }; export type TPieChartProps = Pick< - TChartProps, + TBaseChartProps, "className" | "data" | "showTooltip" | "legend" | "margin" > & { dataKey: T; @@ -223,7 +231,7 @@ export type TRadarItem = { }; export type TRadarChartProps = Pick< - TChartProps, + TBaseChartProps, "className" | "showTooltip" | "margin" | "data" | "legend" > & { dataKey: T;