Profile.tsx 1.63 KB
Newer Older
1
import React, { useEffect, useState } from "react";
2
import { useNavigate } from "react-router-dom";
3
import { baseImageUrl, surveyApi } from "../apis";
Jiwon Yoon's avatar
Jiwon Yoon committed
4
import { SurveyType } from "../types";
5
import { MySurveyCard } from "./MySurveyCard";
Yoon, Daeki's avatar
Yoon, Daeki committed
6
7

export const Profile = () => {
8
  const navigate = useNavigate();
Jiwon Yoon's avatar
Jiwon Yoon committed
9
10
11
12
13
14
  const [survey, setSurvey] = useState<SurveyType>({
    user: {},
    title: "",
    comment: "",
    questions: [],
  });
15
16
17
18
  const [cardDatas, setCardDatas] = useState<SurveyType[]>([]);

  useEffect(() => {
    getSurveys();
19
20
  }, []);

Jiwon Yoon's avatar
Jiwon Yoon committed
21
22
23
24
25
26
  async function createSurvey() {
    const newSurvey: SurveyType = await surveyApi.createSurvey(survey);
    navigate(`/surveys/edit/${newSurvey._id}`, {
      replace: true,
    });
  }
27

28
29
  async function getSurveys() {
    const surveys: SurveyType[] = await surveyApi.getSurveys();
30
    console.log(surveys);
31
32
33
34
    setCardDatas(surveys);
  }
  // let surveys = getSurvey(_id);

Lee SeoYeon's avatar
Lee SeoYeon committed
35
  return (
Lee SeoYeon's avatar
0708    
Lee SeoYeon committed
36
    <div className="flex flex-col items-center">
Jiwon Yoon's avatar
Jiwon Yoon committed
37
      <div className="mt-10 text-xl font-bold">나의 설문조사</div>
38
      <img src={`${baseImageUrl}/9e24ad36a2947b08c89913b01`} />
Jiwon Yoon's avatar
Jiwon Yoon committed
39
      <div className="flex space-x-4 mt-6">
40
41
        <button
          onClick={createSurvey}
42
          className="flex h-60 w-52 items-center border-2 border-themeColor font-bold bg-gray-200 hover:bg-themeColor rounded-lg "
Lee SeoYeon's avatar
Lee SeoYeon committed
43
44
45
46
        >
          <div className="text-center px-6 py-6 font-bold text-gray-500 place-items-center hover:text-white">
            CREATE NEW SURVEY!
          </div>
47
        </button>
48
49
        {cardDatas.map((data, index) => {
          return <MySurveyCard data={data} key={index} />;
50
        })}
Lee SeoYeon's avatar
Lee SeoYeon committed
51
52
53
      </div>
    </div>
  );
Yoon, Daeki's avatar
Yoon, Daeki committed
54
};