Skip to content

Commit

Permalink
[feat] My -> myPosting 일단 추가
Browse files Browse the repository at this point in the history
  • Loading branch information
JAEMOONLEE committed Sep 27, 2023
1 parent 9d212f9 commit 69b6247
Show file tree
Hide file tree
Showing 5 changed files with 93 additions and 20 deletions.
18 changes: 9 additions & 9 deletions components/ProfileCard/index.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import React, { useState } from 'react';
import { Nav, Textarea } from '@/components/index.tsx';
import EditProfile from '@/pages/profile/editProfile';
import { useForm } from 'react-hook-form';
import { Nav, Textarea } from '@/components/index.tsx';
import EditProfile from '@/pages/userInfo/editProfile';

import MyPosting from '@/public/icons/myPosting.svg';
import ChangePassword from '@/public/icons/Password.svg';
import Logout from '@/public/icons/LogOut.svg';
import Vector from '@/public/icons/Vector 115.svg';
import { useRouter } from 'next/router';

import useModal from '@/hooks/useModal.ts';

interface ProfileCardProps {
Expand Down Expand Up @@ -49,10 +49,10 @@ export default function ProfileCard({ name, age, gender, imageSrc }: ProfileCard
const ListItem = ({ IconComponent, text, route, index }: ListItemProps) => (
<div
className="flex justify-between items-center border border-gray-300 p-[10px]"
onMouseOver ={() => { console.log('mouseover', index); setHoveredIndex(index)} }
onMouseOver ={() => { setHoveredIndex(index)} }
onMouseOut={() => setHoveredIndex(null)}
onTouchStart={() => setHoveredIndex(index)}
onTouchEnd={() => setHoveredIndex(null)}
onTouchStart={() => setHoveredIndex(index)}
onTouchEnd={() => setHoveredIndex(null)}
onClick={() => handleRouting(route)}
>
<div className="flex items-center h-[35px]">
Expand All @@ -64,12 +64,12 @@ export default function ProfileCard({ name, age, gender, imageSrc }: ProfileCard
);

const items = [
{ IconComponent: MyPosting, text: "My postings", route: '/myPosting'},
{ IconComponent: MyPosting, text: "My postings", route: '/userInfo/myPostings'},
{ IconComponent: ChangePassword, text: "Change password", route: '/resetPassword/step1'},
{ IconComponent: Logout, text: "Log out", route: "/"},
];

function ListContainer() {
const ListContainer = () =>{
return (
<div className="flex flex-col w-full">
{items.map((item, index) => (
Expand All @@ -94,7 +94,7 @@ export default function ProfileCard({ name, age, gender, imageSrc }: ProfileCard
<button className="text-sm text-r5 border border-r5 rounded-full w-[50px] h-[24px]" onClick={handleProfileEdit}>Edit</button>
</div>
</div>
<Textarea
<Textarea
register={ register('describe') }
initValue={"Hi, I'm Dennis. I'm 31 years old and I'm from Seoul, South Korea. I'm a software engineer with 5 years of experience in the industry. I'm passionate about building innovative products that make people's lives easier."}
className="bg-r1 mb-[20px] h-[120px] text-[14px]"
Expand Down
15 changes: 4 additions & 11 deletions pages/profile/editProfile.tsx → pages/userInfo/editProfile.tsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,14 @@
import React, { useState } from 'react';
import { FieldError, useForm as UseForm } from 'react-hook-form';
import { FieldValues, SubmitHandler, FieldError, useForm as UseForm } from 'react-hook-form';
import useModal from '@/hooks/useModal.ts';
import { isValidEmail } from '@/utils/validCheck.ts';
import {
Textarea,
Button,
Upload,
Input,
Calendar
} from '@/components/index.tsx';
import { FieldValues, SubmitHandler } from 'react-hook-form';
import Calendar from '@/components/Calendar/Calendar.tsx';

import ProfileCamera from '@/public/icons/profileCamera.svg';

interface ProfileProps {
Expand All @@ -36,8 +34,7 @@ export default function EditProfile({ _imageSrc }: ProfileProps) {
formState: { errors },
} = UseForm({ mode: 'onChange' });
const [buttonState, setButtonState] = useState('Male');
const [isCalendarShow, setCalendarShow] = useState(false);


const onSubmit: SubmitHandler<FieldValues> = (data) => {
openModal({
props: {
Expand All @@ -49,10 +46,6 @@ export default function EditProfile({ _imageSrc }: ProfileProps) {
children: <>hi</>,
});
};

const handleCalendarShow = (isShow: boolean) => {
setCalendarShow(isShow);
}

const isPostingComplete = () => {
return true;
Expand Down Expand Up @@ -165,7 +158,7 @@ export default function EditProfile({ _imageSrc }: ProfileProps) {
<div className={subHeader}>Date of birth</div>
</div>
<section className='mb-[8px]'>
<Calendar placeholder="MM-DD-YYYY" type="text" register={register('dateAvailable')} disabled={watch('availableChecked')} handleCalendarShow={handleCalendarShow}/>
<Calendar placeholder="MM-DD-YYYY" type="text" register={register('dateAvailable')} disabled={watch('availableChecked')} />
</section>
<div className="mb-[12px] mt-[32px]">
<div className={subHeader}>About you</div>
Expand Down
File renamed without changes.
71 changes: 71 additions & 0 deletions pages/userInfo/myPostings.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
import React from 'react';
import NoPosting from '@/public/icons/noPosting.svg';
import Step1 from '@/pages/room/addRoom/step1.tsx';
import useModal from '@/hooks/useModal';

//import { useRouter } from 'next/router';


// TODO 데이터가 구체화되면 바꿔줘야함
interface MyPostingProps {
roomInfo : any | null;
}

export default function MyPosting({ roomInfo }: MyPostingProps) {
const { openModal } = useModal();

const handleAddPosting = () => {
openModal({
props: {
title: 'Add Rooms',
size: 'full',
custom: true,
customHeader: true,
},
children: <Step1 />,
});
};

/**
* 룸이 없을 때 보여주는 Component
*/
const NoPostings = () => {
const noPostingStyle = 'text-[20px] font-bold mt-[29px] text-center';
const containerStyle = 'h-screen flex flex-col items-center justify-center';

return (
<div className={containerStyle}>
<NoPosting />
<div className={noPostingStyle}>
Click here to post and find roommates!
</div>
<div className="mt-[29px]">
<button
className={`font-pretendard text-[16px] font-semibold bg-g0 border border-solid border-r1 rounded-[2px] text-r1 w-[120px] h-[48px]`}
onClick={() => handleAddPosting()}
type={'button'}
data-size={'md'}
>
+ Add post
</button>
</div>
</div>
);
};

/**
* 룸이 있을 때 보여주는 Component (TODO : 구체화 해줘야함)
*/
const MyRooms = () => {

return (
<div>
호이호이
</div>
);
};

return (
(roomInfo || []).length === 0 ? <NoPostings /> : <MyRooms />
)
}
9 changes: 9 additions & 0 deletions public/icons/noPosting.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 69b6247

Please sign in to comment.