k4rli/medreport_mrb2b
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MED-197: add tooltip to default package feature

Browse Source
This commit is contained in:
Danel Kungla
2025-10-08 18:02:05 +03:00
parent 8386e541cb
commit db9d94a59d
6 changed files with 41 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/home/(user)/_components/check-with-background.tsx Normal file
View File

@@ -0,0 +1,11 @@
'use client';
import { Check } from 'lucide-react';
export const CheckWithBackground = () => {
return (
<div className="bg-primary w-min rounded-full p-1 text-white">
<Check className="size-3 stroke-2" />
</div>
);
};

25
app/home/(user)/_components/compare-packages-modal.tsx
View File

@@ -3,7 +3,7 @@ import { JSX } from 'react';
import { StoreProduct } from '@medusajs/types';
import { QuestionMarkCircledIcon } from '@radix-ui/react-icons';
import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
import { Check, X } from 'lucide-react';
import { X } from 'lucide-react';
import { PackageHeader } from '@kit/shared/components/package-header';
import { AnalysisPackageWithVariant } from '@kit/shared/components/select-analysis-package';
@@ -26,6 +26,7 @@ import {
import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
import { withI18n } from '~/lib/i18n/with-i18n';
import { CheckWithBackground } from './check-with-background';
import ComparePackagesAddToCartButtons from './compare-packages-add-to-cart-buttons';
import DefaultPackageFeaturesRows from './default-package-features-rows';
@@ -38,14 +39,6 @@ export type AnalysisPackageElement = Pick<
isIncludedInPremium: boolean;
};
export const CheckWithBackground = () => {
return (
<div className="bg-primary w-min rounded-full p-1 text-white">
<Check className="size-3 stroke-2" />
</div>
);
};
const PackageTableHead = async ({
product,
}: {
@@ -97,7 +90,7 @@ const ComparePackagesModal = async ({
<DialogContent
className="min-h-screen max-w-fit min-w-screen"
customClose={
<div className="inline-flex place-items-center-safe gap-1 align-middle">
<div className="absolute top-6 right-0 flex place-items-center-safe sm:top-0">
<p className="text-sm font-medium text-black">
{t('common:close')}
</p>
@@ -111,8 +104,10 @@ const ComparePackagesModal = async ({
</VisuallyHidden>
<div className="m-auto">
<div className="space-y-6 text-center">
<h3>{t('product:healthPackageComparison.label')}</h3>
<p className="text-muted-foreground mx-auto w-3/5 text-sm">
<h3 className="sm:text-xxl text-lg">
{t('product:healthPackageComparison.label')}
</h3>
<p className="text-muted-foreground text-sm sm:mx-auto sm:w-3/5">
{t('product:healthPackageComparison.description')}
</p>
<div className="max-h-[50vh] overflow-y-auto rounded-md border sm:max-h-[70vh]">
@@ -143,12 +138,14 @@ const ComparePackagesModal = async ({
return (
<TableRow key={id}>
<TableCell className="py-6 sm:w-[30vw]">
<TableCell className="relative py-6 sm:w-[30vw]">
{title}{' '}
{description && (
<InfoTooltip
content={description}
icon={<QuestionMarkCircledIcon />}
icon={
<QuestionMarkCircledIcon className="absolute top-2 right-0 size-5 sm:static sm:ml-2 sm:size-4" />
}
/>
)}
</TableCell>

21
app/home/(user)/_components/default-package-features-rows.tsx
View File

@@ -1,18 +1,29 @@
'use client';
import React from 'react';
import { InfoTooltip } from '@/packages/shared/src/components/ui/info-tooltip';
import { QuestionMarkCircledIcon } from '@radix-ui/react-icons';
import { Trans } from '@kit/ui/makerkit/trans';
import { TableCell, TableRow } from '@kit/ui/shadcn/table';
import { withI18n } from '~/lib/i18n/with-i18n';
import { CheckWithBackground } from './compare-packages-modal';
import { CheckWithBackground } from './check-with-background';
const DefaultPackageFeaturesRows = () => {
return (
<>
<TableRow key="digital-doctor-feedback">
<TableCell className="max-w-[30vw] py-6">
<TableCell className="relative max-w-[30vw] py-6">
<Trans i18nKey="order-analysis-package:digitalDoctorFeedback" />
<InfoTooltip
content={
<Trans i18nKey="order-analysis-package:digitalDoctorFeedbackInfo" />
}
icon={
<QuestionMarkCircledIcon className="absolute top-2 right-0 size-5 sm:static sm:ml-2 sm:size-4" />
}
/>
</TableCell>
<TableCell align="center" className="py-6">
<CheckWithBackground />
@@ -43,4 +54,4 @@ const DefaultPackageFeaturesRows = () => {
);
};
export default withI18n(DefaultPackageFeaturesRows);
export default DefaultPackageFeaturesRows;

1
public/locales/en/order-analysis-package.json
View File

@@ -7,5 +7,6 @@
"analysisPackageAddedToCart": "Analysis package added to cart",
"analysisPackageAddToCartError": "Adding analysis package to cart failed",
"digitalDoctorFeedback": "Digital doctor feedback",
"digitalDoctorFeedbackInfo": "Kui oled analüüsid proovivõtupunktis ära andnud ning kõik vastused on tulnud MedReport kontole, vaatab arst tulemused üle. Tulemuste alt näed oma analüüsi tulemusi ja arsti poolset kokkuvõtet.",
"giveAnalyses": "Analyses"
}

1
public/locales/et/order-analysis-package.json
View File

@@ -7,5 +7,6 @@
"analysisPackageAddedToCart": "Analüüsi pakett lisatud ostukorvi",
"analysisPackageAddToCartError": "Analüüsi paketi lisamine ostukorvi ebaõnnestus",
"digitalDoctorFeedback": "Digitaalne arsti kokkuvõte",
"digitalDoctorFeedbackInfo": "Kui oled analüüsid proovivõtupunktis ära andnud ning kõik vastused on tulnud MedReport kontole, vaatab arst tulemused üle. Tulemuste alt näed oma analüüsi tulemusi ja arsti poolset kokkuvõtet.",
"giveAnalyses": "Analüüside võtmine"
}

1
public/locales/ru/order-analysis-package.json
View File

@@ -7,5 +7,6 @@
"analysisPackageAddedToCart": "Пакет анализов добавлен в корзину",
"analysisPackageAddToCartError": "Не удалось добавить пакет анализов в корзину",
"digitalDoctorFeedback": "Digital doctor feedback",
"digitalDoctorFeedbackInfo": "Kui oled analüüsid proovivõtupunktis ära andnud ning kõik vastused on tulnud MedReport kontole, vaatab arst tulemused üle. Tulemuste alt näed oma analüüsi tulemusi ja arsti poolset kokkuvõtet.",
"giveAnalyses": "Analyses"
}