Skip to content

Commit

Permalink
Merge pull request #6 from kookmin-sw/feature/home
Browse files Browse the repository at this point in the history
Feature/home
  • Loading branch information
dongseokSon authored May 8, 2024
2 parents 566d08b + 5263b29 commit c7d15c3
Show file tree
Hide file tree
Showing 19 changed files with 423 additions and 229 deletions.
2 changes: 1 addition & 1 deletion ext-src/extension.ts
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ class ReactPanel {
{
// Enable javascript in the webview
enableScripts: true,

retainContextWhenHidden: true,
// And restric the webview to only loading content from our extension's `media` directory.
localResourceRoots: [
vscode.Uri.file(path.join(this._extensionPath, "build")),
Expand Down
Binary file modified public/favicon.ico
Binary file not shown.
19 changes: 10 additions & 9 deletions public/index.html
Original file line number Diff line number Diff line change
@@ -1,15 +1,18 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<meta name="theme-color" content="#000000" />
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Expand All @@ -19,12 +22,10 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
<title>Codate</title>
</head>
<body>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<noscript> You need to enable JavaScript to run this app. </noscript>
<div id="root"></div>
<!--
This HTML file is a template.
Expand Down
Binary file added public/sample_profile.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
14 changes: 11 additions & 3 deletions src/App.css
Original file line number Diff line number Diff line change
@@ -1,11 +1,19 @@
.App {
position: flex;
.App .App-body {
/* display: flex; */
/* flex-direction: column; */
align-items: center;
justify-content: space-between;
text-align: center;
/* flex-grow: 1 !important; */
}

.App {
/* position: flex; */
height: 160px;
/* background-color: white !important; */
}

.App-body {
margin-top: 100px;
margin-top: 80px;
/* background-color: white !important; */
}
220 changes: 164 additions & 56 deletions src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,43 +1,37 @@
import React, { useState, useEffect } from "react";
import "./App.css";
import { fetchProfile, saveProfile } from "./utils/profileApi";
import {
fetchProfile,
saveProfile,
getProfile,
likeProject,
} from "./utils/api";

import Profile from "./page/Profile";
import Home from "./page/Home";
import Header from "./components/Header";
import Login from "./page/Login2";
import SignUp from "./page/SignUp2";
import { profile } from "console";

const saveProfileData = async (
name: string,
title: string,
description: string,
githubLink: string
githubLink: string,
op: string
) => {
try {
let response;
if (name == "" || title == "" || description == "" || githubLink == "") {
response = await saveProfile(
{
name: name,
title: title,
description: description,
githubLink: githubLink,
},
"post"
);
} else {
response = await saveProfile(
{
name: name,
title: title,
description: description,
githubLink: githubLink,
},
"put"
);
}
// console.log("40: ", response);
response = await saveProfile(
{
name: name,
title: title,
description: description,
githubLink: githubLink,
},
op
);
console.log("Profile saved successfully");
return response;
} catch (error) {
Expand All @@ -57,20 +51,59 @@ const App: React.FC = () => {
// description: "",
// githubLink: "",
// });

const [id, setId] = useState(0);
const [initName, setInitName] = useState("");
const [name, setName] = useState("");
const [title, setTitle] = useState("");
const [description, setDescription] = useState("");
const [githubLink, setGithubLink] = useState("");
const [projectsYouLike, setProjectsYouLike] = useState("");
const [peopleWhoLikeYou, setPeopleWhoLikeYou] = useState("");
const [profileImage, setProfileImage] = useState("");
const [likedProjects, setLikedProjects] = useState([]);
const [likedByUsers, setLikedByUsers] = useState([]);

const [project, setProject] = useState({
name: "",
title: "",
description: "",
githubLink: "",
});

const [index, setIndex] = useState(1);

useEffect(() => {
const accessToken = localStorage.getItem("accessToken");
if (accessToken) {
setIsLoggedin(true);
}
}, []);

useEffect(() => {
// console.log("Profile fetched successfully: ", project);
if (isLoggedin && currentPage === "profile") {
fetchProfileData();
}
}, [currentPage]);

const handleProfileClick = () => {
setCurrentPage("profile");
setIsReadOnly(true);
console.log("profile clicked");
};

const isFieldsEmpty = () => {
if (name == "" || title == "" || description == "" || githubLink == "") {
return true;
}
return false;
};

const isPost = () => {
if (initName == "") {
return true;
}
return false;
};

const handleHomeClick = () => {
setCurrentPage("home");
setIsReadOnly(true);
Expand All @@ -83,33 +116,56 @@ const App: React.FC = () => {
};

const handleSaveClick = async () => {
setIsReadOnly(true);
const response = await saveProfileData(
name,
title,
description,
githubLink
);
if (response) {
setName(response.name);
setTitle(response.title);
setDescription(response.description);
setGithubLink(response.githubLink);
console.log("done__icon clicked");
const op = isPost() ? "post" : "put";
if (isFieldsEmpty()) {
alert("Please fill all the fields");
} else {
setIsReadOnly(true);
const response = await saveProfileData(
name,
title,
description,
githubLink,
op
);
if (response) {
setName(response.name);
setTitle(response.title);
setDescription(response.description);
setGithubLink(response.githubLink);
}
console.log("99 handleSave: ", response);
}
console.log("99: ", response);
// setName(response.name);
console.log("done__icon clicked");
};

const handleLogin = () => {
setIsLoggedin(true);
setCurrentPage("home");
fetchProfileData();
fetchOtherProfile();
console.log("login success");
};

const handleLogout = () => {
setIsLoggedin(false);
setCurrentPage("login");
localStorage.removeItem("accessToken");
setId(0);
setInitName("");
setName("");
setTitle("");
setDescription("");
setGithubLink("");
setLikedProjects([]);
setLikedByUsers([]);
setProject({
name: "",
title: "",
description: "",
githubLink: "",
});
console.log("logout success");
};

Expand All @@ -131,28 +187,75 @@ const App: React.FC = () => {
const fetchProfileData = async () => {
try {
const profileData = await fetchProfile();
setId(profileData.profile.id);
setName(profileData.profile.name);
setInitName(profileData.profile.name);
setTitle(profileData.profile.title);
setDescription(profileData.profile.description);
setGithubLink(profileData.profile.githubLink);

setLikedByUsers(profileData.likedByUsers);
setLikedProjects(profileData.likedProjects);

console.log("138 fetchProfileData: ", profileData);
} catch (error) {
console.error("Error fetching profile:", error);
console.error("202 Error fetching profile:", error);
}
};

useEffect(() => {
const accessToken = localStorage.getItem("accessToken");
if (accessToken) {
setIsLoggedin(true);
const fetchOtherProfile = async () => {
let validProfileFound = false;
let tries = 0; // 무한 루프 방지를 위한 시도 횟수 카운터
let newIndex = index;

while (!validProfileFound && tries < 10) {
console.log("210 Fetching other profile by index:", newIndex);
// 유효한 프로필을 찾거나 시도 횟수가 10회를 넘지 않을 때까지 반복
try {
const profileData = await getProfile(newIndex);
if (profileData && profileData.name) {
setProject({
name: profileData.name,
githubLink: profileData.githubLink,
title: profileData.title,
description: profileData.description,
});
validProfileFound = true;
console.log("223 Valid profile fetched:", profileData);
} else {
newIndex++; // 유효하지 않은 프로필일 경우, 인덱스 증가
console.log("226 Empty profile found, skipping to next...");
}
} catch (error) {
console.error("229 Error fetching profile by index:", error);
newIndex++; // 에러 발생 시 다음 인덱스로 이동
console.log("231 Error on profile fetch, skipping to next index..."); // 네트워크 오류 등 예외 발생 시 반복 중단
}
tries++; // 시도 횟수 증가
}
}, []);

useEffect(() => {
if (isLoggedin && currentPage === "profile") {
fetchProfileData();
if (!validProfileFound) {
setProject({
name: "THERE IS NO MORE PROFILE",
githubLink: "",
title: "",
description: "",
});
}
}, [currentPage]);

setIndex(newIndex + 1); // 마지막으로 확인한 인덱스에서 다음 인덱스로 업데이트
};

const handleLikeButton = async () => {
console.log("handleLikeButton Clicked: ", index);

likeProject(index);
fetchOtherProfile();
};
const handleDislikeButton = async () => {
console.log("handleDislikeButton: ", index);
fetchOtherProfile();
};

return (
<div className="App">
Expand All @@ -165,10 +268,16 @@ const App: React.FC = () => {
isReadOnly={isReadOnly}
isLoggedin={isLoggedin}
onLogout={handleLogout}
// onLikeButton={fetchOtherProfile}
/>
<div className="App-body">
{currentPage === "home" && isLoggedin ? (
<Home />
<Home
project={project}
profineImage={profileImage}
handleLike={handleLikeButton}
handleDislike={handleDislikeButton}
/>
) : currentPage === "profile" && isLoggedin ? (
<Profile
name={name}
Expand All @@ -179,11 +288,10 @@ const App: React.FC = () => {
setDescription={setDescription}
githubLink={githubLink}
setGithubLink={setGithubLink}
projectsYouLike={projectsYouLike}
peopleWhoLikeYou={peopleWhoLikeYou}
profileImage={profileImage}
likedProjects={likedProjects}
likedByUsers={likedByUsers}
isReadOnly={isReadOnly}
// onEditClick={handleEditClick}
// onSaveClick={handleSaveClick}
/>
) : currentPage === "login" ? (
<Login onLoginSuccess={handleLogin} onSignUpClick={handleSignUp} />
Expand Down
Binary file added src/assets/Logo_color.ico
Binary file not shown.
Loading

0 comments on commit c7d15c3

Please sign in to comment.