import { GetServerSideProps } from 'next'; import { useQuery } from '@apollo/react-hooks'; import Head from 'next/head'; import { initializeApollo } from '../../../../../lib/apolloClient'; import Nav from '../../../../../components/home/Nav'; import About from '../../../../../components/resource/About'; import DataExplorer from '../../../../../components/resource/DataExplorer'; import { GET_RESOURCES_QUERY } from '../../../../../graphql/queries'; function Resource({ variables }) { const { data, loading } = useQuery(GET_RESOURCES_QUERY, { variables }); if (loading) return

; const result = data.dataset.result; // Find right resource const resource = result.resources.find( (item) => item.name === variables.resource ); return ( <> Portal | {resource.title || resource.name}

{resource.title || resource.name}

); } export const getServerSideProps: GetServerSideProps = async (context) => { const apolloClient = initializeApollo(); const variables = { id: context.query.dataset, resource: context.query.resource, }; await apolloClient.query({ query: GET_RESOURCES_QUERY, variables, }); return { props: { initialApolloState: apolloClient.cache.extract(), variables, }, }; }; export default Resource;