Add corresponding icons to type indicator #892

This commit is contained in:
Aditya @ArchLinux
2023-10-02 01:10:04 +05:30
parent 70cd70e414
commit 2ab90c14b9
6 changed files with 27 additions and 6 deletions
@@ -3,6 +3,7 @@ import { TSurveyCTAQuestion } from "@formbricks/types/v1/surveys";
import { ProgressBar } from "@formbricks/ui";
import { InboxStackIcon } from "@heroicons/react/24/solid";
import { useMemo } from "react";
import { CursorArrowRippleIcon } from "@heroicons/react/24/solid";
interface CTASummaryProps {
questionSummary: QuestionSummary<TSurveyCTAQuestion>;
@@ -33,7 +34,10 @@ export default function CTASummary({ questionSummary }: CTASummaryProps) {
</h3>
</div>
<div className="flex space-x-2 text-xs font-semibold text-slate-600 md:text-sm">
<div className="rounded-lg bg-slate-100 p-2 ">Call-to-Action</div>
<div className=" flex items-center rounded-lg bg-slate-100 p-2 ">
<CursorArrowRippleIcon className="mr-2 h-4 w-4 " />
Call-to-Action
</div>
<div className=" flex items-center rounded-lg bg-slate-100 p-2">
<InboxStackIcon className="mr-2 h-4 w-4 " />
{ctr.count} responses
@@ -3,6 +3,7 @@ import { ProgressBar } from "@formbricks/ui";
import { InboxStackIcon } from "@heroicons/react/24/solid";
import { useMemo } from "react";
import { TSurveyConsentQuestion } from "@formbricks/types/v1/surveys";
import { CheckIcon } from "@heroicons/react/24/solid";
interface ConsentSummaryProps {
questionSummary: QuestionSummary<TSurveyConsentQuestion>;
@@ -41,7 +42,10 @@ export default function ConsentSummary({ questionSummary }: ConsentSummaryProps)
</h3>
</div>
<div className="flex space-x-2 text-xs font-semibold text-slate-600 md:text-sm">
<div className="rounded-lg bg-slate-100 p-2">Consent</div>
<div className=" flex items-center rounded-lg bg-slate-100 p-2">
<CheckIcon className="mr-2 h-4 w-4 " />
Consent
</div>
<div className=" flex items-center rounded-lg bg-slate-100 p-2">
<InboxStackIcon className="mr-2 h-4 w-4 " />
{ctr.count} responses
@@ -9,6 +9,7 @@ import {
TSurveyMultipleChoiceMultiQuestion,
TSurveyMultipleChoiceSingleQuestion,
} from "@formbricks/types/v1/surveys";
import { ListBulletIcon } from "@heroicons/react/24/solid";
interface MultipleChoiceSummaryProps {
questionSummary: QuestionSummary<TSurveyMultipleChoiceMultiQuestion | TSurveyMultipleChoiceSingleQuestion>;
@@ -131,7 +132,8 @@ export default function MultipleChoiceSummary({
</h3>
</div>
<div className="flex space-x-2 text-xs font-semibold text-slate-600 md:text-sm">
<div className="rounded-lg bg-slate-100 p-2">
<div className="flex items-center rounded-lg bg-slate-100 p-2">
<ListBulletIcon className="mr-2 h-4 w-4 " />
{isSingleChoice
? "Multiple-Choice Single Select Question"
: "Multiple-Choice Multi Select Question"}
@@ -3,6 +3,7 @@ import { TSurveyNPSQuestion } from "@formbricks/types/v1/surveys";
import { HalfCircle, ProgressBar } from "@formbricks/ui";
import { InboxStackIcon } from "@heroicons/react/24/solid";
import { useMemo } from "react";
import { PresentationChartBarIcon } from "@heroicons/react/24/solid";
interface NPSSummaryProps {
questionSummary: QuestionSummary<TSurveyNPSQuestion>;
@@ -81,7 +82,9 @@ export default function NPSSummary({ questionSummary }: NPSSummaryProps) {
</h3>
</div>
<div className="flex space-x-2 text-xs font-semibold text-slate-600 md:text-sm">
<div className="rounded-lg bg-slate-100 p-2">Net Promoter Score (NPS)</div>
<div className="flex items-center rounded-lg bg-slate-100 p-2">
<PresentationChartBarIcon className="mr-2 h-4 w-4 " /> Net Promoter Score (NPS)
</div>
<div className=" flex items-center rounded-lg bg-slate-100 p-2">
<InboxStackIcon className="mr-2 h-4 w-4 " />
{result.total} responses
@@ -5,6 +5,7 @@ import { TSurveyOpenTextQuestion } from "@formbricks/types/v1/surveys";
import { PersonAvatar } from "@formbricks/ui";
import { InboxStackIcon } from "@heroicons/react/24/solid";
import Link from "next/link";
import { ChatBubbleBottomCenterTextIcon } from "@heroicons/react/24/solid";
interface OpenTextSummaryProps {
questionSummary: QuestionSummary<TSurveyOpenTextQuestion>;
@@ -25,7 +26,10 @@ export default function OpenTextSummary({ questionSummary, environmentId }: Open
</h3>
</div>
<div className="flex space-x-2 text-xs font-semibold text-slate-600 md:text-sm">
<div className="rounded-lg bg-slate-100 p-2 ">Open Text Question</div>
<div className="flex items-center rounded-lg bg-slate-100 p-2 ">
<ChatBubbleBottomCenterTextIcon className="mr-2 h-4 w-4" />
Open Text Question
</div>
<div className=" flex items-center rounded-lg bg-slate-100 p-2">
<InboxStackIcon className="mr-2 h-4 w-4" />
{questionSummary.responses.length} Responses
@@ -5,6 +5,7 @@ import { useMemo } from "react";
import { QuestionType } from "@formbricks/types/questions";
import { TSurveyRatingQuestion } from "@formbricks/types/v1/surveys";
import { RatingResponse } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/components/RatingResponse";
import { StarIcon } from "@heroicons/react/24/solid";
interface RatingSummaryProps {
questionSummary: QuestionSummary<TSurveyRatingQuestion>;
@@ -83,7 +84,10 @@ export default function RatingSummary({ questionSummary }: RatingSummaryProps) {
</h3>
</div>
<div className="flex space-x-2 text-xs font-semibold text-slate-600 md:text-sm">
<div className="rounded-lg bg-slate-100 p-2">Rating Question</div>
<div className="flex items-center rounded-lg bg-slate-100 p-2">
<StarIcon className="mr-2 h-4 w-4 " />
Rating Question
</div>
<div className="flex items-center rounded-lg bg-slate-100 p-2">
<InboxStackIcon className="mr-2 h-4 w-4 " />
{totalResponses} responses