binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-4855] refactor: chart tick improvements (#7732)

Browse source 
* 🚧 WIP: Introduced customTicks prop in BarChart for flexible tick rendering.

* ✨ feat: added customTicks to axis charts for flexible tick rendering

* 🔧 fix: update default bar fill color to black and ensure consistent color usage in BarChart

* ✨ feat: add customTooltipContent prop to LineChart for enhanced tooltip flexibility

* 🔧 fix: update bar fill color handling to support dynamic colors based on data and removed DEFAULT_BAR_FILL_COLOR

* 🔧 fix: correct bar fill color handling in BarChart to ensure proper color assignment for tooltips

* 🔧 fix: update customTicks prop types in TAxisChartProps to use unknown type for better type safety

* 📝 chore: updated translations and cleaned up insight card

* 🚨 fix: lint

* 🔧 fix: remove unused translation key "no_of" from Russian translations
This commit is contained in:
Jayash Tripathy 2025-09-09 23:51:13 +05:30 • committed by GitHub
parent 498613284e
commit 43b7a6ad0a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
26 changed files with 115 additions and 93 deletions
Download patch file Download diff file Expand all files Collapse all files

23
apps/web/core/components/analytics/insight-card.tsx
View file

@ -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 (
<div className="flex flex-col gap-3">
@ -30,12 +19,6 @@ const InsightCard = (props: InsightCardProps) => {
{!isLoading ? (
<div className="flex flex-col gap-1">
<div className="text-2xl font-bold text-custom-text-100">{count}</div>
{/* {percentage && (
<div className="flex gap-1 text-xs text-custom-text-300">
<TrendPiece percentage={percentage} size="xs" />
{versus && <div>vs {versus}</div>}
</div>
)} */}
</div>
) : (
<Loader.Item height="50px" width="100%" />

1
apps/web/core/components/analytics/total-insights.tsx
View file

@ -92,7 +92,6 @@ const TotalInsights: React.FC<{
isLoading={isLoading}
data={totalInsightsData?.[item.key]}
label={getInsightLabel(analyticsType, item, isEpic, t)}
versus={selectedDurationLabel}
/>
))}
</div>