feat(MED-123): update dashboard cards for "order analysis"

app/home/(user)/_components/dashboard-cards.tsx

@@ -0,0 +1,45 @@
+import { Trans } from '@kit/ui/trans';
+import {
+  Card,
+  CardHeader,
+  CardDescription,
+  CardFooter,
+} from '@kit/ui/card';
+
+import Link from 'next/link';
+import { Button } from '@kit/ui/button';
+import { ChevronRight, HeartPulse } from 'lucide-react';
+
+export default function DashboardCards() {
+  return (
+    <div className='flex gap-4 lg:px-4'>
+      <Card
+        variant="gradient-success"
+        className="flex flex-col justify-between"
+      >
+        <CardHeader className="flex-row">
+          <div
+            className={'flex size-8 items-center-safe justify-center-safe rounded-full text-white bg-primary\/10 mb-6'}
+          >
+            <HeartPulse className="size-4 fill-green-500" />
+          </div>
+          <div className='ml-auto flex size-8 items-center-safe justify-center-safe rounded-full text-white bg-warning'>
+            <Link href='/home/order-analysis'>
+              <Button size="icon" variant="outline" className="px-2 text-black">
+                <ChevronRight className="size-4 stroke-2" />
+              </Button>
+            </Link>
+          </div>
+        </CardHeader>
+        <CardFooter className="flex flex-col items-start gap-2">
+          <h5>
+            <Trans i18nKey='dashboard:heroCard.orderAnalysis.title' />
+          </h5>
+          <CardDescription className="text-primary">
+            <Trans i18nKey='dashboard:heroCard.orderAnalysis.description' />
+          </CardDescription>
+        </CardFooter>
+      </Card>
+    </div>
+  );
+}