CS_learn/tech-interview-handbook
1
0
Fork 0
mirror of https://github.com/yangshun/tech-interview-handbook.git synced 2026-04-05 11:59:05 +08:00
Code Issues Packages Projects Releases Wiki Activity

[offers][fix] Fix number input scroll issue (#524)

Browse Source
This commit is contained in:
Ai Ling
2022-11-07 16:35:53 +08:00
committed by GitHub
parent 31a166e6e0
commit 5d34a44237
3 changed files with 44 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
apps/portal/src/components/offers/offersSubmission/submissionForm/BackgroundForm.tsx
View File

@@ -9,6 +9,7 @@ import {
Currency,
CURRENCY_OPTIONS,
} from '~/utils/offers/currency/CurrencyEnum';
import { validateNumber } from '~/utils/offers/form';
import { EducationFieldOptions } from '../../EducationFields';
import { EducationLevelOptions } from '../../EducationLevels';
@@ -34,10 +35,11 @@ function YoeSection() {
label="Total YOE"
placeholder="0"
required={true}
type="number"
type="text"
{...register(`background.totalYoe`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
required: FieldError.REQUIRED,
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -48,9 +50,10 @@ function YoeSection() {
<FormTextInput
errorMessage={backgroundFields?.specificYoes?.[0]?.yoe?.message}
label="Specific YOE 1"
type="number"
type="text"
{...register(`background.specificYoes.0.yoe`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -64,9 +67,10 @@ function YoeSection() {
<FormTextInput
errorMessage={backgroundFields?.specificYoes?.[1]?.yoe?.message}
label="Specific YOE 2"
type="number"
type="text"
{...register(`background.specificYoes.1.yoe`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -119,9 +123,10 @@ function FullTimeJobFields() {
placeholder="0.00"
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(`background.experiences.0.totalCompensation.value`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -142,9 +147,10 @@ function FullTimeJobFields() {
<FormTextInput
errorMessage={experiencesField?.durationInMonths?.message}
label="Duration (months)"
type="number"
type="text"
{...register(`background.experiences.0.durationInMonths`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -188,9 +194,10 @@ function InternshipJobFields() {
placeholder="0.00"
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(`background.experiences.0.monthlySalary.value`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -205,9 +212,10 @@ function InternshipJobFields() {
<FormTextInput
errorMessage={experiencesField?.durationInMonths?.message}
label="Duration (months)"
type="number"
type="text"
{...register(`background.experiences.0.durationInMonths`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>

17
apps/portal/src/components/offers/offersSubmission/submissionForm/OfferDetailsForm.tsx
View File

@@ -13,6 +13,8 @@ import { TrashIcon } from '@heroicons/react/24/outline';
import { JobType } from '@prisma/client';
import { Button, Dialog, HorizontalDivider } from '@tih/ui';
import { validateNumber } from '~/utils/offers/form';
import {
defaultFullTimeOfferValues,
defaultInternshipOfferValues,
@@ -156,12 +158,13 @@ function FullTimeOfferDetailsForm({
required={true}
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(
`offers.${index}.offersFullTime.totalCompensation.value`,
{
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
required: FieldError.REQUIRED,
validate: validateNumber,
valueAsNumber: true,
},
)}
@@ -189,9 +192,10 @@ function FullTimeOfferDetailsForm({
placeholder="0"
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(`offers.${index}.offersFullTime.baseSalary.value`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -212,9 +216,10 @@ function FullTimeOfferDetailsForm({
placeholder="0"
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(`offers.${index}.offersFullTime.bonus.value`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -235,9 +240,10 @@ function FullTimeOfferDetailsForm({
placeholder="0"
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(`offers.${index}.offersFullTime.stocks.value`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
validate: validateNumber,
valueAsNumber: true,
})}
/>
@@ -394,10 +400,11 @@ function InternshipOfferDetailsForm({
required={true}
startAddOn="$"
startAddOnType="label"
type="number"
type="text"
{...register(`offers.${index}.offersIntern.monthlySalary.value`, {
min: { message: FieldError.NON_NEGATIVE_NUMBER, value: 0 },
required: FieldError.REQUIRED,
validate: validateNumber,
valueAsNumber: true,
})}
/>

17
apps/portal/src/utils/offers/form.tsx
View File

@@ -1,5 +1,9 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
import type { Validate } from 'react-hook-form';
import { FieldError } from '~/components/offers/constants';
/**
* Removes empty objects, empty strings, `null`, `undefined`, and `NaN` values from an object.
* Does not remove empty arrays.
@@ -85,3 +89,16 @@ export function removeInvalidMoneyData(object: any) {
});
return object;
}
/**
* Validation rule for numbers.
* @param value
* @returns `true` if value is a number, otherwise error message.
*/
export const validateNumber: Validate<number | null | undefined> = (value) => {
// Checks for NaN value, as the value passed in by the form is already converted to number pre-validation.
if (value !== value) {
return FieldError.NUMBER;
}
return true;
};