Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor#57 #58

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .eslintcache

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion src/components/Write/school/examination/index.tsx
Original file line number Diff line number Diff line change
@@ -10,7 +10,7 @@ const Examination = () => {
return (
<Card>
<InputWrapper title="합격년도">
<Input type="text" width={650} changeEvent={setPass} />
<Input type="number" width={650} changeEvent={setPass} />
</InputWrapper>
</Card>
)
20 changes: 16 additions & 4 deletions src/components/Write/school/expect/index.tsx
Original file line number Diff line number Diff line change
@@ -7,11 +7,12 @@ import { localDetail, LocalKind } from "@/constants/Write/localKindConstant"
import useChange from "@/hooks/useChange"
import useLocal from "../hooks/useLocal"
import Card from "@/components/common/Card"
import usePhone from "@/hooks/usePhone"

const ExpectedForm = () => {
const [, changesShoolContact] = useChange()
const [schoolState, chagneSchoolState] = usePhone()
ksh5324 marked this conversation as resolved.
Show resolved Hide resolved
const [, changeTeacherName] = useChange()
const [, changeTeacherContact] = useChange()
const [teacherState, changeTeacherContact] = usePhone()

const { changeDetailLocal, changeLocal, detailLocal, local } = useLocal()

@@ -40,15 +41,26 @@ const ExpectedForm = () => {
/>
</InputWrapper>
<InputWrapper title="학교 연락처">
<Input type="text" width={208} changeEvent={changesShoolContact} />
<Input
type="text"
width={208}
onChange={chagneSchoolState}
placeholder="- 없이 입력해주세요"
value={schoolState}
/>
</InputWrapper>
</S.Wrap>
<S.Wrap justify="space-between">
<InputWrapper title="담임 성명">
<Input type="text" changeEvent={changeTeacherName} />
</InputWrapper>
<InputWrapper title="담임 연락처">
<Input type="text" changeEvent={changeTeacherContact} />
<Input
type="text"
onChange={changeTeacherContact}
placeholder="- 없이 입력해주세요"
value={teacherState}
/>
</InputWrapper>
</S.Wrap>
</Card>
13 changes: 10 additions & 3 deletions src/components/Write/school/graduate/index.tsx
Original file line number Diff line number Diff line change
@@ -4,12 +4,13 @@ import InputWrapper from "@/components/common/InputWrapper"
import Select from "@/components/common/Select"
import { localDetail, LocalKind } from "@/constants/Write/localKindConstant"
import useChange from "@/hooks/useChange"
import usePhone from "@/hooks/usePhone"
import useLocal from "../hooks/useLocal"
import * as S from "../style"

const GraduateForm = () => {
const { changeDetailLocal, changeLocal, detailLocal, local } = useLocal()
const [, changesShoolContact] = useChange()
const [schoolContact, changeSchoolContact] = usePhone()
const [, changeGraduate] = useChange()

return (
@@ -38,13 +39,19 @@ const GraduateForm = () => {
/>
</InputWrapper>
<InputWrapper title="학교 연락처">
<Input type="text" width={208} changeEvent={changesShoolContact} />
<Input
type="text"
width={208}
changeEvent={changeSchoolContact}
value={schoolContact}
placeholder="- 없이 입력해주세요"
/>
</InputWrapper>
</S.Wrap>
</Card>
<Card>
<InputWrapper title="졸업년도">
<Input type="text" width={650} changeEvent={changeGraduate} />
<Input type="number" width={650} changeEvent={changeGraduate} />
ksh5324 marked this conversation as resolved.
Show resolved Hide resolved
</InputWrapper>
</Card>
</>
25 changes: 25 additions & 0 deletions src/hooks/usePhone.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import type { ChangeEventHandler } from "react"
import { useState, useEffect } from "react"

const usePhone = <
T extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement,
>(): [string | undefined, ChangeEventHandler<T>] => {
const [state, setState] = useState<string>("")
useEffect(() => {
setState((prev) =>
prev
.replace(/[^0-9]/g, "")
.replace(/^(\d{2,3})(\d{3,4})(\d{4})$/, `$1-$2-$3`),
)
}, [state])

const changeEvent: ChangeEventHandler<T> = (e) => {
const regex = /^[0-9\b -]{0,13}$/
if (regex.test(e.target.value)) {
setState(e.target.value)
}
}
return [state, changeEvent]
}

export default usePhone
5 changes: 5 additions & 0 deletions src/styles/GlobalStyle.tsx
Original file line number Diff line number Diff line change
@@ -25,6 +25,11 @@ const GlobalStyle = createGlobalStyle`
display: flex;
outline: none;
padding-left: 10px;
};
input::-webkit-inner-spin-button {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
}
`

69 changes: 69 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
@@ -22,6 +22,11 @@
resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.22.6.tgz"
integrity sha512-29tfsWTq2Ftu7MXmimyC0C5FDZv5DYxOZkh3XD3+QW4V/BYuv/LyEsjj3c0hqedEaDt6DBfDvexMKU8YevdqFg==

"@babel/compat-data@^7.22.9":
version "7.22.9"
resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.22.9.tgz#71cdb00a1ce3a329ce4cbec3a44f9fef35669730"
integrity sha512-5UamI7xkUcJ3i9qVDS+KFDEK8/7oJ55/sJMB1Ge7IEapr7KfdfV/HErR+koZwOfd+SgtFKOKRhRakdg++DcJpQ==

"@babel/core@^7.21.3":
version "7.22.9"
resolved "https://registry.npmjs.org/@babel/core/-/core-7.22.9.tgz"
@@ -53,6 +58,16 @@
"@jridgewell/trace-mapping" "^0.3.17"
jsesc "^2.5.1"

"@babel/generator@^7.22.9":
version "7.22.10"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.22.10.tgz#c92254361f398e160645ac58831069707382b722"
integrity sha512-79KIf7YiWjjdZ81JnLujDRApWtl7BxTqWD88+FFdQEIOG8LJ0etDOM7CXuIgGJa55sGOwZVwuEsaLEm0PJ5/+A==
dependencies:
"@babel/types" "^7.22.10"
"@jridgewell/gen-mapping" "^0.3.2"
"@jridgewell/trace-mapping" "^0.3.17"
jsesc "^2.5.1"

"@babel/helper-annotate-as-pure@^7.16.0", "@babel/helper-annotate-as-pure@^7.22.5":
version "7.22.5"
resolved "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.22.5.tgz"
@@ -78,6 +93,17 @@
browserslist "^4.21.9"
lru-cache "^5.1.1"

"@babel/helper-compilation-targets@^7.22.9":
version "7.22.10"
resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.10.tgz#01d648bbc25dd88f513d862ee0df27b7d4e67024"
integrity sha512-JMSwHD4J7SLod0idLq5PKgI+6g/hLD/iuWBq08ZX49xE14VpVEojJ5rHWptpirV2j020MvypRLAXAO50igCJ5Q==
dependencies:
"@babel/compat-data" "^7.22.9"
"@babel/helper-validator-option" "^7.22.5"
browserslist "^4.21.9"
lru-cache "^5.1.1"
semver "^6.3.1"

"@babel/helper-create-class-features-plugin@^7.22.5":
version "7.22.6"
resolved "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.22.6.tgz"
@@ -161,6 +187,17 @@
"@babel/traverse" "^7.22.5"
"@babel/types" "^7.22.5"

"@babel/helper-module-transforms@^7.22.9":
version "7.22.9"
resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.22.9.tgz#92dfcb1fbbb2bc62529024f72d942a8c97142129"
integrity sha512-t+WA2Xn5K+rTeGtC8jCsdAH52bjggG5TKRuRrAGNM/mjIbO4GxvlLMFOEz9wXY5I2XQ60PMFsAG2WIcG82dQMQ==
dependencies:
"@babel/helper-environment-visitor" "^7.22.5"
"@babel/helper-module-imports" "^7.22.5"
"@babel/helper-simple-access" "^7.22.5"
"@babel/helper-split-export-declaration" "^7.22.6"
"@babel/helper-validator-identifier" "^7.22.5"

"@babel/helper-optimise-call-expression@^7.22.5":
version "7.22.5"
resolved "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.22.5.tgz"
@@ -1038,6 +1075,15 @@
"@babel/helper-validator-identifier" "^7.22.5"
to-fast-properties "^2.0.0"

"@babel/types@^7.22.10":
version "7.22.10"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.22.10.tgz#4a9e76446048f2c66982d1a989dd12b8a2d2dc03"
integrity sha512-obaoigiLrlDZ7TUQln/8m4mSqIW2QFeOrCQc9r+xsaHGNoplVNYlRVpsfE8Vj35GEm2ZH4ZhrNYogs/3fj85kg==
dependencies:
"@babel/helper-string-parser" "^7.22.5"
"@babel/helper-validator-identifier" "^7.22.5"
to-fast-properties "^2.0.0"

"@cometjs/core@^2.1.0":
version "2.3.2"
resolved "https://registry.npmjs.org/@cometjs/core/-/core-2.3.2.tgz"
@@ -4111,6 +4157,11 @@ quick-lru@^6.1.1:
resolved "https://registry.npmjs.org/quick-lru/-/quick-lru-6.1.1.tgz"
integrity sha512-S27GBT+F0NTRiehtbrgaSE1idUAJ5bX8dPAQTdylEyNlrdcH5X4Lz7Edz3DYzecbsCluD5zO8ZNEe04z3D3u6Q==

react-date-object@^2.1.5:
version "2.1.7"
resolved "https://registry.yarnpkg.com/react-date-object/-/react-date-object-2.1.7.tgz#a21fff40ef18344fee3616f40ee86169c1e83f5e"
integrity sha512-810eaGk/xvQBJNncPvhwXaKcSwPRKX48jtY/5U5T1bSUnGFqmBdMvl4EVl76cyzQ8U3KX6hpF6xZ1c0eY9vvJA==

react-dom@18.2.0, react-dom@^18.2.0:
version "18.2.0"
resolved "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz"
@@ -4119,6 +4170,11 @@ react-dom@18.2.0, react-dom@^18.2.0:
loose-envify "^1.1.0"
scheduler "^0.23.0"

react-element-popper@^2.1.6:
version "2.1.6"
resolved "https://registry.yarnpkg.com/react-element-popper/-/react-element-popper-2.1.6.tgz#4afb912287d57de5d442fb85e76f4d7b94fde879"
integrity sha512-8va7mUmrKIkUnaM2t5Dyctd8cjgVgVcrv5vVD0FRay0sN6EPBCKa0bDi1/KmVDAjfgSIn7zQnjtc4VojcGrkgQ==

react-hook-form@^7.45.4:
version "7.45.4"
resolved "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.45.4.tgz"
@@ -4134,6 +4190,14 @@ react-is@^16.13.1, react-is@^16.7.0:
resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==

react-multi-date-picker@^4.1.2:
version "4.1.2"
resolved "https://registry.yarnpkg.com/react-multi-date-picker/-/react-multi-date-picker-4.1.2.tgz#a8ce21946d3b9785e3aab0b7ab48b5a72bd3ebde"
integrity sha512-slpfl4uzXs9mA31WvJQGqbOVbFVUR+dogSya2SEjC2AVvIKPMHf3fAaEmF6OKpgd7NDldlSpfVG7Ubhju/wB8w==
dependencies:
react-date-object "^2.1.5"
react-element-popper "^2.1.6"

react@18.2.0, react@^18.2.0:
version "18.2.0"
resolved "https://registry.npmjs.org/react/-/react-18.2.0.tgz"
@@ -4315,6 +4379,11 @@ semver@^6.3.0:
resolved "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz"
integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==

semver@^6.3.1:
version "6.3.1"
resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4"
integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==

semver@^7.0.0, semver@^7.3.7, semver@^7.3.8:
version "7.5.1"
resolved "https://registry.npmjs.org/semver/-/semver-7.5.1.tgz"