safaribook-aspnet-core5-and-react/QandA/frontend/src/QuestionPage.tsx

/** @jsxImportSource @emotion/react */
import { css } from '@emotion/react';
import { gray3, gray6 } from './Styles';

import React from 'react';
import { useParams } from 'react-router-dom';

import { Page } from './Page';
import { QuestionData, getQuestion } from './QuestionsData';

export const QuestionPage = () => {
  const [question, setQuestion] = React.useState<QuestionData | null>(null);
  const { questionId } = useParams();
  React.useEffect(() => {
    const doGetQuestion = async (questionId: number) => {
      const foundQuestion = await getQuestion(questionId);
      setQuestion(foundQuestion);
    };
    if (questionId) {
      doGetQuestion(Number(questionId));
    }
  }, [questionId]);
  return <Page>Question Page {questionId}</Page>;
};