Skip to content

Commit

Permalink
Merge branch 'develop' into feature/#28-application_api
Browse files Browse the repository at this point in the history
  • Loading branch information
eternrust committed Jun 1, 2024
2 parents e826a05 + 4605730 commit 5d2b86e
Show file tree
Hide file tree
Showing 37 changed files with 887 additions and 300 deletions.
8 changes: 7 additions & 1 deletion .prettierrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,11 @@
"singleQuote": true,
"trailingComma": "all",
"useTabs": false,
"tabWidth": 2
"tabWidth": 2,
"bracketSpacing": true,
"jsxSingleQuote": false,
"printWidth": 80,
"proseWrap": "preserve",
"quoteProps": "as-needed",
"endOfLine": "lf"
}
15 changes: 13 additions & 2 deletions next.config.mjs
Original file line number Diff line number Diff line change
@@ -1,4 +1,15 @@
/** @type {import('next').NextConfig} */
const nextConfig = {};
const nextConfig = {
images: {
remotePatterns: [
{
protocol: 'https',
hostname: 'lh3.googleusercontent.com',
port: '',
pathname: '/**',
},
],
},
}

export default nextConfig;
export default nextConfig
248 changes: 147 additions & 101 deletions src/app/application/[id]/page.tsx
Original file line number Diff line number Diff line change
@@ -1,107 +1,153 @@
"use client"
'use client'

import { Arrow, Bag, Delete, FileUpload, Linking, More } from "@/assets";
import { ApplicationDeleteModal } from "@/components/modal/ApplicationDelete";
import { getApplicationDetail } from "@/services/getApplicationDetail";
import { applicationType } from "@/types/applicationType";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { useEffect, useState } from "react";
import { Arrow, Bag, Delete, FileUpload, Linking, More } from '@/assets'
import { ApplicationDeleteModal } from '@/components/modal/ApplicationDelete'
import { getApplicationDetail, getMe, getUser } from '@/services'
import { ApplicationType, UserType } from '@/types'
import Link from 'next/link'
import { useEffect, useState } from 'react'

export default function Detail({params}: {params: {id: number}}){
export default function Detail({ params }: { params: { id: number } }) {
const [open, setOpen] = useState<boolean>(false)
const [modal, setModal] = useState<boolean>(false)
const [detailData, setDetailData] = useState<ApplicationType>()
const [userData, setUserData] = useState<UserType>()
const [myData, setMyData] = useState<UserType>()

const [open, setOpen] = useState<boolean>(false)
const [modal, setModal] = useState<boolean>(false)
const [detailData, setDetailData] = useState()
const getData = async () => {
const data: ApplicationType = await getApplicationDetail(params.id)
const user: UserType = await getUser(data.post_writer_id)
setUserData(user)
setDetailData(data)
}

useEffect(()=>{
async()=>{
const data = await getApplicationDetail(params.id)
console.log(data)
setDetailData(data)
}
},[detailData])
const MyData = async () => {
const my = await getMe()
setMyData(my)
}

return(
<>
{
modal &&
<ApplicationDeleteModal click={setModal} />
}
<section className="w-full flex justify-center">
<article className="flex flex-col w-[50%] min-w-[600px] mt-16 gap-10">
<div className="flex justify-between items-center">
<div className="p-2 border border-gray200 rounded-lg cursor-pointer">
<Arrow direction="left"/>
</div>
<div className="cursor-pointer relative" onClick={()=>setOpen(!open)}>
<More/>
{
open &&
<button
onClick={()=>setModal(!modal)}
className="absolute top-8 right-1 flex items-center text-labelMedium gap-2 p-3 rounded-xl w-[160px] border border-gray200 bg-gray50"
>
<Delete className="text-gray800" />
자료 삭제하기
</button>
}
</div>
</div>
<div className="flex flex-col gap-4">
<div>
<span className="px-4 py-[6px] text-attention bg-attentionBackground text-bodySmall rounded-full">
포트폴리오
</span>
</div>
<h1 className="text-headlineSmall text-black">개인적으로 완벽한 포트폴리오</h1>
<div className="flex items-center gap-2 text-gray600">
<p>이강혁</p>
<p></p>
<p>2024.04.22. 14:07</p>
</div>
</div>
<div className="bg-gray200 h-[1px]"/>
<div className="flex items-center gap-10">
<div className="flex items-center gap-4">
<div className="p-3 bg-blue50 border border-blue100 rounded-xl">
<Bag className="text-blue500" size={28}/>
</div>
<div className="flex flex-col gap-[2px]">
<p className="text-bodySmall text-black">자료분야</p>
<div className="flex items-center gap-2">
<p className="text-labelMedium text-gray600">Frontend</p>
<p className="text-labelLarge text-gray300">|</p>
<p className="text-labelMedium text-gray600">Backend</p>
</div>
</div>
</div>
<div className="flex items-center gap-4">
<div className="p-3 bg-blue50 border border-blue100 rounded-xl">
<FileUpload className="text-blue500" size={28}/>
</div>
<div className="flex flex-col gap-[2px]">
<p className="text-bodySmall text-black">자료형식</p>
<div className="flex items-center gap-2">
<p className="text-labelMedium text-gray600">Web Link</p>
</div>
</div>
</div>
</div>
<div className="bg-gray200 h-[1px]"/>
<div className="flex flex-col gap-4 pb-[120px]">
<p className="text-titleSmall text-gray950">자료 미리보기</p>
<embed className="w-full h-[100vh]" src="https://velog.io/@lgb9811/%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C-%EC%B7%A8%EC%A7%81%EA%B9%8C%EC%A7%80-%ED%95%B4%EB%86%93%EA%B3%A0-%EC%95%84%EC%A7%81%EB%8F%84-%EA%B0%9D%EC%B2%B4%EC%A7%80%ED%96%A5%EC%9D%B4-%EB%AD%94%EC%A7%80-%EB%AA%A8%EB%A5%B8%EB%8B%A4%EA%B3%A0" />
<Link target='_blank' href="https://velog.io/@lgb9811/%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C-%EC%B7%A8%EC%A7%81%EA%B9%8C%EC%A7%80-%ED%95%B4%EB%86%93%EA%B3%A0-%EC%95%84%EC%A7%81%EB%8F%84-%EA%B0%9D%EC%B2%B4%EC%A7%80%ED%96%A5%EC%9D%B4-%EB%AD%94%EC%A7%80-%EB%AA%A8%EB%A5%B8%EB%8B%A4%EA%B3%A0" className="flex itmes-center justify-between p-4 border border-gray200 bg-gray50 rounded-xl cursor-pointer">
<div className="flex items-center gap-3">
<p className="text-bodyMedium text-gray950">자료링크 이동</p>
<p className="w-[400px] text-labelMedium text-gray600 whitespace-nowrap overflow-hidden text-ellipsis">https://velog.io/@lgb9811/%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C-%EC%B7%A8%EC%A7%81%EA%B9%8C%EC%A7%80-%ED%95%B4%EB%86%93%EA%B3%A0-%EC%95%84%EC%A7%81%EB%8F%84-%EA%B0%9D%EC%B2%B4%EC%A7%80%ED%96%A5%EC%9D%B4-%EB%AD%94%EC%A7%80-%EB%AA%A8%EB%A5%B8%EB%8B%A4%EA%B3%A0</p>
</div>
<Linking className="text-gray800"/>
</Link>
</div>
</article>
</section>
</>
);
const DateFormat = () => {
if (detailData?.post_created_at) {
const DateObj = new Date(detailData.post_created_at)

const year = String(DateObj.getFullYear())
let month = String(DateObj.getMonth() + 1)
let day = String(DateObj.getDate())
let hour = String(DateObj.getHours())
let minute = String(DateObj.getMinutes())

month = Number(month) >= 10 ? month : '0' + month
day = Number(day) >= 10 ? day : '0' + day
hour = Number(hour) >= 10 ? hour : '0' + hour
minute = Number(minute) >= 10 ? minute : '0' + minute
return year + '.' + month + '.' + day + '.' + ' ' + hour + ':' + minute
}
}

useEffect(() => {
getData()
MyData()
}, [])

return (
<>
{modal && (
<ApplicationDeleteModal postId={detailData?.post_id} click={setModal} />
)}
<section className="w-full flex justify-center">
<article className="flex flex-col w-[50%] min-w-[600px] mt-16 gap-10">
<div className="flex justify-between items-center">
<div className="p-2 border border-gray200 rounded-lg cursor-pointer">
<Arrow direction="left" />
</div>
{userData?.oauth_id === myData?.oauth_id && (
<div
className="cursor-pointer relative"
onClick={() => setOpen(!open)}
>
<More />
{open && (
<button
onClick={() => setModal(!modal)}
className="absolute top-8 right-1 flex items-center text-labelMedium gap-2 p-3 rounded-xl w-[160px] border border-gray200 bg-gray50"
>
<Delete className="text-gray800" />
자료 삭제하기
</button>
)}
</div>
)}
</div>
<div className="flex flex-col gap-4">
<div>
<span className="px-4 py-[6px] text-attention bg-attentionBackground text-bodySmall rounded-full">
{detailData?.post_post_type === 'Portfolio'
? '포트폴리오'
: detailData?.post_post_type === 'Resume'
? '이력서'
: detailData?.post_post_type === 'PersonalStatement'
? '자기소개서'
: ''}
</span>
</div>
<h1 className="text-headlineSmall text-black">
{detailData?.post_title}
</h1>
<div className="flex items-center gap-2 text-gray600">
<p>{userData?.name}</p>
<p></p>
<p>{DateFormat()}</p>
</div>
</div>
<div className="bg-gray200 h-[1px]" />
<div className="flex items-center gap-10">
<div className="flex items-center gap-4">
<div className="p-3 bg-blue50 border border-blue100 rounded-xl">
<Bag className="text-blue500" size={28} />
</div>
<div className="flex flex-col gap-[2px]">
<p className="text-bodySmall text-black">자료분야</p>
<div className="flex items-center gap-2">
<p className="text-labelMedium text-gray600">
{detailData?.post_major}
</p>
</div>
</div>
</div>
<div className="flex items-center gap-4">
<div className="p-3 bg-blue50 border border-blue100 rounded-xl">
<FileUpload className="text-blue500" size={28} />
</div>
<div className="flex flex-col gap-[2px]">
<p className="text-bodySmall text-black">자료형식</p>
<div className="flex items-center gap-2">
<p className="text-labelMedium text-gray600">Web Link</p>
</div>
</div>
</div>
</div>
<div className="bg-gray200 h-[1px]" />
<div className="flex flex-col gap-4 pb-[120px]">
<p className="text-titleSmall text-gray950">자료 미리보기</p>
<embed className="w-full h-[100vh]" src={detailData?.post_link} />
{detailData?.post_link && (
<Link
href={detailData?.post_link}
target="_blank"
className="flex itmes-center justify-between p-4 border border-gray200 bg-gray50 rounded-xl cursor-pointer"
>
<div className="flex items-center gap-3">
<p className="text-bodyMedium text-gray950">자료링크 이동</p>
<p className="w-[400px] text-labelMedium text-gray600 whitespace-nowrap overflow-hidden text-ellipsis">
{detailData.post_link}
</p>
</div>
<Linking className="text-gray800" />
</Link>
)}
</div>
</article>
</section>
</>
)
}
22 changes: 22 additions & 0 deletions src/app/profile/LogoutButton.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
'use client'

import { Button } from '@/components'
import { removeCookie } from '@/utils'
import { useRouter } from 'next/navigation'

export const LogoutButton = () => {
const router = useRouter()

const logout = () => {
console.log('logout!!')
removeCookie('RF-TOKEN')
removeCookie('access_token')
removeCookie('Access_Token')
router.replace('/')
}
return (
<Button kind="gray" size="small" onClick={logout}>
로그아웃
</Button>
)
}
Loading

0 comments on commit 5d2b86e

Please sign in to comment.