forked from github/plane
1e152c666c
* chore: moved app & space from apps to root * chore: modified workspace configuration * chore: modified dockerfiles for space and web * chore: modified icons for space * feat: updated files for new svg icons supported by next-images * chore: added /spaces base path for next * chore: added compose config for space * chore: updated husky configuration * chore: updated workflows for new configuration * chore: changed app name to web * fix: resolved build errors with web * chore: reset file tracing root for both projects * chore: added nginx config for deploy * fix: eslint and tsconfig settings for space app * husky setup fixes based on new dir * eslint fixes * prettier formatting --------- Co-authored-by: Henit Chobisa <chobisa.henit@gmail.com>
61 lines
1.8 KiB
TypeScript
61 lines
1.8 KiB
TypeScript
// nivo
|
|
import { BarTooltipProps } from "@nivo/bar";
|
|
import { DATE_KEYS } from "constants/analytics";
|
|
import { renderMonthAndYear } from "helpers/analytics.helper";
|
|
// types
|
|
import { IAnalyticsParams, IAnalyticsResponse } from "types";
|
|
|
|
type Props = {
|
|
datum: BarTooltipProps<any>;
|
|
analytics: IAnalyticsResponse;
|
|
params: IAnalyticsParams;
|
|
};
|
|
|
|
export const CustomTooltip: React.FC<Props> = ({ datum, analytics, params }) => {
|
|
let tooltipValue: string | number = "";
|
|
|
|
const renderAssigneeName = (assigneeId: string): string => {
|
|
const assignee = analytics.extras.assignee_details.find((a) => a.assignees__id === assigneeId);
|
|
|
|
if (!assignee) return "No assignee";
|
|
|
|
return assignee.assignees__display_name || "No assignee";
|
|
};
|
|
|
|
if (params.segment) {
|
|
if (DATE_KEYS.includes(params.segment)) tooltipValue = renderMonthAndYear(datum.id);
|
|
else tooltipValue = datum.id;
|
|
} else {
|
|
if (DATE_KEYS.includes(params.x_axis)) tooltipValue = datum.indexValue;
|
|
else tooltipValue = datum.id === "count" ? "Issue count" : "Estimate";
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center gap-2 rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
|
|
<span
|
|
className="h-3 w-3 rounded"
|
|
style={{
|
|
backgroundColor: datum.color,
|
|
}}
|
|
/>
|
|
<span
|
|
className={`font-medium text-custom-text-200 ${
|
|
params.segment
|
|
? params.segment === "priority" || params.segment === "state__group"
|
|
? "capitalize"
|
|
: ""
|
|
: params.x_axis === "priority" || params.x_axis === "state__group"
|
|
? "capitalize"
|
|
: ""
|
|
}`}
|
|
>
|
|
{params.segment === "assignees__id"
|
|
? renderAssigneeName(tooltipValue.toString())
|
|
: tooltipValue}
|
|
:
|
|
</span>
|
|
<span>{datum.value}</span>
|
|
</div>
|
|
);
|
|
};
|