feat : update

components/public/team-search.tsx

@@ -3,10 +3,11 @@
 
 import Image from "next/image";
 import Link from "next/link";
-import { ArrowUpRightIcon, MousePointerClickIcon, SearchIcon, XIcon } from "lucide-react";
-import { useMemo, useState, type ReactNode } from "react";
+import { ArrowUpRightIcon, SearchIcon, XIcon } from "lucide-react";
+import { Fragment, useMemo, useState, type ReactNode } from "react";
 
 import { GuideImageExport } from "@/components/public/guide-image-export";
+import { ConditionTabIcon } from "@/components/public/condition-switcher";
 import { ExportText } from "@/components/public/export-language";
 import { ScrollableNav } from "@/components/public/scrollable-nav";
 import { Button } from "@/components/ui/button";
@@ -451,7 +452,10 @@ export function TeamSearch({ groups }: { groups: PublicGuide["teamGroups"] }) {
         <ScrollableNav ariaLabel="เลือกเงื่อนไขทีม" className="w-full min-w-0">
           <Tabs className="mx-auto" value={activeCondition} onValueChange={setActiveCondition}>
             <TabsList aria-label="เลือกเงื่อนไขทีม">
-              {groups.map((group, index) => <TabsTrigger key={group.id} value={String(index)}><MousePointerClickIcon aria-hidden="true" data-icon="inline-start" />{group.name || `เงื่อนไข ${index + 1}`}</TabsTrigger>)}
+              {groups.map((group, index) => <Fragment key={group.id}>
+                {index > 0 ? <Separator orientation="vertical" aria-hidden="true" className="mx-1 h-6" /> : null}
+                <TabsTrigger value={String(index)}><ConditionTabIcon iconUrl={group.iconUrl} /><span className="text-base">{group.name || `เงื่อนไข ${index + 1}`}</span></TabsTrigger>
+              </Fragment>)}
             </TabsList>
           </Tabs>
         </ScrollableNav>