diff --git a/src/components/molecules/TestSignInButton/TestSignInButton.tsx b/src/components/molecules/TestSignInButton/TestSignInButton.tsx new file mode 100644 index 00000000..a9ab6009 --- /dev/null +++ b/src/components/molecules/TestSignInButton/TestSignInButton.tsx @@ -0,0 +1,64 @@ +import { Box, Image, Text } from '@chakra-ui/react'; +import { BorderBox } from '~/components/atoms/BorderBox'; +import { assets } from '~/config/assets'; + +type TestSignInButtonProps = { + logo: 'mentee' | 'mentor'; + onClick: VoidFunction; +}; + +const TestSignInButton = ({ logo, onClick }: TestSignInButtonProps) => { + const LOGOS = { + mentee: { + svg: assets.menteeSvg, + text: '멘티', + }, + mentor: { + svg: assets.mentorSvg, + text: '멘토', + }, + }; + + return ( + + ); +}; + +export default TestSignInButton; diff --git a/src/components/molecules/TestSignInButton/index.stories.tsx b/src/components/molecules/TestSignInButton/index.stories.tsx new file mode 100644 index 00000000..5999eb7a --- /dev/null +++ b/src/components/molecules/TestSignInButton/index.stories.tsx @@ -0,0 +1,28 @@ +import type { Meta } from '@storybook/react'; +import TestSignInButton from './TestSignInButton'; + +const meta = { + title: 'Resumeme/Components/Molecules/TestSignInButton', + component: TestSignInButton, + tags: ['autodocs'], +} satisfies Meta; + +export default meta; + +export const MenteeSignInButton = () => { + return ( + {}} + /> + ); +}; + +export const MentorSignInButton = () => { + return ( + {}} + /> + ); +}; diff --git a/src/components/molecules/TestSignInButton/index.ts b/src/components/molecules/TestSignInButton/index.ts new file mode 100644 index 00000000..e91d3690 --- /dev/null +++ b/src/components/molecules/TestSignInButton/index.ts @@ -0,0 +1,3 @@ +import TestSignInButton from './TestSignInButton'; + +export { TestSignInButton }; diff --git a/src/components/templates/SignInTemplate/SignInTemplate.tsx b/src/components/templates/SignInTemplate/SignInTemplate.tsx index 7b703136..a24356ce 100644 --- a/src/components/templates/SignInTemplate/SignInTemplate.tsx +++ b/src/components/templates/SignInTemplate/SignInTemplate.tsx @@ -1,12 +1,13 @@ import { ChevronRightIcon } from '@chakra-ui/icons'; -import { Image, Divider, Flex, Heading, Icon, Text } from '@chakra-ui/react'; +import { Image, Divider, Flex, Heading, Icon, Text, Box } from '@chakra-ui/react'; import { Link } from '@chakra-ui/react'; import { AiFillGithub } from 'react-icons/ai'; import { RiNotionFill } from 'react-icons/ri'; import { BorderBox } from '~/components/atoms/BorderBox'; import { OAuthSignInButton } from '~/components/molecules/OAuthSignInButton'; +import { TestSignInButton } from '~/components/molecules/TestSignInButton'; import { assets } from '~/config/assets'; -import CONSTANTS from '~/constants'; +// import CONSTANTS from '~/constants'; const TEXT = { welcomeMessage: '이력, 써에 가입하고 피드백을 받아보세요.', @@ -18,7 +19,8 @@ const TEXT = { const SignInTemplate = () => { const handleKakaoClick = () => { - window.location.href = CONSTANTS.KAKAO_SIGNIN_URL; + alert('현재는 테스트 계정만 로그인할 수 있습니다.'); + // window.location.href = CONSTANTS.KAKAO_SIGNIN_URL; }; return ( @@ -40,10 +42,27 @@ const SignInTemplate = () => { {TEXT.subMessage} - + + + { + alert('clicked!'); + }} + /> + { + alert('clicked!'); + }} + /> +