mirror of
https://github.com/formbricks/formbricks.git
synced 2026-04-19 11:11:05 -05:00
fix: Summary view proportions don't add up to 100% (#2314)
This commit is contained in:
Piyush Gupta
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
|
||||
@@ -38,7 +39,7 @@ export default function CTASummary({ questionSummary }: CTASummaryProps) {
|
||||
<p className="font-semibold text-slate-700">Clickthrough Rate (CTR)</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.ctr.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.ctr.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
|
||||
@@ -40,7 +41,7 @@ export default function CalSummary({ questionSummary }: CalSummaryProps) {
|
||||
<p className="font-semibold text-slate-700">Booked</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.booked.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.booked.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -56,7 +57,7 @@ export default function CalSummary({ questionSummary }: CalSummaryProps) {
|
||||
<p className="font-semibold text-slate-700">Dismissed</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.skipped.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.skipped.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
|
||||
@@ -39,7 +40,7 @@ export default function ConsentSummary({ questionSummary }: ConsentSummaryProps)
|
||||
<p className="font-semibold text-slate-700">Accepted</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.accepted.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.accepted.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -56,7 +57,7 @@ export default function ConsentSummary({ questionSummary }: ConsentSummaryProps)
|
||||
<p className="font-semibold text-slate-700">Dismissed</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.dismissed.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.dismissed.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
@@ -64,7 +65,7 @@ export default function MultipleChoiceSummary({
|
||||
</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(result.percentage)}%
|
||||
{convertFloatToNDecimal(result.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
|
||||
@@ -40,7 +41,7 @@ export default function NPSSummary({ questionSummary }: NPSSummaryProps) {
|
||||
<p className="font-semibold capitalize text-slate-700">{group}</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary[group].percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary[group].percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -60,7 +61,7 @@ export default function NPSSummary({ questionSummary }: NPSSummaryProps) {
|
||||
<p className="font-semibold text-slate-700">dismissed</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.dismissed.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.dismissed.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
import Image from "next/image";
|
||||
@@ -55,7 +56,7 @@ export default function PictureChoiceSummary({ questionSummary }: PictureChoiceS
|
||||
</div>
|
||||
<div className="self-end">
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(result.percentage)}%
|
||||
{convertFloatToNDecimal(result.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Headline from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/Headline";
|
||||
import { convertFloatToNDecimal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/util";
|
||||
import { questionTypes } from "@/app/lib/questions";
|
||||
import { CircleSlash2, InboxIcon, SmileIcon, StarIcon } from "lucide-react";
|
||||
import { useMemo } from "react";
|
||||
@@ -59,7 +60,7 @@ export default function RatingSummary({ questionSummary }: RatingSummaryProps) {
|
||||
</div>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(result.percentage)}%
|
||||
{convertFloatToNDecimal(result.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -79,7 +80,7 @@ export default function RatingSummary({ questionSummary }: RatingSummaryProps) {
|
||||
<p className="font-semibold text-slate-700">dismissed</p>
|
||||
<div>
|
||||
<p className="rounded-lg bg-slate-100 px-2 text-slate-700">
|
||||
{Math.round(questionSummary.dismissed.percentage)}%
|
||||
{convertFloatToNDecimal(questionSummary.dismissed.percentage, 1)}%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
export const convertFloatToNDecimal = (num: number, N: number = 2) => {
|
||||
return Math.round(num * Math.pow(10, N)) / Math.pow(10, N);
|
||||
};
|
||||
Reference in New Issue
Block a user