Skip to content

Commit e7d6f12

Browse files
committed
chore(fe/lint): upd interface
1 parent 9149095 commit e7d6f12

16 files changed

+99
-79
lines changed

spez-frontend/src/@types/Post.Type.d.ts

-5
This file was deleted.

spez-frontend/src/app/post/[id]/page.tsx

+20-14
Original file line numberDiff line numberDiff line change
@@ -9,22 +9,26 @@ import CmtForm from "@/components/CmtForm";
99
import { getRelativeTime } from "@/utils/getRelativeTime";
1010
import axios from "axios";
1111
import { GoTrash } from "react-icons/go";
12+
import { IPost, IComment } from "@/types";
1213
type Props = {
1314
params: { id: string };
1415
};
16+
interface getILike{
17+
like: number
18+
}
1519
export default async function Post({ params }: Props) {
1620
const id: string = params.id;
1721
const { getPost, getLike, getComment, delPost } = svPost();
1822

19-
const info: any = await getPost(id);
20-
const likes: any = await getLike(id);
21-
const comment: any = await getComment(id);
23+
const info: IPost = await getPost(id);
24+
const likes: getILike = await getLike(id);
25+
const comment: IComment[] = await getComment(id);
2226
const author_url = "/user/" + info.author.id;
2327
const handleLikeButton = async (e: React.FormEvent) => {
2428
e.preventDefault();
2529
try {
2630
// Send a POST request to your FastAPI backend
27-
let token: any
31+
let token: string | null
2832
if (typeof window !== 'undefined')
2933
token = localStorage.getItem('jwt')
3034
await axios.post(`http://localhost:8000/likes/?post_id=${id}`,
@@ -43,11 +47,11 @@ export default async function Post({ params }: Props) {
4347
alert('Failed to create like.');
4448
}
4549
};
46-
const handleDelPost = async (e: React.FormEvent) => {
47-
let token: any
50+
const handleDelPost = async () => {
51+
let token: string | null
4852
if (typeof window !== 'undefined')
4953
token = localStorage.getItem('jwt')
50-
const deletePost:any = await delPost(id, token);
54+
const deletePost:string = await delPost(id, token);
5155
console.log(deletePost)
5256

5357
}
@@ -73,21 +77,23 @@ export default async function Post({ params }: Props) {
7377
alt = "eagle_img"
7478
width={30}
7579
height={50} />
76-
<p className="pt-[0.35rem]">: {likes} </p>
80+
<p className="pt-[0.35rem]">: {likes.like} </p>
7781
</button>
7882
<div className="w-auto mt-[0.35rem] ml-5 border-2 rounded-full px-2 border-black">Phản hồi: {comment.length}</div>
7983
</div>
8084
<CmtForm postId={id} />
8185
</div>
8286
<div className="border-2 border-slate-950 p-2 text-black rounded shadow h-full w-1/2 space-y-5">
8387
<a className="font-bold text-2xl">Bình Loạn</a>
84-
{comment.map((e: any) => (
88+
{comment.map((element: IComment) => (
8589
<Comment
86-
// author_id = {comment.author}
87-
id = {e.id}
88-
author = {e.author}
89-
content= {e.content}
90-
date = {e.created_at}
90+
key={element.id}
91+
id = {element.id}
92+
author = {element.author}
93+
content= {element.content}
94+
created_at = {element.created_at}
95+
updated_at= {element.updated_at}
96+
post_id= {element.post_id}
9197
/>
9298
))}
9399
</div>

spez-frontend/src/app/user/[id]/page.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
import React from "react";
2-
import useUser from "@/utils/svUser";
2+
import svUser from "@/utils/svUser";
33
import ImageUploader from "@/components/ImgUpload";
44
import ImageFromBase64 from "@/components/DisplayImg";
55
type Props = {
66
params: { id: string };
77
};
88
export default async function User({ params }: Props) {
99
const id: string = params.id;
10-
const { getUser, getUsrProfile } = useUser();
10+
const { getUser, getUsrProfile } = svUser();
1111
const usr = await getUser(id);
1212
const usrprofile = await getUsrProfile(id);
1313
return (

spez-frontend/src/components/CmtForm.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11

22
"use client"
33
import React, { useState } from 'react';
4-
import dynamic from 'next/dynamic';
4+
// import dynamic from 'next/dynamic';
55
import SunEditor from 'suneditor-react';
66
import 'suneditor/dist/css/suneditor.min.css';
77
import axios from 'axios';
88
import { useRouter } from 'next/navigation';
99

1010
// Dynamically import SunEditor to avoid SSR issues
11-
const DynamicSunEditor = dynamic(() => import('suneditor-react'), {
12-
ssr: false,
13-
});
11+
// const DynamicSunEditor = dynamic(() => import('suneditor-react'), {
12+
// ssr: false,
13+
// });
1414

1515
type Props = {
1616
postId: string
@@ -24,12 +24,12 @@ export default function CmtForm ({postId}: Props) {
2424
e.preventDefault();
2525
try {
2626
// Send a POST request to your FastAPI backend
27-
let token: any
27+
let token: string | null
2828
if (typeof window !== 'undefined')
2929
token = localStorage.getItem('jwt')
3030
if(token === undefined)
3131
router.push('/')
32-
console.log(token)
32+
// console.log(token)
3333
await axios.post(`http://localhost:8000/posts/cmt/${postId}`,
3434
{
3535

spez-frontend/src/components/Comment.tsx

+13-12
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,13 @@ import Link from "next/link";
33
import Parser from "html-react-parser";
44
import svPost from "@/utils/svPost";
55
import { GoTrash } from "react-icons/go";
6-
type Prop = {
7-
id: string;
8-
author: any;
9-
content: string;
10-
date: string;
11-
};
12-
13-
export default async function Comment({ id, author, content, date }: Prop) {
6+
import { IComment } from "@/types";
7+
8+
export default async function Comment({id, author, content, created_at}: IComment) {
149
const usr_url = "/user/" + author.id;
1510
const { delComment } = await svPost();
16-
const handleDelCmt = async (e: any) => {
17-
let token: any;
11+
const handleDelCmt = async () => {
12+
let token: string | null;
1813
if (typeof window !== "undefined") token = localStorage.getItem("jwt");
1914
await delComment(id, token);
2015
};
@@ -27,9 +22,15 @@ export default async function Comment({ id, author, content, date }: Prop) {
2722
{author?.username}
2823
</Link>
2924
{" "}
30-
<a className="text-sm">{getRelativeTime(date)}</a>
25+
<a className="text-sm">{getRelativeTime(created_at)}</a>
3126
</div>
32-
<button onClick={handleDelCmt} className="text-red-600 text-semibold mr-6"> <GoTrash /></button>
27+
<button
28+
onClick={handleDelCmt}
29+
className="text-red-600 text-semibold mr-6"
30+
>
31+
{" "}
32+
<GoTrash />
33+
</button>
3334
</div>
3435
<div className="pl-8">{Parser(content)}</div>
3536
</div>

spez-frontend/src/components/DisplayImg.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ interface ImgUrlProps {
55
base64String: string;
66
}
77
const ImageFromBase64 = ({ base64String }: ImgUrlProps) => {
8-
const [imageUrl, setImageUrl] = useState(null);
8+
const [imageUrl, setImageUrl] = useState<string | null> (null);
99

1010
useEffect(() => {
1111
if (base64String) {
@@ -18,7 +18,7 @@ const ImageFromBase64 = ({ base64String }: ImgUrlProps) => {
1818
const blob = new Blob([byteArray], { type: "image/jpeg" }); // Adjust MIME type as needed
1919

2020
// Create a URL from the blob and set it to the imageUrl state
21-
const url: any = URL.createObjectURL(blob);
21+
const url: string = URL.createObjectURL(blob);
2222
setImageUrl(url);
2323

2424
// Clean up the URL when the component unmounts

spez-frontend/src/components/ImgUpload.tsx

+8-8
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
"use client";
22
import React, { useState } from "react";
3-
import useUser from "@/utils/svUser";
3+
import svUser from "@/utils/svUser";
44
interface ImgUploadProps {
55
userId: string;
66
}
77
function ImageUploader({ userId }: ImgUploadProps) {
8-
const [base64Image, setBase64Image] = useState("");
9-
const { updUsrProfile } = useUser();
10-
const handleFileChange = (event: any) => {
11-
const file = event.target.files[0];
8+
const [base64Image, setBase64Image] = useState<string | null> (null);
9+
const { updUsrProfile } = svUser();
10+
const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
11+
const file = event.target.files?.[0];
1212
if (file) {
13-
const reader: any = new FileReader();
13+
const reader = new FileReader();
1414
reader.onloadend = () => {
15-
const base64String = reader.result.split(",")[1];
15+
const base64String = reader.result? reader.result.toString().split(",")[1]: null
1616
setBase64Image(base64String);
1717
// You can also send the base64 string to the server here if needed
1818
console.log("Base64 Image String:", base64String);
@@ -23,7 +23,7 @@ function ImageUploader({ userId }: ImgUploadProps) {
2323

2424
const handleSubmit = async () => {
2525
try {
26-
let token: any;
26+
let token: string | null
2727
if (typeof window !== undefined) token = localStorage.getItem("jwt");
2828
const response = await updUsrProfile(userId, token, base64Image);
2929
const data = await response.json();

spez-frontend/src/components/LoginForm.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
"use client";
22
import { useState, FormEvent } from "react";
33
import LoadingSingle from "@/components/LoadingSingle";
4-
import { useRouter } from "next/navigation";
4+
// import { useRouter } from "next/navigation";
55

66
export default function LoginForm() {
7-
const router = useRouter();
8-
const [username, setUsername] = useState<string | any>("");
9-
const [password, setPassword] = useState<string | any>("");
10-
const [showPassword, setShowPassword] = useState<boolean | any>(false);
11-
const [isLoading, setIsLoading] = useState<boolean | any>(false);
7+
// const router = useRouter();
8+
const [username, setUsername] = useState<string>("");
9+
const [password, setPassword] = useState<string>("");
10+
const [showPassword, setShowPassword] = useState<boolean | null>(false);
11+
const [isLoading, setIsLoading] = useState<boolean | null>(false);
1212
const [error, setError] = useState("");
1313
const togglePasswordVisibility = () => {
14-
setShowPassword((prev: any) => !prev);
14+
setShowPassword((prev: boolean | null) => !prev);
1515
};
1616

1717
const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {

spez-frontend/src/components/NewsFeed.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import svPost from "@/utils/svPost"
22
import Post from "./Post";
3-
3+
import { IPost } from "@/types";
44
export default async function NewsFeed() {
55
const {getAllPost} = svPost();
66
const AllPost = await getAllPost();
@@ -11,13 +11,15 @@ export default async function NewsFeed() {
1111
<div className=" flex flex-col items-center gap-8">
1212

1313
{
14-
AllPost?.map((post:any) => (
14+
AllPost?.map((post: IPost) => (
1515
<Post
16+
key={post.id}
1617
id = {post.id}
1718
title = {post.title}
1819
content = {post.content}
1920
author = {post.author}
20-
date = {post.created_at}
21+
created_at = {post.created_at}
22+
updated_at= {post.updated_at}
2123
/>
2224
)
2325
)

spez-frontend/src/components/Post.tsx

+4-9
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,9 @@
11
import Link from "next/link";
22
import Parser from "html-react-parser";
33
import { getRelativeTime } from "@/utils/getRelativeTime";
4-
type PostProps = {
5-
id: string;
6-
title: string;
7-
content: string;
8-
author: any;
9-
date: string;
10-
};
11-
const Post: React.FC<PostProps> = ({ id, title, content, author, date }) => {
4+
import { IPost } from "@/types";
5+
6+
const Post: React.FC<IPost> = ({ id, title, content, author, created_at }) => {
127
const author_url = "/user/" + author.id;
138
const post_url = "/post/" + id;
149
return (
@@ -19,7 +14,7 @@ const Post: React.FC<PostProps> = ({ id, title, content, author, date }) => {
1914
{author.username}
2015
</Link>
2116
{" "}
22-
<a className="text-sm">{getRelativeTime(date)}</a>
17+
<a className="text-sm">{getRelativeTime(created_at)}</a>
2318
</div>
2419
<div className="pl-2 text-2xl font-bold">
2520
<Link href={post_url}>{title}</Link>

spez-frontend/src/components/PostForm.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
"use client"
22
import React, { useState } from 'react';
3-
import dynamic from 'next/dynamic';
3+
// import dynamic from 'next/dynamic';
44
import SunEditor from 'suneditor-react';
55
import 'suneditor/dist/css/suneditor.min.css';
66
import axios from 'axios';
77
import { useRouter } from 'next/navigation';
88

99
// Dynamically import SunEditor to avoid SSR issues
10-
const DynamicSunEditor = dynamic(() => import('suneditor-react'), {
11-
ssr: false,
12-
});
10+
// const DynamicSunEditor = dynamic(() => import('suneditor-react'), {
11+
// ssr: false,
12+
// });
1313

1414
export default function PostForm () {
1515
const [content, setContent] = useState<string>('');
@@ -22,7 +22,7 @@ export default function PostForm () {
2222

2323
try {
2424
// Send a POST request to your FastAPI backend
25-
let token: any
25+
let token: string | null
2626
if (typeof window !== 'undefined')
2727
token = localStorage.getItem('jwt')
2828
if(token === undefined)

spez-frontend/src/types/index.ts

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
export interface IPost {
2+
id: string,
3+
title: string,
4+
content: string,
5+
created_at: string,
6+
updated_at: string
7+
author: user
8+
}
9+
export interface user {
10+
id: string;
11+
username: string;
12+
email: string;
13+
created_at: string;
14+
}
15+
16+
export interface IComment {
17+
content: string,
18+
id: string,
19+
created_at: string,
20+
updated_at: string,
21+
author: user,
22+
post_id: string
23+
}

spez-frontend/src/utils/getRelativeTime.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
export function getRelativeTime(date: any) {
1+
export function getRelativeTime(date: string) {
22
const rtf = new Intl.RelativeTimeFormat('en', { numeric: 'auto' });
33

44
const now = new Date();

spez-frontend/src/utils/svPost.ts

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
import { BE_URI } from "@/utils/constants";
22
import axios from "axios";
33
export default function svPost() {
4-
let token: any;
5-
if (typeof window !== "undefined") token = localStorage.getItem("jwt");
6-
console.log(token);
4+
75
const API = {
86
all: BE_URI + "/posts",
97
post: BE_URI + "/posts/",

spez-frontend/src/utils/svUser.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { BE_URI } from "@/utils/constants";
22
import axios from "axios";
33

44
export default function svUser() {
5-
const API: any = {
5+
const API = {
66
usr: BE_URI + "/users/",
77
// useprofile: BE_URI +
88
};

spez-frontend/tsconfig.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,6 @@
2121
"@/*": ["./src/*"]
2222
}
2323
},
24-
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
24+
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "src/utils/getRelativeTime.ts"],
2525
"exclude": ["node_modules"]
2626
}

0 commit comments

Comments
 (0)