diff --git a/apps/web/core/components/analytics/insight-card.tsx b/apps/web/core/components/analytics/insight-card.tsx index 739de6645c6..abfbdf8b950 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 258ac11e1eb..0ac1f4f8736 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 9881f5e6db4..aa25abc5df1 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 bcce9268f7b..fc404e6369d 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 026fc90c1be..39087d43a0a 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 823d427b473..1621a1c8e99 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 5a24044cbe8..cf6fdd87a37 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 caa973bd08b..9fd407bdeb9 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 11b5f93c936..a29e0295d37 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 b7a43808aab..bff522b3728 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 bc23bc6e104..9a86dab6121 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 56dbf089b23..a9f5190f6f0 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 831b3515e15..f52a220fc4c 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 82cf21bfc6c..46c42f683a8 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 7d11338b726..c6c84ed8ee2 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 f04165391ec..08da7e2dd39 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 8da90adc82f..8088ff21359 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 bd2158d96f4..6f9cccd4e19 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 b8610c2e048..12139dd6c0f 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 55ace9a6662..03b35d9f691 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 6c6a85f2028..0b7273b326a 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 11a1db2efa4..db602fedb12 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 96efff32c78..0d34b27836e 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 28a02fc30ef..e5997869214 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 25d7b84b476..4ed4eecc11c 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 fb49c717291..8ee4739b267 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;