I am getting data undefined when I goto to localhost:3000:/someslug/

Is there i am doing something wrong in this ?

`import React from 'react';
import Layout from "@components/layout";
import Loader from "@components/Loader";
import Products from "@components/Products";
import { useQuery } from "@apollo/react-hooks";
import * as Constants from '../config/constants';
import { withApollo } from '../config/withApollo';
import gql from "graphql-tag";
import styles from '../components/Products/products.module.scss';

const CATEGORY_QUERY = gqlquery CategoryQuery($slug: String!) { categoryBySlug(slug: $slug) { url slug productCount } };

const Category = ({ slug }) => {
const { loading, error, data } = useQuery(CATEGORY_QUERY, {
variables: { slug },
});

console.log(data);

if (error) return

Error

;
if (loading) return ;
return (


{/* {data.allProducts.length
? data.allProducts.map(product => )
: ""
} */}


);
}

export default withApollo({ ssr: true })(Category);`