\n {renderedMatches}\n \n );\n }\n\n return renderedMatches;\n}\n\nfunction DefaultErrorComponent() {\n let error = useRouteError();\n let message = isRouteErrorResponse(error)\n ? `${error.status} ${error.statusText}`\n : error instanceof Error\n ? error.message\n : JSON.stringify(error);\n let stack = error instanceof Error ? error.stack : null;\n let lightgrey = \"rgba(200,200,200, 0.5)\";\n let preStyles = { padding: \"0.5rem\", backgroundColor: lightgrey };\n let codeStyles = { padding: \"2px 4px\", backgroundColor: lightgrey };\n\n let devInfo = null;\n if (__DEV__) {\n console.error(\n \"Error handled by React Router default ErrorBoundary:\",\n error\n );\n\n devInfo = (\n <>\n 💿 Hey developer 👋
\n \n You can provide a way better UX than this when your app throws errors\n by providing your own ErrorBoundary or{\" \"}\n errorElement prop on your route.\n
\n \n );\n }\n\n return (\n <>\n Unexpected Application Error!
\n {message}
\n {stack ? {stack} : null}\n {devInfo}\n \n );\n}\n\nconst defaultErrorElement = ;\n\ntype RenderErrorBoundaryProps = React.PropsWithChildren<{\n location: Location;\n revalidation: RevalidationState;\n error: any;\n component: React.ReactNode;\n routeContext: RouteContextObject;\n}>;\n\ntype RenderErrorBoundaryState = {\n location: Location;\n revalidation: RevalidationState;\n error: any;\n};\n\nexport class RenderErrorBoundary extends React.Component<\n RenderErrorBoundaryProps,\n RenderErrorBoundaryState\n> {\n constructor(props: RenderErrorBoundaryProps) {\n super(props);\n this.state = {\n location: props.location,\n revalidation: props.revalidation,\n error: props.error,\n };\n }\n\n static getDerivedStateFromError(error: any) {\n return { error: error };\n }\n\n static getDerivedStateFromProps(\n props: RenderErrorBoundaryProps,\n state: RenderErrorBoundaryState\n ) {\n // When we get into an error state, the user will likely click \"back\" to the\n // previous page that didn't have an error. Because this wraps the entire\n // application, that will have no effect--the error page continues to display.\n // This gives us a mechanism to recover from the error when the location changes.\n //\n // Whether we're in an error state or not, we update the location in state\n // so that when we are in an error state, it gets reset when a new location\n // comes in and the user recovers from the error.\n if (\n state.location !== props.location ||\n (state.revalidation !== \"idle\" && props.revalidation === \"idle\")\n ) {\n return {\n error: props.error,\n location: props.location,\n revalidation: props.revalidation,\n };\n }\n\n // If we're not changing locations, preserve the location but still surface\n // any new errors that may come through. We retain the existing error, we do\n // this because the error provided from the app state may be cleared without\n // the location changing.\n return {\n error: props.error !== undefined ? props.error : state.error,\n location: state.location,\n revalidation: props.revalidation || state.revalidation,\n };\n }\n\n componentDidCatch(error: any, errorInfo: any) {\n console.error(\n \"React Router caught the following error during render\",\n error,\n errorInfo\n );\n }\n\n render() {\n return this.state.error !== undefined ? (\n \n \n \n ) : (\n this.props.children\n );\n }\n}\n\ninterface RenderedRouteProps {\n routeContext: RouteContextObject;\n match: RouteMatch;\n children: React.ReactNode | null;\n}\n\nfunction RenderedRoute({ routeContext, match, children }: RenderedRouteProps) {\n let dataRouterContext = React.useContext(DataRouterContext);\n\n // Track how deep we got in our render pass to emulate SSR componentDidCatch\n // in a DataStaticRouter\n if (\n dataRouterContext &&\n dataRouterContext.static &&\n dataRouterContext.staticContext &&\n (match.route.errorElement || match.route.ErrorBoundary)\n ) {\n dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id;\n }\n\n return (\n \n {children}\n \n );\n}\n\nexport function _renderMatches(\n matches: RouteMatch[] | null,\n parentMatches: RouteMatch[] = [],\n dataRouterState: RemixRouter[\"state\"] | null = null,\n future: RemixRouter[\"future\"] | null = null\n): React.ReactElement | null {\n if (matches == null) {\n if (dataRouterState?.errors) {\n // Don't bail if we have data router errors so we can render them in the\n // boundary. Use the pre-matched (or shimmed) matches\n matches = dataRouterState.matches as DataRouteMatch[];\n } else {\n return null;\n }\n }\n\n let renderedMatches = matches;\n\n // If we have data errors, trim matches to the highest error boundary\n let errors = dataRouterState?.errors;\n if (errors != null) {\n let errorIndex = renderedMatches.findIndex(\n (m) => m.route.id && errors?.[m.route.id] !== undefined\n );\n invariant(\n errorIndex >= 0,\n `Could not find a matching route for errors on route IDs: ${Object.keys(\n errors\n ).join(\",\")}`\n );\n renderedMatches = renderedMatches.slice(\n 0,\n Math.min(renderedMatches.length, errorIndex + 1)\n );\n }\n\n // If we're in a partial hydration mode, detect if we need to render down to\n // a given HydrateFallback while we load the rest of the hydration data\n let renderFallback = false;\n let fallbackIndex = -1;\n if (dataRouterState && future && future.v7_partialHydration) {\n for (let i = 0; i < renderedMatches.length; i++) {\n let match = renderedMatches[i];\n // Track the deepest fallback up until the first route without data\n if (match.route.HydrateFallback || match.route.hydrateFallbackElement) {\n fallbackIndex = i;\n }\n\n if (match.route.id) {\n let { loaderData, errors } = dataRouterState;\n let needsToRunLoader =\n match.route.loader &&\n loaderData[match.route.id] === undefined &&\n (!errors || errors[match.route.id] === undefined);\n if (match.route.lazy || needsToRunLoader) {\n // We found the first route that's not ready to render (waiting on\n // lazy, or has a loader that hasn't run yet). Flag that we need to\n // render a fallback and render up until the appropriate fallback\n renderFallback = true;\n if (fallbackIndex >= 0) {\n renderedMatches = renderedMatches.slice(0, fallbackIndex + 1);\n } else {\n renderedMatches = [renderedMatches[0]];\n }\n break;\n }\n }\n }\n }\n\n return renderedMatches.reduceRight((outlet, match, index) => {\n // Only data routers handle errors/fallbacks\n let error: any;\n let shouldRenderHydrateFallback = false;\n let errorElement: React.ReactNode | null = null;\n let hydrateFallbackElement: React.ReactNode | null = null;\n if (dataRouterState) {\n error = errors && match.route.id ? errors[match.route.id] : undefined;\n errorElement = match.route.errorElement || defaultErrorElement;\n\n if (renderFallback) {\n if (fallbackIndex < 0 && index === 0) {\n warningOnce(\n \"route-fallback\",\n false,\n \"No `HydrateFallback` element provided to render during initial hydration\"\n );\n shouldRenderHydrateFallback = true;\n hydrateFallbackElement = null;\n } else if (fallbackIndex === index) {\n shouldRenderHydrateFallback = true;\n hydrateFallbackElement = match.route.hydrateFallbackElement || null;\n }\n }\n }\n\n let matches = parentMatches.concat(renderedMatches.slice(0, index + 1));\n let getChildren = () => {\n let children: React.ReactNode;\n if (error) {\n children = errorElement;\n } else if (shouldRenderHydrateFallback) {\n children = hydrateFallbackElement;\n } else if (match.route.Component) {\n // Note: This is a de-optimized path since React won't re-use the\n // ReactElement since it's identity changes with each new\n // React.createElement call. We keep this so folks can use\n // `` in `` but generally `Component`\n // usage is only advised in `RouterProvider` when we can convert it to\n // `element` ahead of time.\n children = ;\n } else if (match.route.element) {\n children = match.route.element;\n } else {\n children = outlet;\n }\n return (\n \n );\n };\n // Only wrap in an error boundary within data router usages when we have an\n // ErrorBoundary/errorElement on this route. Otherwise let it bubble up to\n // an ancestor ErrorBoundary/errorElement\n return dataRouterState &&\n (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? (\n \n ) : (\n getChildren()\n );\n }, null as React.ReactElement | null);\n}\n\nenum DataRouterHook {\n UseBlocker = \"useBlocker\",\n UseRevalidator = \"useRevalidator\",\n UseNavigateStable = \"useNavigate\",\n}\n\nenum DataRouterStateHook {\n UseBlocker = \"useBlocker\",\n UseLoaderData = \"useLoaderData\",\n UseActionData = \"useActionData\",\n UseRouteError = \"useRouteError\",\n UseNavigation = \"useNavigation\",\n UseRouteLoaderData = \"useRouteLoaderData\",\n UseMatches = \"useMatches\",\n UseRevalidator = \"useRevalidator\",\n UseNavigateStable = \"useNavigate\",\n UseRouteId = \"useRouteId\",\n}\n\nfunction getDataRouterConsoleError(\n hookName: DataRouterHook | DataRouterStateHook\n) {\n return `${hookName} must be used within a data router. See https://reactrouter.com/routers/picking-a-router.`;\n}\n\nfunction useDataRouterContext(hookName: DataRouterHook) {\n let ctx = React.useContext(DataRouterContext);\n invariant(ctx, getDataRouterConsoleError(hookName));\n return ctx;\n}\n\nfunction useDataRouterState(hookName: DataRouterStateHook) {\n let state = React.useContext(DataRouterStateContext);\n invariant(state, getDataRouterConsoleError(hookName));\n return state;\n}\n\nfunction useRouteContext(hookName: DataRouterStateHook) {\n let route = React.useContext(RouteContext);\n invariant(route, getDataRouterConsoleError(hookName));\n return route;\n}\n\n// Internal version with hookName-aware debugging\nfunction useCurrentRouteId(hookName: DataRouterStateHook) {\n let route = useRouteContext(hookName);\n let thisRoute = route.matches[route.matches.length - 1];\n invariant(\n thisRoute.route.id,\n `${hookName} can only be used on routes that contain a unique \"id\"`\n );\n return thisRoute.route.id;\n}\n\n/**\n * Returns the ID for the nearest contextual route\n */\nexport function useRouteId() {\n return useCurrentRouteId(DataRouterStateHook.UseRouteId);\n}\n\n/**\n * Returns the current navigation, defaulting to an \"idle\" navigation when\n * no navigation is in progress\n */\nexport function useNavigation() {\n let state = useDataRouterState(DataRouterStateHook.UseNavigation);\n return state.navigation;\n}\n\n/**\n * Returns a revalidate function for manually triggering revalidation, as well\n * as the current state of any manual revalidations\n */\nexport function useRevalidator() {\n let dataRouterContext = useDataRouterContext(DataRouterHook.UseRevalidator);\n let state = useDataRouterState(DataRouterStateHook.UseRevalidator);\n return React.useMemo(\n () => ({\n revalidate: dataRouterContext.router.revalidate,\n state: state.revalidation,\n }),\n [dataRouterContext.router.revalidate, state.revalidation]\n );\n}\n\n/**\n * Returns the active route matches, useful for accessing loaderData for\n * parent/child routes or the route \"handle\" property\n */\nexport function useMatches(): UIMatch[] {\n let { matches, loaderData } = useDataRouterState(\n DataRouterStateHook.UseMatches\n );\n return React.useMemo(\n () => matches.map((m) => convertRouteMatchToUiMatch(m, loaderData)),\n [matches, loaderData]\n );\n}\n\n/**\n * Returns the loader data for the nearest ancestor Route loader\n */\nexport function useLoaderData(): unknown {\n let state = useDataRouterState(DataRouterStateHook.UseLoaderData);\n let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);\n\n if (state.errors && state.errors[routeId] != null) {\n console.error(\n `You cannot \\`useLoaderData\\` in an errorElement (routeId: ${routeId})`\n );\n return undefined;\n }\n return state.loaderData[routeId];\n}\n\n/**\n * Returns the loaderData for the given routeId\n */\nexport function useRouteLoaderData(routeId: string): unknown {\n let state = useDataRouterState(DataRouterStateHook.UseRouteLoaderData);\n return state.loaderData[routeId];\n}\n\n/**\n * Returns the action data for the nearest ancestor Route action\n */\nexport function useActionData(): unknown {\n let state = useDataRouterState(DataRouterStateHook.UseActionData);\n let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);\n return state.actionData ? state.actionData[routeId] : undefined;\n}\n\n/**\n * Returns the nearest ancestor Route error, which could be a loader/action\n * error or a render error. This is intended to be called from your\n * ErrorBoundary/errorElement to display a proper error message.\n */\nexport function useRouteError(): unknown {\n let error = React.useContext(RouteErrorContext);\n let state = useDataRouterState(DataRouterStateHook.UseRouteError);\n let routeId = useCurrentRouteId(DataRouterStateHook.UseRouteError);\n\n // If this was a render error, we put it in a RouteError context inside\n // of RenderErrorBoundary\n if (error !== undefined) {\n return error;\n }\n\n // Otherwise look for errors from our data router state\n return state.errors?.[routeId];\n}\n\n/**\n * Returns the happy-path data from the nearest ancestor `` value\n */\nexport function useAsyncValue(): unknown {\n let value = React.useContext(AwaitContext);\n return value?._data;\n}\n\n/**\n * Returns the error from the nearest ancestor `` value\n */\nexport function useAsyncError(): unknown {\n let value = React.useContext(AwaitContext);\n return value?._error;\n}\n\nlet blockerId = 0;\n\n/**\n * Allow the application to block navigations within the SPA and present the\n * user a confirmation dialog to confirm the navigation. Mostly used to avoid\n * using half-filled form data. This does not handle hard-reloads or\n * cross-origin navigations.\n */\nexport function useBlocker(shouldBlock: boolean | BlockerFunction): Blocker {\n let { router, basename } = useDataRouterContext(DataRouterHook.UseBlocker);\n let state = useDataRouterState(DataRouterStateHook.UseBlocker);\n\n let [blockerKey, setBlockerKey] = React.useState(\"\");\n let blockerFunction = React.useCallback(\n (arg) => {\n if (typeof shouldBlock !== \"function\") {\n return !!shouldBlock;\n }\n if (basename === \"/\") {\n return shouldBlock(arg);\n }\n\n // If they provided us a function and we've got an active basename, strip\n // it from the locations we expose to the user to match the behavior of\n // useLocation\n let { currentLocation, nextLocation, historyAction } = arg;\n return shouldBlock({\n currentLocation: {\n ...currentLocation,\n pathname:\n stripBasename(currentLocation.pathname, basename) ||\n currentLocation.pathname,\n },\n nextLocation: {\n ...nextLocation,\n pathname:\n stripBasename(nextLocation.pathname, basename) ||\n nextLocation.pathname,\n },\n historyAction,\n });\n },\n [basename, shouldBlock]\n );\n\n // This effect is in charge of blocker key assignment and deletion (which is\n // tightly coupled to the key)\n React.useEffect(() => {\n let key = String(++blockerId);\n setBlockerKey(key);\n return () => router.deleteBlocker(key);\n }, [router]);\n\n // This effect handles assigning the blockerFunction. This is to handle\n // unstable blocker function identities, and happens only after the prior\n // effect so we don't get an orphaned blockerFunction in the router with a\n // key of \"\". Until then we just have the IDLE_BLOCKER.\n React.useEffect(() => {\n if (blockerKey !== \"\") {\n router.getBlocker(blockerKey, blockerFunction);\n }\n }, [router, blockerKey, blockerFunction]);\n\n // Prefer the blocker from `state` not `router.state` since DataRouterContext\n // is memoized so this ensures we update on blocker state updates\n return blockerKey && state.blockers.has(blockerKey)\n ? state.blockers.get(blockerKey)!\n : IDLE_BLOCKER;\n}\n\n/**\n * Stable version of useNavigate that is used when we are in the context of\n * a RouterProvider.\n */\nfunction useNavigateStable(): NavigateFunction {\n let { router } = useDataRouterContext(DataRouterHook.UseNavigateStable);\n let id = useCurrentRouteId(DataRouterStateHook.UseNavigateStable);\n\n let activeRef = React.useRef(false);\n useIsomorphicLayoutEffect(() => {\n activeRef.current = true;\n });\n\n let navigate: NavigateFunction = React.useCallback(\n (to: To | number, options: NavigateOptions = {}) => {\n warning(activeRef.current, navigateEffectWarning);\n\n // Short circuit here since if this happens on first render the navigate\n // is useless because we haven't wired up our router subscriber yet\n if (!activeRef.current) return;\n\n if (typeof to === \"number\") {\n router.navigate(to);\n } else {\n router.navigate(to, { fromRouteId: id, ...options });\n }\n },\n [router, id]\n );\n\n return navigate;\n}\n\nconst alreadyWarned: Record = {};\n\nfunction warningOnce(key: string, cond: boolean, message: string) {\n if (!cond && !alreadyWarned[key]) {\n alreadyWarned[key] = true;\n warning(false, message);\n }\n}\n","import type {\n InitialEntry,\n LazyRouteFunction,\n Location,\n MemoryHistory,\n RelativeRoutingType,\n Router as RemixRouter,\n RouterState,\n RouterSubscriber,\n To,\n TrackedPromise,\n} from \"@remix-run/router\";\nimport {\n AbortedDeferredError,\n Action as NavigationType,\n createMemoryHistory,\n UNSAFE_getResolveToMatches as getResolveToMatches,\n UNSAFE_invariant as invariant,\n parsePath,\n resolveTo,\n stripBasename,\n UNSAFE_warning as warning,\n} from \"@remix-run/router\";\nimport * as React from \"react\";\n\nimport type {\n DataRouteObject,\n IndexRouteObject,\n Navigator,\n NonIndexRouteObject,\n RouteMatch,\n RouteObject,\n} from \"./context\";\nimport {\n AwaitContext,\n DataRouterContext,\n DataRouterStateContext,\n LocationContext,\n NavigationContext,\n RouteContext,\n} from \"./context\";\nimport {\n _renderMatches,\n useAsyncValue,\n useInRouterContext,\n useLocation,\n useNavigate,\n useOutlet,\n useRoutes,\n useRoutesImpl,\n} from \"./hooks\";\n\nexport interface FutureConfig {\n v7_relativeSplatPath: boolean;\n v7_startTransition: boolean;\n}\n\nexport interface RouterProviderProps {\n fallbackElement?: React.ReactNode;\n router: RemixRouter;\n // Only accept future flags relevant to rendering behavior\n // routing flags should be accessed via router.future\n future?: Partial>;\n}\n\n/**\n Webpack + React 17 fails to compile on any of the following because webpack\n complains that `startTransition` doesn't exist in `React`:\n * import { startTransition } from \"react\"\n * import * as React from from \"react\";\n \"startTransition\" in React ? React.startTransition(() => setState()) : setState()\n * import * as React from from \"react\";\n \"startTransition\" in React ? React[\"startTransition\"](() => setState()) : setState()\n\n Moving it to a constant such as the following solves the Webpack/React 17 issue:\n * import * as React from from \"react\";\n const START_TRANSITION = \"startTransition\";\n START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()\n\n However, that introduces webpack/terser minification issues in production builds\n in React 18 where minification/obfuscation ends up removing the call of\n React.startTransition entirely from the first half of the ternary. Grabbing\n this exported reference once up front resolves that issue.\n\n See https://github.com/remix-run/react-router/issues/10579\n*/\nconst START_TRANSITION = \"startTransition\";\nconst startTransitionImpl = React[START_TRANSITION];\n\n/**\n * Given a Remix Router instance, render the appropriate UI\n */\nexport function RouterProvider({\n fallbackElement,\n router,\n future,\n}: RouterProviderProps): React.ReactElement {\n let [state, setStateImpl] = React.useState(router.state);\n let { v7_startTransition } = future || {};\n\n let setState = React.useCallback(\n (newState: RouterState) => {\n if (v7_startTransition && startTransitionImpl) {\n startTransitionImpl(() => setStateImpl(newState));\n } else {\n setStateImpl(newState);\n }\n },\n [setStateImpl, v7_startTransition]\n );\n\n // Need to use a layout effect here so we are subscribed early enough to\n // pick up on any render-driven redirects/navigations (useEffect/)\n React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);\n\n React.useEffect(() => {\n warning(\n fallbackElement == null || !router.future.v7_partialHydration,\n \"`` is deprecated when using \" +\n \"`v7_partialHydration`, use a `HydrateFallback` component instead\"\n );\n // Only log this once on initial mount\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n let navigator = React.useMemo((): Navigator => {\n return {\n createHref: router.createHref,\n encodeLocation: router.encodeLocation,\n go: (n) => router.navigate(n),\n push: (to, state, opts) =>\n router.navigate(to, {\n state,\n preventScrollReset: opts?.preventScrollReset,\n }),\n replace: (to, state, opts) =>\n router.navigate(to, {\n replace: true,\n state,\n preventScrollReset: opts?.preventScrollReset,\n }),\n };\n }, [router]);\n\n let basename = router.basename || \"/\";\n\n let dataRouterContext = React.useMemo(\n () => ({\n router,\n navigator,\n static: false,\n basename,\n }),\n [router, navigator, basename]\n );\n\n // The fragment and {null} here are important! We need them to keep React 18's\n // useId happy when we are server-rendering since we may have a \n \n );\n};\n\nexport default LinkedInFollow;\n","import {\n Alert,\n Button,\n Card,\n Checkbox,\n Col,\n Divider,\n Form,\n Input,\n message,\n Modal,\n Radio,\n Row,\n Select,\n Spin,\n} from \"antd\";\nimport React, { useEffect, useState } from \"react\";\nimport { createOrderApi, resumeUploadApi, resumeUploadJdApi } from \"../../Api\";\nimport correct from \"../../assets/lotties/correct.json\";\nimport Lottie from \"lottie-react\";\nimport { CopyOutlined, LoadingOutlined } from \"@ant-design/icons\";\nimport ReCAPTCHA from \"react-google-recaptcha\";\nimport TextArea from \"antd/es/input/TextArea\";\nimport { CloudUpload, MoveLeft, MoveRight } from \"lucide-react\";\nimport RazorpayCheckout from \"./RazorpayCheckout\";\nimport PaymentOrderModal from \"./PaymentOrderModal\";\nimport LinkedInFollow from \"../LinkedInFollow\";\n\nfunction ResumeUploadModal({\n isModalVisible,\n handleCancel,\n jobId,\n broadcastdata,\n jobData,\n}) {\n var FormData = require(\"form-data\");\n var formData = new FormData();\n const MAX_FILE_SIZE = 10 * 1024 * 1024;\n const [reChapthaDisable, setReChapthaDisable] = useState(true);\n const [verified, setVerified] = useState(false);\n const [loading, setLoading] = useState(false);\n\n const [currentStep, setCurrentStep] = useState(1);\n\n const [verifiedText, setVerifiedText] = useState(\n \"Resume uploaded successfully\"\n );\n const [resumeFile, setFileResume] = useState();\n const [answers, setAnswers] = useState(() => {\n // Retrieve answers from storage\n const savedAnswers = localStorage.getItem(\"resumeUploadAnswers\");\n return savedAnswers ? JSON.parse(savedAnswers) : [];\n });\n const [inputData, setInputData] = useState(() => {\n // Retrieve saved data from storage (if available)\n const savedData = localStorage.getItem(\"resumeUploadInputData\");\n return savedData\n ? JSON.parse(savedData)\n : {\n firstName: \"\",\n lastName: \"\",\n phoneNo: null,\n email: \"\",\n msg: \"\",\n };\n });\n\n const [errorHandle, setErrorHandle] = useState({\n errorFirstName: \"\",\n errorLastName: \"\",\n errorPhoneNo: \"\",\n errorEmail: \"\",\n errorFile: \"\",\n });\n const [selectedPayment, setSelectedPayment] = useState(null);\n const [razorpayModal, setRazorpayModal] = useState(false);\n const [orderModal, setOrderModal] = useState(false);\n const [selectedData, setSelectedData] = useState(null);\n const [orderData, setOrderData] = useState(null);\n const [paymentSuccess, setPaymentSuccess] = useState(null);\n\n const handlePaymentChange = (e) => {\n setSelectedPayment(e.target.value);\n };\n\n const handlePaymentSubmit = () => {\n // console.log(selectedData, selectedData?.paymentCriteriaIdentifier);\n\n if (\n jobData?.jobApplicationPaymentInfo?.paymentGatewayProviderName ===\n \"RAZORPAY\"\n ) {\n setLoading(true);\n const options = {\n method: \"POST\",\n headers: {\n reCaptcha: \"string\",\n },\n // body: formData,\n };\n\n let url = `${createOrderApi}?jdIdentifier=${jobId}&paymentCriteriaIdentifier=${selectedData?.paymentIdentifier}`;\n\n fetch(url, options)\n .then((response) => response.json())\n .then((data) => {\n if (data.resultStatusInfo.resultCode.toLowerCase() === \"success\") {\n setOrderData(data.data);\n setRazorpayModal(true);\n } else {\n setOrderModal(data.resultStatusInfo.message);\n }\n setLoading(false);\n })\n .catch((error) => {\n setLoading(false);\n setOrderModal(error.message);\n console.error(\"Failed to create order id:\", error);\n });\n } else {\n setOrderModal(\"Unsupported payment gateway!!\");\n console.warn(\"Unsupported payment gateway!!\");\n }\n };\n\n useEffect(() => {\n // Save input data and answers to localStorage whenever they change\n localStorage.setItem(\"resumeUploadInputData\", JSON.stringify(inputData));\n localStorage.setItem(\"resumeUploadAnswers\", JSON.stringify(answers));\n }, [inputData, answers]);\n useEffect(() => {\n const savedFileData = localStorage.getItem(\"resumeFileData\");\n\n if (savedFileData) {\n const parsedFileData = JSON.parse(savedFileData);\n setFileResume(parsedFileData); // Set the saved file data directly to state\n }\n }, []);\n\n const handleNext = () => {\n const body = {};\n let validationErrors = false;\n\n body[\"firstName\"] = inputData.firstName;\n body[\"lastName\"] = inputData.lastName;\n body[\"mobileNumber\"] = inputData.phoneNo;\n body[\"emailId\"] = inputData.email;\n body[\"resumeFile\"] = resumeFile;\n if (jobId) {\n for (\n let index = 0;\n index < broadcastdata?.openPoolQuestions?.length;\n index++\n ) {\n const item = broadcastdata.openPoolQuestions[index];\n const answerObj = answers.find(\n (ans) => ans.openPoolQuestionId === item.openPoolQuestionId\n );\n\n if (item.mandatory && (!answerObj || !answerObj.answer)) {\n validationErrors = true;\n alert(\"Please attempt all the mandatory questions.\");\n return; // Exit the loop and prevent further processing\n }\n }\n body[\"openPoolAnswers\"] = answers;\n\n body[\"jdIdentifier\"] = jobId;\n broadcastdata?.openPoolQuestions?.forEach((questions) => {\n const existingAnswer = body[\"openPoolAnswers\"].find(\n (answers) =>\n answers.openPoolQuestionId === questions.openPoolQuestionId\n );\n\n if (!existingAnswer) {\n body[\"openPoolAnswers\"].push({\n openPoolQuestionId: questions.openPoolQuestionId,\n question: questions.question,\n questionType: questions.questionType,\n answer: \"\",\n isMandatory: questions.mandatory,\n });\n }\n });\n }\n\n if (inputData.firstName === \"\" || inputData.firstName === null) {\n setErrorHandle({\n ...errorHandle,\n errorFirstName: \"Please provide first name!\",\n });\n return;\n } else if (inputData.phoneNo === \"\" || inputData.phoneNo === null) {\n setErrorHandle({\n ...errorHandle,\n errorPhoneNo: \"Please provide phone number!\",\n });\n return;\n } else if (inputData.email == \"\" || inputData.phoneNo == null) {\n setErrorHandle({\n ...errorHandle,\n errorEmail: \"Please provide email address!\",\n });\n return;\n } else if (!validateEmail(inputData.email)) {\n setErrorHandle({\n ...errorHandle,\n errorEmail: \"Invalid email format!\",\n });\n return;\n } else if (resumeFile === null || resumeFile === undefined) {\n setErrorHandle({\n ...errorHandle,\n errorFile: \"Please upload File!\",\n });\n return;\n } else if (validationErrors) {\n return;\n }\n setCurrentStep((prev) => prev + 1);\n };\n\n const handlePrevious = () => {\n setCurrentStep((prev) => prev - 1);\n };\n\n const handleChange = (e, name, errorName) => {\n setErrorHandle({\n ...errorHandle,\n [errorName]: \" \",\n });\n\n setInputData({\n ...inputData,\n [name]: e.target.value,\n });\n };\n\n const handleAnswerChange = (index, value) => {\n setAnswers((prevAnswers) => {\n const updatedAnswers = [...prevAnswers];\n const existingAnswer = updatedAnswers.find(\n (ans) =>\n ans.openPoolQuestionId ===\n broadcastdata.openPoolQuestions[index].openPoolQuestionId\n );\n\n if (existingAnswer) {\n existingAnswer.answer = value;\n } else {\n updatedAnswers.push({\n openPoolQuestionId:\n broadcastdata.openPoolQuestions[index].openPoolQuestionId,\n question: broadcastdata.openPoolQuestions[index].question,\n questionType: broadcastdata.openPoolQuestions[index].questionType,\n answer: value,\n isMandatory: broadcastdata.openPoolQuestions[index].mandatory,\n });\n }\n return updatedAnswers;\n });\n };\n const validateEmail = (email) => {\n const re = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\n return re.test(email);\n };\n const handleFileReader = (event) => {\n const selectedFile = event.target.files[0];\n\n if (selectedFile) {\n if (selectedFile.size <= MAX_FILE_SIZE) {\n setFileResume(selectedFile);\n\n // Save file metadata to localStorage\n const fileData = {\n name: selectedFile.name,\n size: selectedFile.size,\n type: selectedFile.type,\n };\n localStorage.setItem(\"resumeFileData\", JSON.stringify(fileData));\n\n setErrorHandle({\n ...errorHandle,\n errorFile: null,\n });\n } else {\n alert(\"File size exceeds the 10MB limit.\");\n event.target.value = null; // Reset the file input\n }\n }\n };\n\n const handleDragOver = (event) => {\n event.preventDefault();\n };\n\n const handleDrop = (event) => {\n event.preventDefault();\n const file = event.dataTransfer.files[0];\n setFileResume(file);\n };\n\n const submitApi = () => {\n const body = {};\n let validationErrors = false;\n\n body[\"firstName\"] = inputData.firstName;\n body[\"lastName\"] = inputData.lastName;\n body[\"mobileNumber\"] = inputData.phoneNo;\n body[\"emailId\"] = inputData.email;\n body[\"resumeFile\"] = resumeFile;\n body[\"jobApplicationPaymentData\"] = paymentSuccess;\n if (jobId) {\n for (\n let index = 0;\n index < broadcastdata?.openPoolQuestions?.length;\n index++\n ) {\n const item = broadcastdata.openPoolQuestions[index];\n const answerObj = answers.find(\n (ans) => ans.openPoolQuestionId === item.openPoolQuestionId\n );\n\n if (item.mandatory && (!answerObj || !answerObj.answer)) {\n validationErrors = true;\n alert(\"Please attempt all the mandatory questions.\");\n return; // Exit the loop and prevent further processing\n }\n }\n body[\"openPoolAnswers\"] = answers;\n\n body[\"jdIdentifier\"] = jobId;\n broadcastdata?.openPoolQuestions?.forEach((questions) => {\n const existingAnswer = body[\"openPoolAnswers\"].find(\n (answers) =>\n answers.openPoolQuestionId === questions.openPoolQuestionId\n );\n\n if (!existingAnswer) {\n body[\"openPoolAnswers\"].push({\n openPoolQuestionId: questions.openPoolQuestionId,\n question: questions.question,\n questionType: questions.questionType,\n answer: \"\",\n isMandatory: questions.mandatory,\n });\n }\n });\n }\n formData.append(\"candidateDetailsRequest\", JSON.stringify(body));\n formData.append(\"resumeFile\", resumeFile);\n\n if (inputData.firstName === \"\" || inputData.firstName === null) {\n setErrorHandle({\n ...errorHandle,\n errorFirstName: \"Please provide first name!\",\n });\n return;\n } else if (inputData.phoneNo === \"\" || inputData.phoneNo === null) {\n setErrorHandle({\n ...errorHandle,\n errorPhoneNo: \"Please provide phone number!\",\n });\n return;\n } else if (inputData.email == \"\" || inputData.phoneNo == null) {\n setErrorHandle({\n ...errorHandle,\n errorEmail: \"Please provide email address!\",\n });\n return;\n } else if (!validateEmail(inputData.email)) {\n setErrorHandle({\n ...errorHandle,\n errorEmail: \"Invalid email format!\",\n });\n return;\n } else if (resumeFile === null || resumeFile === undefined) {\n setErrorHandle({\n ...errorHandle,\n errorFile: \"Please upload File!\",\n });\n return;\n } else if (validationErrors) {\n return;\n }\n\n const options = {\n method: \"POST\", // HTTP method\n headers: {\n reCaptcha: \"string\", // Add your reCaptcha token here\n },\n body: formData, // Data being sent\n };\n setLoading(true);\n\n fetch(`${jobId ? resumeUploadJdApi : resumeUploadApi}`, options)\n .then((response) => response.json()) // Parse the JSON response\n .then((data) => {\n if (data.resultStatusInfo.resultCode === \"Success\") {\n setVerified(true);\n setLoading(false);\n } else {\n setLoading(false);\n }\n })\n .catch((error) => {\n setLoading(false);\n console.error(\"Error:\", error); // Handle any errors\n });\n };\n const handleSubmitFinal = () => {\n const body = {};\n\n body[\"firstName\"] = inputData.firstName;\n body[\"lastName\"] = inputData.lastName;\n body[\"mobileNumber\"] = inputData.phoneNo;\n body[\"emailId\"] = inputData.email;\n body[\"resumeFile\"] = resumeFile;\n body[\"jobApplicationPaymentData\"] = {\n paymentInfo: paymentSuccess,\n selectedPaymentCriteria: selectedData,\n };\n\n if (jobId) {\n body[\"openPoolAnswers\"] = answers;\n\n body[\"jdIdentifier\"] = jobId;\n broadcastdata?.openPoolQuestions?.forEach((questions) => {\n const existingAnswer = body[\"openPoolAnswers\"].find(\n (answers) =>\n answers.openPoolQuestionId === questions.openPoolQuestionId\n );\n\n if (!existingAnswer) {\n body[\"openPoolAnswers\"].push({\n openPoolQuestionId: questions.openPoolQuestionId,\n question: questions.question,\n questionType: questions.questionType,\n answer: \"\",\n isMandatory: questions.mandatory,\n });\n }\n });\n }\n formData.append(\"candidateDetailsRequest\", JSON.stringify(body));\n formData.append(\"resumeFile\", resumeFile);\n // console.log(body);\n\n const options = {\n method: \"POST\", // HTTP method\n headers: {\n reCaptcha: \"string\", // Add your reCaptcha token here\n },\n body: formData, // Data being sent\n };\n setLoading(true);\n\n fetch(`${jobId ? resumeUploadJdApi : resumeUploadApi}`, options)\n .then((response) => response.json()) // Parse the JSON response\n .then((data) => {\n // console.log(\"Success:\", data); // Handle the response data\n if (data.resultStatusInfo.resultCode === \"Success\") {\n setVerified(true);\n setLoading(false);\n } else {\n setLoading(false);\n }\n // window.location.href=\"./jobs\"\n })\n .catch((error) => {\n setLoading(false);\n console.error(\"Error:\", error); // Handle any errors\n });\n\n // localStorage.removeItem(\"resumeFileData\");\n // localStorage.removeItem(\"resumeUploadInputData\");\n // localStorage.removeItem(\"resumeUploadAnswers\");\n };\n const handleClose = () => {\n // handleCancel();\n window.location.href = \"/jobs\";\n };\n function onCaptchaChange(value) {\n setReChapthaDisable(false);\n document.querySelector(\"#hirePPRecaptcha iframe\").style.border = \"none\";\n }\n //onExpiredChange\n function onExpiredChange(value) {\n document.querySelector(\"#hirePPRecaptcha iframe\").style.border =\n \"2px solid red\";\n // sessionStorage.setItem(\"recaptchaFlag\", false);\n setReChapthaDisable(true);\n }\n\n const handleCopy = (text) => {\n navigator.clipboard\n .writeText(text)\n .then(() => {\n message.success(\"Payment ID copied to clipboard!\");\n })\n .catch(() => {\n message.error(\"Failed to copy Payment ID.\");\n });\n };\n\n return (\n <>\n {orderModal && (\n \n )}\n {razorpayModal && (\n \n )}\n \n }\n >\n \n Upload Resume \n \n {jobId && (\n \n (JobId: