I want my products to come when I press the category. My categories are kept in the form of CategoryId in the products.

 const handleCategoryClick = (categoryId: string) => {
    router.push(`/products?categoryId=${categoryId}`);
  };   <div className="overflow-y-hidden w-[150px] h-[150px]" onClick={() => handleCategoryClick(category._id)}>

When I press the category as above, the url =http://localhost:3000/products?categoryId=675a32774c40756d8e9d9947 is like this and I get 404 not fount error tihs like product code

const params: any = useSearchParams(); 
    const categoryId = params.get("type")
    const [filteredProducts, setFilteredProducts] = useState<any>([]);
    
    const [products, setProducts] = useState<ProductFormData[]>([]);
    const fetchProducts = async () => {
      try {
       if (categoryId) {
        const response = await axios.get(`/api/get_products?categoryId=${categoryId}`); // API endpoint
        setProducts(response.data);
       }
       else{
        const response = await axios.get("/api/get_products"); // API endpoint
        setProducts(response.data);
       }

When I press the category, how can I bring the products according to that category in next.
For example; when I send any of the categories like categoryId, due date, color, model from the frontend, how can I provide this multiple query in NexRequest with mongoose?
Good evening