cal.pub0.org/packages/ui/components/form/inputs/HintOrErrors.tsx

104 lines
3.5 KiB
TypeScript
Raw Normal View History

import type { FieldValues } from "react-hook-form";
import { useFormContext } from "react-hook-form";
import { FiCheck, FiCircle, FiInfo, FiX } from "../../icon";
export function HintsOrErrors<T extends FieldValues = FieldValues>(props: {
hintErrors?: string[];
fieldName: string;
t: (key: string) => string;
}) {
const methods = useFormContext() as ReturnType<typeof useFormContext> | null;
/* If there's no methods it means we're using these components outside a React Hook Form context */
if (!methods) return null;
const { formState } = methods;
const { hintErrors, fieldName, t } = props;
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
const fieldErrors: FieldErrors<T> | undefined = formState.errors[fieldName];
if (!hintErrors && fieldErrors && !fieldErrors.message) {
// no hints passed, field errors exist and they are custom ones
return (
<div className="text-gray mt-2 flex items-center text-sm text-gray-700">
<ul className="ml-2">
{Object.keys(fieldErrors).map((key: string) => {
return (
<li key={key} className="text-blue-700">
{t(`${fieldName}_hint_${key}`)}
</li>
);
})}
</ul>
</div>
);
}
if (hintErrors && fieldErrors) {
// hints passed, field errors exist
return (
<div className="text-gray mt-2 flex items-center text-sm text-gray-700">
<ul className="ml-2">
{hintErrors.map((key: string) => {
const submitted = formState.isSubmitted;
const error = fieldErrors[key] || fieldErrors.message;
return (
<li
key={key}
className={error !== undefined ? (submitted ? "text-red-700" : "") : "text-green-600"}>
{error !== undefined ? (
submitted ? (
<FiX size="12" strokeWidth="3" className="-ml-1 inline-block ltr:mr-2 rtl:ml-2" />
) : (
<FiCircle fill="currentColor" size="5" className="inline-block ltr:mr-2 rtl:ml-2" />
)
) : (
<FiCheck size="12" strokeWidth="3" className="-ml-1 inline-block ltr:mr-2 rtl:ml-2" />
)}
{t(`${fieldName}_hint_${key}`)}
</li>
);
})}
</ul>
</div>
);
}
// errors exist, not custom ones, just show them as is
if (fieldErrors) {
return (
fix: admin password hint text (#6906) * feat: use the trans hook * fix: hide AdminPasswordBanner * fix: translation * fix: style and use validation * fix: layout * fix: use trans keys * fix: replace number with placeholder * feat: add alert banner * fix: use the correct password length * fix: metadata not saved while creating a booking. (#6866) * feat: add metadata to booking creation * fix: bug * Beginning of Strict CSP Compliance (#6841) * Add CSP Support and enable it initially for Login page * Update README * Make sure that CSP is not enabled if CSP_POLICY isnt set * Add a new value for x-csp header that tells if instance has opted-in to CSP or not * Add more src to CSP * Fix typo in header name * Remove duplicate headers fn * Add https://eu.ui-avatars.com/api/ * Add CSP_POLICY to env.example * v2.5.10 * fix: add req.headers (#6921) Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * add-console-vars (#6929) * Admin Wizard Choose License (#6574) * Implementation * i18n * More i18n * extracted i18n, needs api to get most recent price, added hint: update later * Fixing i18n var * Fix booking filters not working for admin (#6576) * fix: react-select overflow issue in some modals. (#6587) * feat: add a disable overflow prop * feat: use the disable overflow prop * Tailwind Merge (#6596) * Tailwind Merge * Fix merge classNames * [CAL-808] /availability/single - UI issue on buttons beside time inputs (#6561) * [CAL-808] /availability/single - UI issue on buttons beside time inputs * Update apps/web/public/static/locales/en/common.json * Update packages/features/schedules/components/Schedule.tsx * create new translation for tooltip Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: CarinaWolli <wollencarina@gmail.com> * Bye bye submodules (#6585) * WIP * Uses ssh instead * Update .gitignore * Update .gitignore * Update Makefile * Update git-setup.sh * Update git-setup.sh * Replaced Makefile with bash script * Update package.json * fix: show button on empty string (#6601) Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * fix: add delete in dropdown (#6599) Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * Update README.md * Update README.md * Changed a neutral- classes to gray (#6603) * Changed a neutral- classes to gray * Changed all border-1 to border * Update package.json * Test fixes * Yarn lock fixes * Fix string equality check in git-setup.sh * [CAL-811] Avatar icon not redirecting user back to the main page (#6586) * Remove cursor-pointer, remove old Avatar* files * Fixed styling for checkedSelect + some cleanup Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com> Co-authored-by: Alex van Andel <me@alexvanandel.com> * Harsh/add member invite (#6598) Co-authored-by: Guest <guest@pop-os.localdomain> Co-authored-by: root <harsh.singh@gocomet.com> * Regenerated lockfile without upgrade (#6610) * fix: remove annoying outline when <Button /> clicked (#6537) * fix: remove annoying outline when <Button /> clicked * Delete yarn.lock * remove 1 on 1 icon (#6609) * removed 1-on-1 badge * changed user to users for group events * fix: case-sensitivity in apps path (#6552) * fix: lowercase slug * fix: make fallback blocking * Fix FAB (#6611) * feat: add LocationSelect component (#6571) * feat: add LocationSelect component Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * fix: type error Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * chore: type error Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * Update booking filters design (#6543) * Update booking filters * Add filter on YOUR bookings * Fix pending members showing up in list * Reduce the avatar size to 'sm' for now * Bugfix/dropdown menu trigger as child remove class names (#6614) * Fix UsernameTextfield to take right height * Remove className side-effect * Incorrect resolution version fixed * Converted mobile DropdownMenuTrigger styles into Button * v2.5.3 * fix: use items-center (#6618) * fix tooltip and modal stacking issues (#6491) * fix tooltip and modal stacking issues * use z-index in larger screens and less Co-authored-by: Alex van Andel <me@alexvanandel.com> * Temporary fix (#6626) * Fix Ga4 tracking (#6630) * generic <UpgradeScreen> component (#6594) * first attempt of <UpgradeScreen> * changes to icons * reverted changes back to initial state, needs fix: teams not showing * WIP * Fix weird reactnode error * Fix loading text * added upgradeTip to routing forms * icon colors * create and use hook to check if user has team plan * use useTeamPlan for upgradeTeamsBadge * replace huge svg with compressed jpeg * responsive fixes * Update packages/ui/components/badge/UpgradeTeamsBadge.tsx Co-authored-by: sean-brydon <55134778+sean-brydon@users.noreply.github.com> * Give team plan features to E2E tests * Allow option to make a user part of team int ests * Remove flash of paywall for team user * Add team user for typeform tests as well Co-authored-by: Peer Richelsen <peer@cal.com> Co-authored-by: CarinaWolli <wollencarina@gmail.com> Co-authored-by: Carina Wollendorfer <30310907+CarinaWolli@users.noreply.github.com> Co-authored-by: Alex van Andel <me@alexvanandel.com> Co-authored-by: Hariom Balhara <hariombalhara@gmail.com> * Removing env var to rely on db * Restoring i18n keys, set loading moved * Fixing tailwind-preset glob * Wizard width fix for md+ screens * Converting licenses options to radix radio * Applying feedback + other tweaks * Reverting this, not this PR related * Unneeded code removal * Reverting unneeded style change * Applying feedback * Removing licenseType * Upgrades typescript * Update yarn lock * Typings * Hotfix: ping,riverside,whereby and around not showing up in list (#6712) * Hotfix: ping,riverside,whereby and around not showing up in list (#6712) (#6713) * Adds deployment settings to DB (#6706) * WIP * Adds DeploymentTheme * Add missing migrations * Adds client extensions for deployment * Cleanup * Delete migration.sql * Relying on both, env var and new model * Restoring env example doc for backward compat * Maximum call stack size exceeded fix? * Revert upgrade * Update index.ts * Delete index.ts * Not exposing license key, fixed radio behavior * Covering undefined env var * Self contained checkLicense * Feedback * Moar feedback * Feedback * Feedback * Feedback * Cleanup --------- Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Co-authored-by: Peer Richelsen <peer@cal.com> Co-authored-by: sean-brydon <55134778+sean-brydon@users.noreply.github.com> Co-authored-by: Nafees Nazik <84864519+G3root@users.noreply.github.com> Co-authored-by: GitStart-Cal.com <121884634+gitstart-calcom@users.noreply.github.com> Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: CarinaWolli <wollencarina@gmail.com> Co-authored-by: Omar López <zomars@me.com> Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com> Co-authored-by: Alex van Andel <me@alexvanandel.com> Co-authored-by: Harsh Singh <51085015+harshsinghatz@users.noreply.github.com> Co-authored-by: Guest <guest@pop-os.localdomain> Co-authored-by: root <harsh.singh@gocomet.com> Co-authored-by: Luis Cadillo <luiscaf3r@gmail.com> Co-authored-by: Mohammed Cherfaoui <hi@cherfaoui.dev> Co-authored-by: Hariom Balhara <hariombalhara@gmail.com> Co-authored-by: Carina Wollendorfer <30310907+CarinaWolli@users.noreply.github.com> * added two new tips (#6915) * [CAL-488] Timezone selection has a weird double dropdown (#6851) Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com> * fix: color and line height of icon (#6913) * fix: use destination calendar email (#6886) * fix: use destination calendar email to display correct primary email Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * fix: simplify logic Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> --------- Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * fix: dropdown title in bookings page (#6924) * fixes the broken max size of members on teams page (#6926) * fix: display provider name instead of url (#6914) Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * fix: add sortByLabel (#6797) Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * Email Variables Bug (#6943) * Remove _subject translations for zh-CN, needs retranslation * minor timezone-select improvements (#6944) * fixed timezone select positioning and hover * fixed timezone select positioning and hover * Give trackingId a default value because if user doesnt interact with trackingId input it is not set (#6945) * Block /auth/:path, nothing else. (#6949) * Block /auth/:path, nothing else. * Also add /signup * fix start icon in button (#6950) Co-authored-by: CarinaWolli <wollencarina@gmail.com> * Fixes localisation of {EVENT_DATE} in workflows (#6907) * translate {EVENT_DATE} variable to correct language * fix locale for cron schedule reminder emails/sms * fix type error * add missing locale to attendees * fix type error * code clean up * revert last commit * using Intl for date translations --------- Co-authored-by: CarinaWolli <wollencarina@gmail.com> * Allow account linking for Google and SAML providers (#6874) * allow account linking for self-hosted instances, both Google and SAML are verified emails * allow account linking for Google and SSO if emails match with existing username/password account * Tweaked find user by email since we now have multiple providers (other than credentials provider) * feat/payment-service-6438-cal-767 (#6677) * WIP paymentService * Changes for payment Service * Fix for stripe payment flow * Remove logs/comments * Refactored refund for stripe app * Move stripe handlePayment to own lib * Move stripe delete payments to paymentService * lint fix * Change handleRefundError as generic function * remove log * remove logs * remove logs * Return stripe default export to lib/server * Fixing types * Fix types * Upgrades typescript * Update yarn lock * Typings * Hotfix: ping,riverside,whereby and around not showing up in list (#6712) * Hotfix: ping,riverside,whereby and around not showing up in list (#6712) (#6713) * Adds deployment settings to DB (#6706) * WIP * Adds DeploymentTheme * Add missing migrations * Adds client extensions for deployment * Cleanup * Revert "lint fix" This reverts commit e1a2e4a357e58e6673c47399888ae2e00d1351a6. * Add validation * Revert changes removed in force push * Removing abstract class and just leaving interface implementation * Fix types for handlePayments * Fix payment test appStore import * Fix stripe metadata in event type * Move migration to separate PR * Revert "Move migration to separate PR" This reverts commit 48aa64e0724a522d3cc2fefaaaee5792ee9cd9e6. * Update packages/prisma/migrations/20230125175109_remove_type_from_payment_and_add_app_relationship/migration.sql Co-authored-by: Omar López <zomars@me.com> --------- Co-authored-by: zomars <zomars@me.com> Co-authored-by: Hariom Balhara <hariombalhara@gmail.com> * Small UI fixes for seats & destination calendars (#6859) * Do not add former time for events on seats * Default display destination calendar * Add seats badge to event type item * Add string * Actively watch seats enabled option for requires confirmation * Only show former time when there is a rescheduleUid * fix: use typedquery hook in duplicate dialog (#6730) * fix: use typedquery hook in duplicate dialog Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * Update packages/features/eventtypes/components/DuplicateDialog.tsx --------- Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Co-authored-by: Peer Richelsen <peer@cal.com> Co-authored-by: Omar López <zomars@me.com> * Fixing admin wizard step done (#6954) * Feature/maintenance mode (#6930) * Implement maintenance mode with Vercel Edge Config * Error log is spam during development/ added \n in .env.example * Exclude _next, /api for /maintenance page * Re-instate previous config * rtl: begone * Added note to explain why /auth/login covers the maintenance page. --------- Co-authored-by: Omar López <zomars@me.com> * Update package.json * I18N Caching (#6823) * Caching Logic Changes Enabled this function to change its cache value based on incoming paths value * Invalidate I18N Cache Invalidating the I18N cache when a user saves changes to their General settings * Removes deprecated useLocale location * Overriding the default getSchedule cache to have a revalidation time of 1 second * Update apps/web/pages/api/trpc/[trpc].ts * Updated cache values to match the comment --------- Co-authored-by: zomars <zomars@me.com> --------- Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Co-authored-by: Hariom Balhara <hariombalhara@gmail.com> Co-authored-by: Omar López <zomars@me.com> Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com> Co-authored-by: alannnc <alannnc@gmail.com> Co-authored-by: Leo Giovanetti <hello@leog.me> Co-authored-by: Peer Richelsen <peer@cal.com> Co-authored-by: sean-brydon <55134778+sean-brydon@users.noreply.github.com> Co-authored-by: GitStart-Cal.com <121884634+gitstart-calcom@users.noreply.github.com> Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: CarinaWolli <wollencarina@gmail.com> Co-authored-by: Alex van Andel <me@alexvanandel.com> Co-authored-by: Harsh Singh <51085015+harshsinghatz@users.noreply.github.com> Co-authored-by: Guest <guest@pop-os.localdomain> Co-authored-by: root <harsh.singh@gocomet.com> Co-authored-by: Luis Cadillo <luiscaf3r@gmail.com> Co-authored-by: Mohammed Cherfaoui <hi@cherfaoui.dev> Co-authored-by: Carina Wollendorfer <30310907+CarinaWolli@users.noreply.github.com> Co-authored-by: Joe Shajan <joeshajan1551@gmail.com> Co-authored-by: Ben Hybert <53020786+Hybes@users.noreply.github.com> Co-authored-by: Deepak Prabhakara <deepak@boxyhq.com> Co-authored-by: Joe Au-Yeung <65426560+joeauyeung@users.noreply.github.com> Co-authored-by: Aaron Presley <155617+AaronPresley@users.noreply.github.com>
2023-02-09 02:02:17 +00:00
<div className="text-gray mt-2 flex items-center gap-x-2 text-sm text-red-700">
<div>
<FiInfo className="h-3 w-3" />
</div>
<p>{fieldErrors.message}</p>
</div>
);
}
if (!hintErrors) return null;
// hints passed, no errors exist, proceed to just show hints
return (
<div className="text-gray mt-2 flex items-center text-sm text-gray-700">
<ul className="ml-2">
{hintErrors.map((key: string) => {
// if field was changed, as no error exist, show checked status and color
const dirty = formState.dirtyFields[fieldName];
return (
<li key={key} className={!!dirty ? "text-green-600" : ""}>
{!!dirty ? (
<FiCheck size="12" strokeWidth="3" className="-ml-1 inline-block ltr:mr-2 rtl:ml-2" />
) : (
<FiCircle fill="currentColor" size="5" className="inline-block ltr:mr-2 rtl:ml-2" />
)}
{t(`${fieldName}_hint_${key}`)}
</li>
);
})}
</ul>
</div>
);
}