From 3c02230c8d86808e514f3bb36c343f18abb3e5d1 Mon Sep 17 00:00:00 2001
From: SeieunYoo <isho48239@gmail.com>
Date: Tue, 20 Aug 2024 12:37:26 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20LInk=20=EB=A1=9C=20=EA=B5=90=EC=B2=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../_components/HomeworkBoxWithLinkEdit.tsx   | 48 +++++++++++--------
 .../HomeworkHistory/HomeworkHistoryItem.tsx   | 17 ++++---
 .../_components/HomeworkOverviewBox.tsx       | 35 +++++++-------
 .../study-apply/_components/StudyItem.tsx     |  5 +-
 .../types/dtos/study-detail-dashboard.ts      |  4 +-
 apps/client/types/dtos/study-history.ts       |  4 +-
 apps/client/types/entities/assignment.ts      |  1 -
 apps/client/types/entities/homework.ts        |  1 +
 8 files changed, 65 insertions(+), 50 deletions(-)
 delete mode 100644 apps/client/types/entities/assignment.ts
 create mode 100644 apps/client/types/entities/homework.ts

diff --git a/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkBoxWithLinkEdit.tsx b/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkBoxWithLinkEdit.tsx
index e953c0d0..81ea73f6 100644
--- a/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkBoxWithLinkEdit.tsx
+++ b/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkBoxWithLinkEdit.tsx
@@ -4,8 +4,9 @@ import { Space, Text } from "@wow-class/ui";
 import { padWithZero, parseISODate } from "@wow-class/utils";
 import { tags } from "constants/tags";
 import { revalidateTag } from "next/cache";
+import Link from "next/link";
 import type { SubmittableAssignment } from "types/dtos/study-detail-dashboard";
-import { Link, Reload } from "wowds-icons";
+import { Link as LinkIcon, Reload as ReloadIcon } from "wowds-icons";
 import Box from "wowds-ui/Box";
 import Button from "wowds-ui/Button";
 import TextButton from "wowds-ui/TextButton";
@@ -50,33 +51,40 @@ export const HomeworkBoxWithLinkEdit = ({
                   <Text as="h2" typo="h2">
                     {title}
                   </Text>
-                  <TextButton
-                    as="a"
-                    href={descriptionLink}
-                    style={{ paddingLeft: "0px", width: "fit-content" }}
-                    text="과제 명세 확인"
-                  />
+                  <Link href={descriptionLink} target="_blank">
+                    <TextButton
+                      style={{ paddingLeft: "0px" }}
+                      text="과제 명세 확인"
+                    />
+                  </Link>
                   <Space height="xs" />
                   <Text color="sub">{deadlineText}</Text>
-
                   <Space height={26} />
+                  <Link href={submissionLink} target="_blank">
+                    <Button
+                      disabled={isButtonDisabled}
+                      style={{ maxWidth: "100%" }}
+                      variant="outline"
+                      icon={
+                        <LinkIcon
+                          stroke={isButtonDisabled ? "mono100" : "primary"}
+                        />
+                      }
+                    >
+                      제출하러 가기
+                    </Button>
+                  </Link>
+                  <Space height={8} />
                   <Button
-                    as="a"
                     disabled={isButtonDisabled}
-                    href={submissionLink}
                     style={{ maxWidth: "100%" }}
-                    variant="outline"
                     icon={
-                      <Link stroke={isButtonDisabled ? "mono100" : "primary"} />
+                      <ReloadIcon
+                        stroke={
+                          isButtonDisabled ? "mono100" : "backgroundNormal"
+                        }
+                      />
                     }
-                  >
-                    제출하러 가기
-                  </Button>
-                  <Space height={8} />
-                  <Button
-                    disabled={isButtonDisabled}
-                    icon={<Reload />}
-                    style={{ maxWidth: "100%" }}
                     onClick={handleClickSubmissionComplete}
                   >
                     제출 완료
diff --git a/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkHistory/HomeworkHistoryItem.tsx b/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkHistory/HomeworkHistoryItem.tsx
index 59bd220d..430ab556 100644
--- a/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkHistory/HomeworkHistoryItem.tsx
+++ b/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkHistory/HomeworkHistoryItem.tsx
@@ -1,9 +1,10 @@
 import { Flex, styled } from "@styled-system/jsx";
 import { Space, Table, Text } from "@wow-class/ui";
 import { padWithZero, parseISODate } from "@wow-class/utils";
+import Link from "next/link";
 import type { ComponentProps } from "react";
 import type { AssignmentHistoryDto } from "types/dtos/study-history";
-import type { AssignmentSubmissionStatusType } from "types/entities/assignment";
+import type { HomeworkSubmissionStatusType } from "types/entities/homework";
 import Button from "wowds-ui/Button";
 import Tag from "wowds-ui/Tag";
 import TextButton from "wowds-ui/TextButton";
@@ -48,7 +49,9 @@ export const HomeworkHistoryItem = ({ history }: HomeworkHistoryItemProps) => {
           textStyle="body1"
         >
           {descriptionLink ? (
-            <TextButton as="a" href={descriptionLink} text="과제 명세 확인" />
+            <Link href={descriptionLink} target="_blank">
+              <TextButton text="과제 명세 확인" />
+            </Link>
           ) : (
             "-"
           )}
@@ -68,9 +71,11 @@ export const HomeworkHistoryItem = ({ history }: HomeworkHistoryItemProps) => {
           textStyle="body1"
         >
           {submissionLink ? (
-            <Button as="a" href={submissionLink} size="sm" variant="outline">
-              제출한 과제 확인
-            </Button>
+            <Link href={submissionLink} target="_blank">
+              <Button size="sm" variant="outline">
+                제출한 과제 확인
+              </Button>
+            </Link>
           ) : (
             "-"
           )}
@@ -81,7 +86,7 @@ export const HomeworkHistoryItem = ({ history }: HomeworkHistoryItemProps) => {
 };
 
 const homeworkSubmissionMap: Record<
-  AssignmentSubmissionStatusType,
+  HomeworkSubmissionStatusType,
   { message: string; color: ComponentProps<typeof Tag>["color"] }
 > = {
   FAILURE: {
diff --git a/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkOverviewBox.tsx b/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkOverviewBox.tsx
index 70f45c74..a97fb011 100644
--- a/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkOverviewBox.tsx
+++ b/apps/client/app/(afterLogin)/my-study/my-homework/_components/HomeworkOverviewBox.tsx
@@ -4,9 +4,10 @@ import { Flex, styled } from "@styled-system/jsx";
 import { Space, Text } from "@wow-class/ui";
 import { tags } from "constants/tags";
 import { revalidateTag } from "next/cache";
+import Link from "next/dist/client/link";
 import Image from "next/image";
 import type { SubmittableAssignment } from "types/dtos/study-detail-dashboard";
-import { Link, Reload } from "wowds-icons";
+import { Link as LinkIcon, Reload as ReloadIcon } from "wowds-icons";
 import Box from "wowds-ui/Box";
 import Button from "wowds-ui/Button";
 import Tag from "wowds-ui/Tag";
@@ -40,12 +41,12 @@ export const HomeworkOverviewBox = ({
                   {assignment.assignmentSubmissionStatus}
                 </Tag>
               </Flex>
-              <TextButton
-                as="a"
-                href={assignment.descriptionLink}
-                style={{ paddingLeft: "0px", width: "fit-content" }}
-                text="과제 명세 확인"
-              />
+              <Link href={assignment.descriptionLink} target="_blank">
+                <TextButton
+                  style={{ paddingLeft: "0px" }}
+                  text="과제 명세 확인"
+                />
+              </Link>
               <Space height="xs" />
               <Text color="sub">종료 일시 : {assignment.deadline}</Text>
               <Flex gap="xs">
@@ -63,18 +64,18 @@ export const HomeworkOverviewBox = ({
                 </styled.div>
               </Flex>
               <Space height={26} />
-              <Button
-                as="a"
-                href={assignment.submissionLink}
-                icon={<Link stroke="primary" />}
-                style={{ maxWidth: "100%" }}
-                variant="outline"
-              >
-                제출하러 가기
-              </Button>
+              <Link href={assignment.submissionLink} target="_blank">
+                <Button
+                  icon={<LinkIcon stroke="primary" />}
+                  style={{ maxWidth: "100%" }}
+                  variant="outline"
+                >
+                  제출하러 가기
+                </Button>
+              </Link>
               <Space height={8} />
               <Button
-                icon={<Reload />}
+                icon={<ReloadIcon />}
                 style={{ maxWidth: "100%" }}
                 onClick={handleClickSubmissionComplete}
               >
diff --git a/apps/client/app/(afterLogin)/study-apply/_components/StudyItem.tsx b/apps/client/app/(afterLogin)/study-apply/_components/StudyItem.tsx
index 08613ba3..bdba7508 100644
--- a/apps/client/app/(afterLogin)/study-apply/_components/StudyItem.tsx
+++ b/apps/client/app/(afterLogin)/study-apply/_components/StudyItem.tsx
@@ -6,6 +6,7 @@ import { Table, Text } from "@wow-class/ui";
 import { parseISODate, splitTime } from "@wow-class/utils";
 import { studyApplyApi } from "apis/studyApplyApi";
 import { dayToKorean } from "constants/dayToKorean";
+import Link from "next/link";
 import type { ComponentProps } from "react";
 import type { StudyListApiResponseDto } from "types/dtos/apply-study";
 import Button from "wowds-ui/Button";
@@ -66,9 +67,9 @@ const StudyItem = ({ study }: StudyItemProps) => {
         </Flex>
         <Text color="sub" typo="body2">
           {`${introduction} -`}
-          <a href={notionLink} target="_blank">
+          <Link href={notionLink} target="_blank">
             {notionLink}
-          </a>
+          </Link>
         </Text>
       </Flex>
       <Text className={textCellStyle}>{mentorName}</Text>
diff --git a/apps/client/types/dtos/study-detail-dashboard.ts b/apps/client/types/dtos/study-detail-dashboard.ts
index 4a483523..a73738a8 100644
--- a/apps/client/types/dtos/study-detail-dashboard.ts
+++ b/apps/client/types/dtos/study-detail-dashboard.ts
@@ -1,4 +1,4 @@
-import type { AssignmentSubmissionStatusType } from "types/entities/assignment";
+import type { HomeworkSubmissionStatusType } from "types/entities/homework";
 
 export interface StudyDetailDashboardDto {
   repositoryLink: string;
@@ -11,7 +11,7 @@ export interface SubmittableAssignment {
   assignmentStatus: "NONE" | "OPEN" | "CANCELLED";
   week: number;
   title: string;
-  assignmentSubmissionStatus: AssignmentSubmissionStatusType;
+  assignmentSubmissionStatus: HomeworkSubmissionStatusType;
   descriptionLink: string;
   deadline: string;
   submissionLink: string;
diff --git a/apps/client/types/dtos/study-history.ts b/apps/client/types/dtos/study-history.ts
index d87d7aa5..b7972ac3 100644
--- a/apps/client/types/dtos/study-history.ts
+++ b/apps/client/types/dtos/study-history.ts
@@ -1,4 +1,4 @@
-import type { AssignmentSubmissionStatusType } from "types/entities/assignment";
+import type { HomeworkSubmissionStatusType } from "types/entities/homework";
 
 export interface AssignmentHistoryDto {
   assignmentHistoryId: number;
@@ -6,6 +6,6 @@ export interface AssignmentHistoryDto {
   deadline: string;
   descriptionLink?: string;
   submissionLink?: string;
-  assignmentSubmissionStatus: AssignmentSubmissionStatusType; //TODO: 과제 휴강 여부 추가
+  assignmentSubmissionStatus: HomeworkSubmissionStatusType; //TODO: 과제 휴강 여부 추가
   week: number;
 }
diff --git a/apps/client/types/entities/assignment.ts b/apps/client/types/entities/assignment.ts
deleted file mode 100644
index 627d8ff7..00000000
--- a/apps/client/types/entities/assignment.ts
+++ /dev/null
@@ -1 +0,0 @@
-export type AssignmentSubmissionStatusType = "FAILURE" | "SUCCESS"; //TODO: 과제 휴강 여부 추가
diff --git a/apps/client/types/entities/homework.ts b/apps/client/types/entities/homework.ts
new file mode 100644
index 00000000..86c8fde8
--- /dev/null
+++ b/apps/client/types/entities/homework.ts
@@ -0,0 +1 @@
+export type HomeworkSubmissionStatusType = "FAILURE" | "SUCCESS"; //TODO: 과제 휴강 여부 추가