Skip to content

Commit 1629ac3

Browse files
addiescode-sjaddiescode-sj
authored
Merge pull request #238 from asksa1256/Next-이상달-sprint10
[이상달] sprint10
2 parents 98a7805 + 4446101 commit 1629ac3

34 files changed

Lines changed: 3295 additions & 94 deletions

‎app/items/[itemId]/page.tsx‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { getTodo } from "@/lib/api";
2+
import getBlurImage from "@/lib/getBlurImage";
3+
import TodoUpdateForm from "@/components/Todos/TodoUpdateForm";
4+
5+
interface ItemDetailPageProps {
6+
params: Promise<{ itemId: string }>;
7+
}
8+
9+
const ItemDetailPage = async ({ params }: ItemDetailPageProps) => {
10+
const { itemId } = await params;
11+
const data = await getTodo(itemId);
12+
13+
let blurImageUrl: string | undefined;
14+
if (data.imageUrl) blurImageUrl = await getBlurImage(data.imageUrl);
15+
16+
return (
17+
<section className="mt-10">
18+
<TodoUpdateForm initialData={data} blurImageUrl={blurImageUrl} />
19+
</section>
20+
);
21+
};
22+
23+
export default ItemDetailPage;

‎app/layout.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import "@/styles/globals.css";
44
import Header from "@/components/Header";
55
import nanumSquare from "@/assets/fonts/NanumSquare/nanumSquare";
66
import QueryProvider from "./providers/QueryProvider";
7+
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
78

89
export const metadata: Metadata = {
910
title: "간편한 투두리스트 - Do it",
@@ -20,7 +21,12 @@ export default function RootLayout({
2021
<body className={`${nanumSquare.className} bg-gray-50`}>
2122
<Header />
2223
<div className="my-6 md:w-full lg:w-[1200px] lg:mx-auto">
23-
<QueryProvider>{children}</QueryProvider>
24+
<QueryProvider>
25+
{children}
26+
{process.env.NODE_ENV === "development" && (
27+
<ReactQueryDevtools initialIsOpen={false} />
28+
)}
29+
</QueryProvider>
2430
</div>
2531
</body>
2632
</html>

‎app/page.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
11
import TodoClient from "@/components/Todos/TodoClient";
22
import { getTodos } from "@/lib/api";
33
import { Suspense } from "react";
4-
import TodoLoading from "@/components/Todos/TodoLoading";
4+
import TodoLoading from "@/components/Loader/TodoLoading";
5+
import PrefetchHydration from "@/components/PrefetchHydration";
56

67
const Home = async () => {
7-
const initialItems = await getTodos();
8-
98
return (
109
<Suspense fallback={<TodoLoading />}>
11-
<TodoClient initialItems={initialItems} />
10+
<PrefetchHydration queries={[{ queryKey: ["todos"], queryFn: getTodos }]}>
11+
<TodoClient />
12+
</PrefetchHydration>
1213
</Suspense>
1314
);
1415
};

‎assets/images/ico-check.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎assets/images/ico-edit.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎assets/images/ico-img.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎assets/images/ico-plus.svg‎

Lines changed: 4 additions & 0 deletions
Loading

public/images/ico-x.svg renamed to assets/images/ico-x.svg

File renamed without changes.

‎components/Button/BulletButton.tsx‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
"use client";
2+
3+
import clsx from "clsx";
4+
import Image from "next/image";
5+
import { MouseEvent } from "react";
6+
7+
interface BulletButtonProps {
8+
variant?: string;
9+
type?: "submit" | "button";
10+
onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
11+
}
12+
13+
const BulletButton = ({
14+
variant,
15+
type = "button",
16+
onClick,
17+
}: BulletButtonProps) => {
18+
return (
19+
<button
20+
className={clsx("group relative bullet-base", {
21+
"bullet-todo": variant === "todo",
22+
"bullet-done": variant === "done",
23+
})}
24+
onClick={onClick}
25+
type={type}
26+
>
27+
<Image
28+
src="/images/ico-check-wt.svg"
29+
alt="완료된 할 일"
30+
width="20"
31+
height="20"
32+
className={clsx(
33+
"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transition-opacity",
34+
{
35+
"opacity-100": variant === "done",
36+
"opacity-0 group-hover:opacity-100": variant === "todo",
37+
}
38+
)}
39+
/>
40+
</button>
41+
);
42+
};
43+
44+
export default BulletButton;

‎components/Button/index.tsx‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,16 @@ interface ButtonProps {
66
variant: "primary" | "success" | "danger";
77
children: ReactNode;
88
disabled?: boolean;
9+
onClick?: () => void;
910
}
1011

11-
const Button = ({ type, variant, children, disabled }: ButtonProps) => {
12+
const Button = ({
13+
type,
14+
variant,
15+
children,
16+
disabled,
17+
onClick,
18+
}: ButtonProps) => {
1219
return (
1320
<button
1421
type={type}
@@ -19,6 +26,7 @@ const Button = ({ type, variant, children, disabled }: ButtonProps) => {
1926
"btn-danger": variant === "danger" && !disabled,
2027
"btn-disabled": disabled,
2128
})}
29+
onClick={onClick}
2230
>
2331
{children}
2432
</button>

0 commit comments

Comments
 (0)