39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
|
import { FC } from "react";
|
||
|
|
import styles from "./article.module.css";
|
||
|
|
import { GetServerSideProps, GetStaticProps } from "next";
|
||
|
|
import { addApolloState, initializeApollo } from "../../commons/graphql/client";
|
||
|
|
import { ARTICLE } from "../../commons/graphql/queries";
|
||
|
|
import { Article } from "../../commons/graphql/generated";
|
||
|
|
import { useQuery } from '@apollo/client';
|
||
|
|
import { useRouter } from 'next/router';
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
article: Article;
|
||
|
|
}
|
||
|
|
const ArticleDetails: FC<Props> = ({ article }) => {
|
||
|
|
// const router = useRouter()
|
||
|
|
// const { data } = useQuery<{ article: Article }>(ARTICLE, {
|
||
|
|
// variables: router.query,
|
||
|
|
// });
|
||
|
|
return (
|
||
|
|
<main className={styles.articleDetails}>
|
||
|
|
<h1>{article.title}</h1>
|
||
|
|
</main>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export const getServerSideProps: GetServerSideProps = async ({ params }) => {
|
||
|
|
const apolloClient = initializeApollo();
|
||
|
|
|
||
|
|
const { data } = await apolloClient.query<{ article: Article }>({
|
||
|
|
query: ARTICLE,
|
||
|
|
variables: params,
|
||
|
|
});
|
||
|
|
|
||
|
|
return addApolloState(apolloClient, {
|
||
|
|
props: { article: data.article },
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
export default ArticleDetails;
|