llmonitor/benchmarks

1"use client"2 3import { useEffect, useState } from "react"4import { useRouter } from "next/navigation"5 6export default function SelectModels({ models }) {7  const router = useRouter()8  const [model1, setModel1] = useState("")9  const [model2, setModel2] = useState("")10 11  useEffect(() => {12    if (model1 && model2) {13      router.push(`/compare/${model1}-vs-${model2}`)14    }15  }, [model1, model2])16 17  return (18    <div>19      <select onChange={(e) => setModel1(e.target.value)}>20        <option value="">Select model 1</option>21        {models22 23          .sort((a, b) => b.total_score - a.total_score)24          .map((model, i) => (25            <option key={i} value={model.slug}>26              {model.name}27            </option>28          ))}29      </select>30      <select onChange={(e) => setModel2(e.target.value)}>31        <option value="">Select model 2</option>32        {models33 34          .sort((a, b) => b.total_score - a.total_score)35          .map((model, i) => (36            <option key={i} value={model.slug}>37              {model.name}38            </option>39          ))}40      </select>41    </div>42  )43}44