Merge branch 'main' into B2B-30

components/app-logo.tsx

@@ -1,6 +1,6 @@
 import Link from 'next/link';
 
-import { MedReportLogo } from './med-report-title';
+import { MedReportLogo } from './med-report-logo';
 
 function LogoImage({
   className,

components/back-button.tsx

@@ -0,0 +1,31 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+
+import { ArrowLeft } from '@/public/assets/arrow-left';
+
+import { Trans } from '@kit/ui/trans';
+
+export function BackButton({ onBack }: { onBack?: () => void }) {
+  const router = useRouter();
+  return (
+    <form
+      action={() => {
+        if (onBack) {
+          onBack();
+        } else {
+          router.back();
+        }
+      }}
+    >
+      <button className="absolute top-4 left-4 flex cursor-pointer flex-row items-center gap-3">
+        <div className="flex items-center justify-center rounded-sm border p-3">
+          <ArrowLeft />
+        </div>
+        <span className="text-sm">
+          <Trans i18nKey="common:goBack" />
+        </span>
+      </button>
+    </form>
+  );
+}

components/header-auth.tsx

@@ -1,9 +1,11 @@
-import { signOutAction } from "@/lib/actions/sign-out";
-import { hasEnvVars } from "@/utils/supabase/check-env-vars";
-import Link from "next/link";
-import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
-import { createClient } from "@/utils/supabase/server";
+import Link from 'next/link';
+
+import { signOutAction } from '@/lib/actions/sign-out';
+import { hasEnvVars } from '@/utils/supabase/check-env-vars';
+import { createClient } from '@/utils/supabase/server';
+
+import { Badge } from '@kit/ui/badge';
+import { Button } from '@kit/ui/button';
 
 export default async function AuthButton() {
   const supabase = await createClient();
@@ -15,11 +17,11 @@ export default async function AuthButton() {
   if (!hasEnvVars) {
     return (
       <>
-        <div className="flex gap-4 items-center">
+        <div className="flex items-center gap-4">
           <div>
             <Badge
-              variant={"default"}
-              className="font-normal pointer-events-none"
+              variant={'default'}
+              className="pointer-events-none font-normal"
             >
               Please update .env.local file with anon key and url
             </Badge>
@@ -28,18 +30,18 @@ export default async function AuthButton() {
             <Button
               asChild
               size="sm"
-              variant={"outline"}
+              variant={'outline'}
               disabled
-              className="opacity-75 cursor-none pointer-events-none"
+              className="pointer-events-none cursor-none opacity-75"
             >
               <Link href="/sign-in">Sign in</Link>
             </Button>
             <Button
               asChild
               size="sm"
-              variant={"default"}
+              variant={'default'}
               disabled
-              className="opacity-75 cursor-none pointer-events-none"
+              className="pointer-events-none cursor-none opacity-75"
             >
               <Link href="example/sign-up">Sign up</Link>
             </Button>
@@ -52,14 +54,14 @@ export default async function AuthButton() {
     <div className="flex items-center gap-4">
       Hey, {user.email}!
       <form action={signOutAction}>
-        <Button type="submit" variant={"outline"}>
+        <Button type="submit" variant={'outline'}>
           Sign out
         </Button>
       </form>
     </div>
   ) : (
     <div className="flex gap-2">
-      <Button asChild size="sm" variant={"outline"}>
+      <Button asChild size="sm" variant={'outline'}>
         <Link href="/sign-in">Sign in</Link>
       </Button>
     </div>

components/ui/info-tooltip.tsx

@@ -0,0 +1,16 @@
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@kit/ui/tooltip";
+import { Info } from "lucide-react";
+
+export function InfoTooltip({ content }: { content?: string }) {
+  if (!content) return null;
+  return (
+    <TooltipProvider>
+      <Tooltip>
+        <TooltipTrigger>
+          <Info className="size-4 cursor-pointer" />
+        </TooltipTrigger>
+        <TooltipContent>{content}</TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+}

components/ui/search.tsx

@@ -0,0 +1,33 @@
+import React, { JSX, ReactNode } from 'react';
+
+import { cn } from '@kit/ui/utils';
+
+export type SearchProps = React.InputHTMLAttributes<HTMLInputElement> & {
+  startElement?: string | JSX.Element;
+  className?: string;
+};
+
+const Search = React.forwardRef<HTMLInputElement, SearchProps>(
+  ({ className, startElement, ...props }, ref) => {
+    return (
+      <div
+        className={cn(
+          'border-input ring-offset-background focus-within:ring-ring flex h-10 items-center rounded-md border bg-white pl-3 text-sm focus-within:ring-1 focus-within:ring-offset-2',
+          className,
+        )}
+      >
+        {!!startElement && startElement}
+        <input
+          {...props}
+          type="search"
+          ref={ref}
+          className="placeholder:text-muted-foreground w-full p-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
+        />
+      </div>
+    );
+  },
+);
+
+Search.displayName = 'Search';
+
+export { Search };