@oneblink/apps-react 5.3.0-beta.3 → 5.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/renderer/AutocompleteDropdown.js +3 -1
- package/dist/components/renderer/AutocompleteDropdown.js.map +1 -1
- package/dist/components/renderer/LookupNotification.js +2 -1
- package/dist/components/renderer/LookupNotification.js.map +1 -1
- package/dist/form-elements/FormElementABN.js +8 -4
- package/dist/form-elements/FormElementABN.js.map +1 -1
- package/dist/form-elements/FormElementBSB.js +8 -4
- package/dist/form-elements/FormElementBSB.js.map +1 -1
- package/dist/form-elements/FormElementBarcodeScanner.js +4 -2
- package/dist/form-elements/FormElementBarcodeScanner.js.map +1 -1
- package/dist/form-elements/FormElementBoolean.js +4 -1
- package/dist/form-elements/FormElementBoolean.js.map +1 -1
- package/dist/form-elements/FormElementCheckBoxes.js +4 -1
- package/dist/form-elements/FormElementCheckBoxes.js.map +1 -1
- package/dist/form-elements/FormElementDate.js +4 -1
- package/dist/form-elements/FormElementDate.js.map +1 -1
- package/dist/form-elements/FormElementDateTime.js +4 -1
- package/dist/form-elements/FormElementDateTime.js.map +1 -1
- package/dist/form-elements/FormElementEmail.js +4 -1
- package/dist/form-elements/FormElementEmail.js.map +1 -1
- package/dist/form-elements/FormElementFiles.js +4 -1
- package/dist/form-elements/FormElementFiles.js.map +1 -1
- package/dist/form-elements/FormElementLocation.js +4 -1
- package/dist/form-elements/FormElementLocation.js.map +1 -1
- package/dist/form-elements/FormElementNumber.js +4 -1
- package/dist/form-elements/FormElementNumber.js.map +1 -1
- package/dist/form-elements/FormElementRadio.js +4 -1
- package/dist/form-elements/FormElementRadio.js.map +1 -1
- package/dist/form-elements/FormElementSelect.js +4 -1
- package/dist/form-elements/FormElementSelect.js.map +1 -1
- package/dist/form-elements/FormElementTelephone.js +4 -1
- package/dist/form-elements/FormElementTelephone.js.map +1 -1
- package/dist/form-elements/FormElementText.js +3 -1
- package/dist/form-elements/FormElementText.js.map +1 -1
- package/dist/form-elements/FormElementTextarea.js +3 -1
- package/dist/form-elements/FormElementTextarea.js.map +1 -1
- package/dist/form-elements/FormElementTime.js +4 -1
- package/dist/form-elements/FormElementTime.js.map +1 -1
- package/dist/hooks/useLookupNotification.d.ts +2 -0
- package/dist/hooks/useLookupNotification.js +1 -0
- package/dist/hooks/useLookupNotification.js.map +1 -1
- package/package.json +1 -1
@@ -2,6 +2,7 @@ import * as React from 'react';
|
|
2
2
|
import clsx from 'clsx';
|
3
3
|
import { Sentry } from '@oneblink/apps';
|
4
4
|
import useBooleanState from '../../hooks/useBooleanState';
|
5
|
+
import { LookupNotificationContext } from '../../hooks/useLookupNotification';
|
5
6
|
function AutocompleteDropdown({ id, label, value, placeholder, required, disabled, validationMessage, displayValidationMessage, searchDebounceMs, searchMinCharacters, isLoading, hasError, onChangeValue, onChangeLabel, onSearch, isDirty, setIsDirty, }) {
|
6
7
|
const optionsContainerElement = React.useRef(null);
|
7
8
|
const [currentFocusedOptionIndex, setCurrentFocusedOptionIndex] = React.useState(0);
|
@@ -145,9 +146,10 @@ function AutocompleteDropdown({ id, label, value, placeholder, required, disable
|
|
145
146
|
onChangeLabel('');
|
146
147
|
}
|
147
148
|
}, [onChangeLabel, value]);
|
149
|
+
const { isLookingUp } = React.useContext(LookupNotificationContext);
|
148
150
|
const isShowingLoading = isFetchingOptions || !!isLoading;
|
149
151
|
const isShowingValid = !isShowingLoading && value !== undefined;
|
150
|
-
const isShowingError = !isShowingLoading && !!hasError;
|
152
|
+
const isShowingError = !isShowingLoading && !isLookingUp && !!hasError;
|
151
153
|
return (React.createElement(React.Fragment, null,
|
152
154
|
React.createElement("div", { className: clsx('dropdown', {
|
153
155
|
'is-active': isOpen && Array.isArray(options),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"AutocompleteDropdown.js","sourceRoot":"","sources":["../../../src/components/renderer/AutocompleteDropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Sentry } from '@oneblink/apps'\n\nimport useBooleanState from '../../hooks/useBooleanState'\nimport { IsDirtyProps } from '../../types/form'\n\ntype AutocompleteOption<T> = {\n label: string\n value: string\n data?: T\n}\n\ntype Props<T> = {\n id: string\n label: string\n value: unknown | undefined\n placeholder: string | undefined\n required: boolean | undefined\n disabled: boolean | undefined\n isLoading?: boolean\n hasError?: boolean\n validationMessage: string | undefined\n displayValidationMessage: boolean\n searchDebounceMs: number\n searchMinCharacters: number\n onChangeValue: (\n newValue: string | undefined,\n data?: T,\n ) => Promise<void> | void\n onChangeLabel: (newLabel: string) => void\n onSearch: (\n label: string,\n abortSignal: AbortSignal,\n ) => Promise<AutocompleteOption<T>[]>\n} & IsDirtyProps\n\nfunction AutocompleteDropdown<T>({\n id,\n label,\n value,\n placeholder,\n required,\n disabled,\n validationMessage,\n displayValidationMessage,\n searchDebounceMs,\n searchMinCharacters,\n isLoading,\n hasError,\n onChangeValue,\n onChangeLabel,\n onSearch,\n isDirty,\n setIsDirty,\n}: Props<T>) {\n const optionsContainerElement = React.useRef<HTMLDivElement>(null)\n const [currentFocusedOptionIndex, setCurrentFocusedOptionIndex] =\n React.useState(0)\n const [options, setOptions] = React.useState<AutocompleteOption<T>[]>([])\n const [error, setError] = React.useState<Error | null>(null)\n const [isFetchingOptions, setIsFetchingOptions] = React.useState(false)\n const [isOpen, onOpen, onClose] = useBooleanState(false)\n\n const onSelectOption = React.useCallback(\n (option: AutocompleteOption<T>) => {\n onChangeLabel(option.label)\n onChangeValue(option.value, option.data)\n onClose()\n },\n [onChangeLabel, onChangeValue, onClose],\n )\n\n const handleClickOption = React.useCallback(\n (\n event: React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n option: AutocompleteOption<T>,\n ) => {\n console.log('Selected element option in autocomplete', option)\n\n event.preventDefault()\n event.stopPropagation()\n\n onSelectOption(option)\n },\n [onSelectOption],\n )\n\n const onFocus = React.useCallback(() => {\n setCurrentFocusedOptionIndex(0)\n onOpen()\n }, [onOpen])\n\n // When moving away from the input, if this is no value remove\n // the label to show the user they have not selected a value\n const handleBlur = React.useCallback(\n (inputOption: { label: string; value: unknown | undefined }) => {\n setIsDirty()\n setError(null)\n onClose()\n\n if (Array.isArray(options)) {\n // If there is a label that resembles an option, set that option to be the new value.\n // UNLESS it was the previously selected label. Else, clear the label and the value.\n if (inputOption.label) {\n const lowerCase = inputOption.label.toLowerCase()\n const option = options.find(\n (option) => option.label.toLowerCase() === lowerCase,\n )\n if (option) {\n // If the new option is not equal to the option that is currently selected,\n // we want to update to the new option to ensure that it gets changed.\n if (inputOption.value !== option.value) {\n console.log('Setting value after blurring away from autocomplete')\n onSelectOption(option)\n }\n return\n }\n }\n\n console.log('Removing label after blurring away from autocomplete')\n onChangeValue(undefined)\n onChangeLabel('')\n }\n },\n [\n onChangeLabel,\n onChangeValue,\n onClose,\n onSelectOption,\n options,\n setIsDirty,\n ],\n )\n\n const onKeyDown = React.useCallback<\n React.KeyboardEventHandler<HTMLInputElement>\n >(\n (event) => {\n if (!options) {\n return\n }\n const enterPressed = event.keyCode === 13\n const upArrowPressed = event.keyCode === 38\n const downArrowPressed = event.keyCode === 40\n if (!upArrowPressed && !downArrowPressed && !enterPressed) {\n return\n }\n\n event.preventDefault()\n\n const previousFocusedOptionIndex = currentFocusedOptionIndex\n let nextFocusedOptionIndex = currentFocusedOptionIndex\n if (upArrowPressed) {\n nextFocusedOptionIndex = Math.max(0, currentFocusedOptionIndex - 1)\n } else if (downArrowPressed) {\n nextFocusedOptionIndex = Math.min(\n options.length - 1,\n currentFocusedOptionIndex + 1,\n )\n } else if (enterPressed) {\n const option = options[nextFocusedOptionIndex]\n if (option) {\n onSelectOption(option)\n }\n }\n\n // If the index has changed, need to ensure the active option is visible\n if (\n previousFocusedOptionIndex !== nextFocusedOptionIndex &&\n optionsContainerElement.current\n ) {\n const activeStepElement = optionsContainerElement.current.querySelector(\n `.ob-autocomplete__drop-down-item-${nextFocusedOptionIndex}`,\n )\n if (activeStepElement) {\n activeStepElement.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'start',\n })\n }\n setCurrentFocusedOptionIndex(nextFocusedOptionIndex)\n }\n },\n [currentFocusedOptionIndex, options, onSelectOption],\n )\n\n const handleChangeLabel = React.useCallback<\n React.ChangeEventHandler<HTMLInputElement>\n >(\n (e) => {\n const newLabel = e.target.value\n onOpen()\n setCurrentFocusedOptionIndex(0)\n\n onChangeLabel(newLabel)\n },\n [onChangeLabel, onOpen],\n )\n\n React.useEffect(() => {\n setError(null)\n\n if (!isOpen || label.length < searchMinCharacters) {\n setIsFetchingOptions(false)\n return\n }\n\n setIsFetchingOptions(true)\n\n let ignore = false\n const abortController = new AbortController()\n\n const timeoutId = setTimeout(async () => {\n let newOptions: AutocompleteOption<T>[] = []\n let newError = null\n\n try {\n newOptions = await onSearch(label, abortController.signal)\n } catch (error) {\n // Cancelling will throw an error.\n if (!abortController.signal.aborted) {\n console.warn('Error while fetching autocomplete options', error)\n Sentry.captureException(error)\n newError = error as Error\n }\n }\n if (!ignore) {\n setError(newError)\n setOptions(newOptions)\n setIsFetchingOptions(false)\n }\n }, searchDebounceMs)\n\n return () => {\n ignore = true\n clearTimeout(timeoutId)\n abortController.abort()\n }\n }, [isOpen, label, onSearch, searchDebounceMs, searchMinCharacters])\n\n React.useEffect(() => {\n //If there is no value set, we want to clear the label\n //This is to satisfy lookups that return undefined.\n if (!value) {\n onChangeLabel('')\n }\n }, [onChangeLabel, value])\n\n const isShowingLoading = isFetchingOptions || !!isLoading\n const isShowingValid = !isShowingLoading && value !== undefined\n const isShowingError = !isShowingLoading && !!hasError\n\n return (\n <>\n <div\n className={clsx('dropdown', {\n 'is-active': isOpen && Array.isArray(options),\n })}\n >\n <div className=\"field\">\n <div\n className={clsx(\n 'cypress-autocomplete-field-control control is-expanded',\n {\n 'is-loading': isShowingLoading,\n 'has-icons-right': isShowingValid || isShowingError,\n },\n )}\n >\n <input\n type=\"text\"\n placeholder={placeholder}\n id={id}\n autoComplete=\"off\"\n className=\"cypress-autocomplete-control input ob-input\"\n required={required}\n value={label}\n disabled={disabled}\n onFocus={onFocus}\n onBlur={() => handleBlur({ label, value })}\n onKeyDown={onKeyDown}\n onChange={handleChangeLabel}\n />\n {isShowingValid && (\n <span className=\" ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5 has-text-success\">\n check\n </i>\n </span>\n )}\n {isShowingError && (\n <span className=\" ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5 has-text-danger\">\n error\n </i>\n </span>\n )}\n </div>\n </div>\n\n <div className=\"dropdown-menu\">\n <div\n ref={optionsContainerElement}\n className=\"ob-autocomplete__dropdown-content dropdown-content cypress-autocomplete-dropdown-content\"\n >\n {error ? (\n <a className=\"dropdown-item cypress-autocomplete-error ob-autocomplete__drop-down-item-error\">\n <span className=\"has-text-danger\">{error.message}</span>\n </a>\n ) : label.length < searchMinCharacters ? (\n <a className=\"dropdown-item cypress-max-characters ob-autocomplete__drop-down-item-max-characters\">\n <i>\n Enter at least {searchMinCharacters} character(s) to search\n </i>\n </a>\n ) : isShowingLoading ? (\n <a className=\"dropdown-item cypress-searching-options ob-autocomplete__drop-down-item-searching\">\n <i>Searching...</i>\n </a>\n ) : options && options.length ? (\n options.map((option, index) => (\n <a\n key={option.value}\n className={clsx(\n `dropdown-item cypress-autocomplete-dropdown-item ob-autocomplete__drop-down-item-${index}`,\n {\n 'is-active': currentFocusedOptionIndex === index,\n },\n )}\n onMouseDown={(e) => handleClickOption(e, option)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: highlightLabel(option.label, label),\n }}\n />\n ))\n ) : (\n <a className=\"dropdown-item cypress-no-matches-found ob-autocomplete__drop-down-item-no-matches\">\n <i>No matches found</i>\n </a>\n )}\n </div>\n </div>\n </div>\n\n {(isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isShowingLoading && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </>\n )\n}\n\nexport default React.memo(AutocompleteDropdown) as typeof AutocompleteDropdown\n\nfunction highlightLabel(text: string, phrase: string) {\n if (phrase) {\n text = text.replace(\n new RegExp(\n '(' +\n phrase.replace(\n /[`~!@#$%^&*()_|+\\-=?;:'\",.<>{}[\\]\\\\/]/gi,\n (char: string) => `\\\\${char}`,\n ) +\n ')',\n 'gi',\n ),\n '<b>$1</b>',\n )\n }\n\n return text\n}\n"]}
|
1
|
+
{"version":3,"file":"AutocompleteDropdown.js","sourceRoot":"","sources":["../../../src/components/renderer/AutocompleteDropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Sentry } from '@oneblink/apps'\n\nimport useBooleanState from '../../hooks/useBooleanState'\nimport { IsDirtyProps } from '../../types/form'\nimport { LookupNotificationContext } from '../../hooks/useLookupNotification'\n\ntype AutocompleteOption<T> = {\n label: string\n value: string\n data?: T\n}\n\ntype Props<T> = {\n id: string\n label: string\n value: unknown | undefined\n placeholder: string | undefined\n required: boolean | undefined\n disabled: boolean | undefined\n isLoading?: boolean\n hasError?: boolean\n validationMessage: string | undefined\n displayValidationMessage: boolean\n searchDebounceMs: number\n searchMinCharacters: number\n onChangeValue: (\n newValue: string | undefined,\n data?: T,\n ) => Promise<void> | void\n onChangeLabel: (newLabel: string) => void\n onSearch: (\n label: string,\n abortSignal: AbortSignal,\n ) => Promise<AutocompleteOption<T>[]>\n} & IsDirtyProps\n\nfunction AutocompleteDropdown<T>({\n id,\n label,\n value,\n placeholder,\n required,\n disabled,\n validationMessage,\n displayValidationMessage,\n searchDebounceMs,\n searchMinCharacters,\n isLoading,\n hasError,\n onChangeValue,\n onChangeLabel,\n onSearch,\n isDirty,\n setIsDirty,\n}: Props<T>) {\n const optionsContainerElement = React.useRef<HTMLDivElement>(null)\n const [currentFocusedOptionIndex, setCurrentFocusedOptionIndex] =\n React.useState(0)\n const [options, setOptions] = React.useState<AutocompleteOption<T>[]>([])\n const [error, setError] = React.useState<Error | null>(null)\n const [isFetchingOptions, setIsFetchingOptions] = React.useState(false)\n const [isOpen, onOpen, onClose] = useBooleanState(false)\n\n const onSelectOption = React.useCallback(\n (option: AutocompleteOption<T>) => {\n onChangeLabel(option.label)\n onChangeValue(option.value, option.data)\n onClose()\n },\n [onChangeLabel, onChangeValue, onClose],\n )\n\n const handleClickOption = React.useCallback(\n (\n event: React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n option: AutocompleteOption<T>,\n ) => {\n console.log('Selected element option in autocomplete', option)\n\n event.preventDefault()\n event.stopPropagation()\n\n onSelectOption(option)\n },\n [onSelectOption],\n )\n\n const onFocus = React.useCallback(() => {\n setCurrentFocusedOptionIndex(0)\n onOpen()\n }, [onOpen])\n\n // When moving away from the input, if this is no value remove\n // the label to show the user they have not selected a value\n const handleBlur = React.useCallback(\n (inputOption: { label: string; value: unknown | undefined }) => {\n setIsDirty()\n setError(null)\n onClose()\n\n if (Array.isArray(options)) {\n // If there is a label that resembles an option, set that option to be the new value.\n // UNLESS it was the previously selected label. Else, clear the label and the value.\n if (inputOption.label) {\n const lowerCase = inputOption.label.toLowerCase()\n const option = options.find(\n (option) => option.label.toLowerCase() === lowerCase,\n )\n if (option) {\n // If the new option is not equal to the option that is currently selected,\n // we want to update to the new option to ensure that it gets changed.\n if (inputOption.value !== option.value) {\n console.log('Setting value after blurring away from autocomplete')\n onSelectOption(option)\n }\n return\n }\n }\n\n console.log('Removing label after blurring away from autocomplete')\n onChangeValue(undefined)\n onChangeLabel('')\n }\n },\n [\n onChangeLabel,\n onChangeValue,\n onClose,\n onSelectOption,\n options,\n setIsDirty,\n ],\n )\n\n const onKeyDown = React.useCallback<\n React.KeyboardEventHandler<HTMLInputElement>\n >(\n (event) => {\n if (!options) {\n return\n }\n const enterPressed = event.keyCode === 13\n const upArrowPressed = event.keyCode === 38\n const downArrowPressed = event.keyCode === 40\n if (!upArrowPressed && !downArrowPressed && !enterPressed) {\n return\n }\n\n event.preventDefault()\n\n const previousFocusedOptionIndex = currentFocusedOptionIndex\n let nextFocusedOptionIndex = currentFocusedOptionIndex\n if (upArrowPressed) {\n nextFocusedOptionIndex = Math.max(0, currentFocusedOptionIndex - 1)\n } else if (downArrowPressed) {\n nextFocusedOptionIndex = Math.min(\n options.length - 1,\n currentFocusedOptionIndex + 1,\n )\n } else if (enterPressed) {\n const option = options[nextFocusedOptionIndex]\n if (option) {\n onSelectOption(option)\n }\n }\n\n // If the index has changed, need to ensure the active option is visible\n if (\n previousFocusedOptionIndex !== nextFocusedOptionIndex &&\n optionsContainerElement.current\n ) {\n const activeStepElement = optionsContainerElement.current.querySelector(\n `.ob-autocomplete__drop-down-item-${nextFocusedOptionIndex}`,\n )\n if (activeStepElement) {\n activeStepElement.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'start',\n })\n }\n setCurrentFocusedOptionIndex(nextFocusedOptionIndex)\n }\n },\n [currentFocusedOptionIndex, options, onSelectOption],\n )\n\n const handleChangeLabel = React.useCallback<\n React.ChangeEventHandler<HTMLInputElement>\n >(\n (e) => {\n const newLabel = e.target.value\n onOpen()\n setCurrentFocusedOptionIndex(0)\n\n onChangeLabel(newLabel)\n },\n [onChangeLabel, onOpen],\n )\n\n React.useEffect(() => {\n setError(null)\n\n if (!isOpen || label.length < searchMinCharacters) {\n setIsFetchingOptions(false)\n return\n }\n\n setIsFetchingOptions(true)\n\n let ignore = false\n const abortController = new AbortController()\n\n const timeoutId = setTimeout(async () => {\n let newOptions: AutocompleteOption<T>[] = []\n let newError = null\n\n try {\n newOptions = await onSearch(label, abortController.signal)\n } catch (error) {\n // Cancelling will throw an error.\n if (!abortController.signal.aborted) {\n console.warn('Error while fetching autocomplete options', error)\n Sentry.captureException(error)\n newError = error as Error\n }\n }\n if (!ignore) {\n setError(newError)\n setOptions(newOptions)\n setIsFetchingOptions(false)\n }\n }, searchDebounceMs)\n\n return () => {\n ignore = true\n clearTimeout(timeoutId)\n abortController.abort()\n }\n }, [isOpen, label, onSearch, searchDebounceMs, searchMinCharacters])\n\n React.useEffect(() => {\n //If there is no value set, we want to clear the label\n //This is to satisfy lookups that return undefined.\n if (!value) {\n onChangeLabel('')\n }\n }, [onChangeLabel, value])\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n\n const isShowingLoading = isFetchingOptions || !!isLoading\n const isShowingValid = !isShowingLoading && value !== undefined\n const isShowingError = !isShowingLoading && !isLookingUp && !!hasError\n\n return (\n <>\n <div\n className={clsx('dropdown', {\n 'is-active': isOpen && Array.isArray(options),\n })}\n >\n <div className=\"field\">\n <div\n className={clsx(\n 'cypress-autocomplete-field-control control is-expanded',\n {\n 'is-loading': isShowingLoading,\n 'has-icons-right': isShowingValid || isShowingError,\n },\n )}\n >\n <input\n type=\"text\"\n placeholder={placeholder}\n id={id}\n autoComplete=\"off\"\n className=\"cypress-autocomplete-control input ob-input\"\n required={required}\n value={label}\n disabled={disabled}\n onFocus={onFocus}\n onBlur={() => handleBlur({ label, value })}\n onKeyDown={onKeyDown}\n onChange={handleChangeLabel}\n />\n {isShowingValid && (\n <span className=\" ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5 has-text-success\">\n check\n </i>\n </span>\n )}\n {isShowingError && (\n <span className=\" ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5 has-text-danger\">\n error\n </i>\n </span>\n )}\n </div>\n </div>\n\n <div className=\"dropdown-menu\">\n <div\n ref={optionsContainerElement}\n className=\"ob-autocomplete__dropdown-content dropdown-content cypress-autocomplete-dropdown-content\"\n >\n {error ? (\n <a className=\"dropdown-item cypress-autocomplete-error ob-autocomplete__drop-down-item-error\">\n <span className=\"has-text-danger\">{error.message}</span>\n </a>\n ) : label.length < searchMinCharacters ? (\n <a className=\"dropdown-item cypress-max-characters ob-autocomplete__drop-down-item-max-characters\">\n <i>\n Enter at least {searchMinCharacters} character(s) to search\n </i>\n </a>\n ) : isShowingLoading ? (\n <a className=\"dropdown-item cypress-searching-options ob-autocomplete__drop-down-item-searching\">\n <i>Searching...</i>\n </a>\n ) : options && options.length ? (\n options.map((option, index) => (\n <a\n key={option.value}\n className={clsx(\n `dropdown-item cypress-autocomplete-dropdown-item ob-autocomplete__drop-down-item-${index}`,\n {\n 'is-active': currentFocusedOptionIndex === index,\n },\n )}\n onMouseDown={(e) => handleClickOption(e, option)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: highlightLabel(option.label, label),\n }}\n />\n ))\n ) : (\n <a className=\"dropdown-item cypress-no-matches-found ob-autocomplete__drop-down-item-no-matches\">\n <i>No matches found</i>\n </a>\n )}\n </div>\n </div>\n </div>\n\n {(isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isShowingLoading && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </>\n )\n}\n\nexport default React.memo(AutocompleteDropdown) as typeof AutocompleteDropdown\n\nfunction highlightLabel(text: string, phrase: string) {\n if (phrase) {\n text = text.replace(\n new RegExp(\n '(' +\n phrase.replace(\n /[`~!@#$%^&*()_|+\\-=?;:'\",.<>{}[\\]\\\\/]/gi,\n (char: string) => `\\\\${char}`,\n ) +\n ')',\n 'gi',\n ),\n '<b>$1</b>',\n )\n }\n\n return text\n}\n"]}
|
@@ -236,7 +236,8 @@ function LookupNotificationComponent({ autoLookupValue, stringifyAutoLookupValue
|
|
236
236
|
isLoading,
|
237
237
|
onLookup: triggerLookup,
|
238
238
|
allowLookupOnEmptyValue: runLookupOnClear,
|
239
|
-
|
239
|
+
isLookingUp,
|
240
|
+
}), [isDisabled, isLoading, runLookupOnClear, triggerLookup, isLookingUp]);
|
240
241
|
return (React.createElement(LookupNotificationContext.Provider, { value: contextValue },
|
241
242
|
children,
|
242
243
|
loadError && (React.createElement(ErrorMessage, { title: "Error Loading Configuration", onTryAgain: onTryAgain },
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"LookupNotification.js","sourceRoot":"","sources":["../../../src/components/renderer/LookupNotification.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { generateHeaders } from '@oneblink/apps/dist/services/fetch'\nimport { Sentry, formService } from '@oneblink/apps'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\n\nimport useIsOffline from '../../hooks/useIsOffline'\nimport OnLoading from './OnLoading'\nimport generateDefaultData from '../../services/generate-default-data'\nimport {\n LookupNotificationContext,\n LookupNotificationContextValue,\n} from '../../hooks/useLookupNotification'\nimport useFormDefinition from '../../hooks/useFormDefinition'\nimport useInjectPages from '../../hooks/useInjectPages'\nimport useFormSubmissionModel from '../../hooks/useFormSubmissionModelContext'\nimport useFormIsReadOnly from '../../hooks/useFormIsReadOnly'\nimport useIsMounted from '../../hooks/useIsMounted'\nimport useFormElementLookups from '../../hooks/useFormElementLookups'\nimport mergeExecutedLookups from '../../utils/merge-executed-lookups'\n\nimport { FormElementLookupHandler, ExecutedLookups } from '../../types/form'\nimport ErrorMessage from '../messages/ErrorMessage'\n\ntype FetchLookupPayload = {\n element: FormTypes.LookupFormElement\n definition?: FormTypes.Form\n submission: SubmissionTypes.S3SubmissionData['submission']\n}\ntype Props = {\n autoLookupValue?: unknown\n stringifyAutoLookupValue?: (autoLookupValue: unknown) => string\n element: FormTypes.LookupFormElement\n onLookup: FormElementLookupHandler\n children: React.ReactNode\n}\n\nfunction LookupNotificationComponent({\n autoLookupValue,\n stringifyAutoLookupValue,\n element,\n onLookup,\n children,\n}: Props) {\n const isMounted = useIsMounted()\n const isOffline = useIsOffline()\n const definition = useFormDefinition()\n const injectPagesAfter = useInjectPages()\n const { isLoading, formElementLookups, loadError, onTryAgain } =\n useFormElementLookups()\n\n const [onCancelLookup, setOnCancelLookup] = React.useState<\n (() => void) | undefined\n >(undefined)\n const [isLookingUp, setIsLookingUp] = React.useState(false)\n const [hasLookupFailed, setHasLookupFailed] = React.useState(false)\n const [hasLookupSucceeded, setHasLookupSucceeded] = React.useState(false)\n const [isCancellable, setIsCancellable] = React.useState(false)\n const [isDisabled, setIsDisabled] = React.useState(false)\n const [lookupErrorHTML, setLookupErrorHTML] = React.useState<string | null>(\n null,\n )\n const formIsReadOnly = useFormIsReadOnly()\n const { formSubmissionModel: model } = useFormSubmissionModel()\n\n const formElementElementLookup = React.useMemo(() => {\n return formElementLookups.find(\n ({ id }) => element.isElementLookup && id === element.elementLookupId,\n )\n }, [element.elementLookupId, element.isElementLookup, formElementLookups])\n\n const formElementDataLookup = React.useMemo(() => {\n return formElementLookups.find(\n ({ id }) => element.isDataLookup && id === element.dataLookupId,\n )\n }, [element.dataLookupId, element.isDataLookup, formElementLookups])\n\n const runLookupOnClear = React.useMemo<boolean>(() => {\n return !!(\n formElementDataLookup?.runLookupOnClear ||\n formElementElementLookup?.runLookupOnClear\n )\n }, [\n formElementDataLookup?.runLookupOnClear,\n formElementElementLookup?.runLookupOnClear,\n ])\n\n const excludeDefinition = React.useMemo(() => {\n return !!(\n (formElementDataLookup?.type !== 'STATIC_DATA' &&\n formElementDataLookup?.excludeDefinition) ||\n (formElementElementLookup?.type !== 'STATIC_DATA' &&\n formElementElementLookup?.excludeDefinition)\n )\n }, [formElementDataLookup, formElementElementLookup])\n\n const mergeLookupData = React.useCallback(\n ({\n newValue,\n dataLookupResult,\n elementLookupResult,\n executedLookup,\n }: {\n newValue: unknown\n dataLookupResult:\n | SubmissionTypes.S3SubmissionData['submission']\n | undefined\n elementLookupResult: FormTypes.FormElement[] | undefined\n executedLookup: ExecutedLookups\n }) => {\n const executedLookupResult = executedLookup?.[element.name]\n if (elementLookupResult && executedLookupResult !== false) {\n if (elementLookupResult[0] && elementLookupResult[0].type === 'page') {\n injectPagesAfter(\n element,\n elementLookupResult as FormTypes.PageElement[],\n dataLookupResult,\n )\n return\n }\n }\n\n onLookup(({ submission, elements, executedLookups }) => {\n let allElements: FormTypes.FormElement[] = elements\n if (\n Array.isArray(elementLookupResult) &&\n executedLookupResult !== false\n ) {\n const indexOfElement = elements.findIndex(\n ({ id }) => id === element.id,\n )\n if (indexOfElement === -1) {\n console.log('Could not find element', element)\n } else {\n // Filter out already injected elements if lookup was successful\n allElements = elements.filter(\n // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n (e) => e.injectedByElementId !== element.id,\n )\n allElements.splice(\n indexOfElement + 1,\n 0,\n ...elementLookupResult.map((e) => {\n // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n e.injectedByElementId = element.id\n return e\n }),\n )\n }\n }\n\n return {\n elements: allElements,\n submission: generateDefaultData(allElements, {\n ...submission,\n [element.name]: newValue,\n ...dataLookupResult,\n }),\n executedLookups: mergeExecutedLookups({\n dataLookupResult,\n currentSubmission: submission,\n executedLookups: {\n ...executedLookups,\n ...executedLookup,\n },\n }),\n }\n })\n },\n [element, injectPagesAfter, onLookup],\n )\n\n const isNotStaticLookup = React.useMemo(() => {\n return (\n (formElementDataLookup && formElementDataLookup.type !== 'STATIC_DATA') ||\n (formElementElementLookup &&\n formElementElementLookup.type !== 'STATIC_DATA')\n )\n }, [formElementDataLookup, formElementElementLookup])\n\n const triggerLookup = React.useCallback<\n LookupNotificationContextValue['onLookup']\n >(\n async ({ newValue, abortController, continueLookupOnAbort }) => {\n // No lookups for read only forms\n if (formIsReadOnly) return\n\n setIsLookingUp(true)\n\n if (isOffline && isNotStaticLookup) {\n setHasLookupFailed(true)\n return\n }\n\n setIsDisabled(true)\n setIsCancellable(false)\n setHasLookupFailed(false)\n setHasLookupSucceeded(false)\n setLookupErrorHTML(null)\n setOnCancelLookup(() => () => {\n if (isMounted.current) {\n setIsLookingUp(false)\n }\n abortController.abort()\n })\n\n // After certain amount of time, show the cancel button\n const isCancellableTimeout = setTimeout(() => {\n setIsCancellable(!abortController.signal.aborted)\n }, 5000)\n\n const payload: FetchLookupPayload = {\n element,\n definition: !excludeDefinition ? definition : undefined,\n submission: {\n ...model,\n [element.name]: newValue,\n },\n }\n\n try {\n const [dataLookupResult, elementLookupResult] = await Promise.all([\n fetchLookup(formElementDataLookup, payload, abortController.signal),\n fetchLookup(\n formElementElementLookup,\n payload,\n abortController.signal,\n ),\n ])\n\n mergeLookupData({\n newValue,\n dataLookupResult: dataLookupResult as\n | SubmissionTypes.S3SubmissionData['submission']\n | undefined,\n elementLookupResult: elementLookupResult as\n | FormTypes.FormElement[]\n | undefined,\n executedLookup: { [element.name]: true },\n })\n\n if (isMounted.current) {\n setHasLookupSucceeded(true)\n }\n\n // After certain amount of time, hide the lookup succeeded message\n setTimeout(() => {\n if (isMounted.current) {\n setIsLookingUp(false)\n }\n }, 750)\n } catch (error) {\n if (!isMounted.current) {\n return\n }\n\n if (abortController.signal.aborted) {\n console.log('Fetch aborted')\n if (!continueLookupOnAbort) {\n setIsLookingUp(false)\n }\n return\n }\n\n setHasLookupFailed(true)\n mergeLookupData({\n newValue: model[element.name],\n dataLookupResult: {},\n elementLookupResult: [],\n executedLookup: { [element.name]: false },\n })\n setLookupErrorHTML(\n typeof error === 'string'\n ? error\n : 'It looks like something went wrong.<br/>Please try again.<br />If the issue continues, please contact support.',\n )\n } finally {\n clearTimeout(isCancellableTimeout)\n if (isMounted.current) {\n setIsDisabled(false)\n setOnCancelLookup(undefined)\n }\n }\n },\n [\n definition,\n element,\n excludeDefinition,\n formElementDataLookup,\n formElementElementLookup,\n formIsReadOnly,\n isMounted,\n isNotStaticLookup,\n isOffline,\n mergeLookupData,\n model,\n ],\n )\n\n // For certain elements, do not add click event\n // instead, watch model for changes and trigger lookup function.\n // We add this stringify function here to allow the value to be\n // an object which may have a reference change, but the values\n // have not changed. e.g. the 'location' element's value\n const autoLookupValueString = stringifyAutoLookupValue\n ? stringifyAutoLookupValue(autoLookupValue)\n : autoLookupValue\n React.useEffect(() => {\n if (isLoading || loadError) {\n return\n }\n const hasLookupRan = hasLookupFailed || hasLookupSucceeded\n\n // For lookups configured with `runLookupOnClear` set to true, we want to\n // allow empty values for `autoLookupValue`, but only if the lookup has\n // been ran previously. This prevents the lookup running on load with an empty value.\n if (\n (autoLookupValue === undefined || autoLookupValue === null) &&\n (!runLookupOnClear || !hasLookupRan)\n ) {\n setIsLookingUp(false)\n return\n }\n const abortController = new AbortController()\n triggerLookup({\n newValue: autoLookupValue,\n abortController,\n continueLookupOnAbort: true,\n })\n return () => {\n abortController.abort()\n }\n // Wants to use \"triggerLookup\" as a dependency,\n // however, this will change on any change made on any\n // element. Checking if \"value\" has changed is enough\n // to trigger a lookup when the correct dependencies change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [autoLookupValueString, isLoading])\n\n const contextValue = React.useMemo(\n () => ({\n isLookup: true,\n isDisabled,\n isLoading,\n onLookup: triggerLookup,\n allowLookupOnEmptyValue: runLookupOnClear,\n }),\n [isDisabled, isLoading, runLookupOnClear, triggerLookup],\n )\n\n return (\n <LookupNotificationContext.Provider value={contextValue}>\n {children}\n\n {loadError && (\n <ErrorMessage\n title=\"Error Loading Configuration\"\n onTryAgain={onTryAgain}\n >\n <span className=\"cypress-lookup-notification-loading-error\">\n {loadError.message}\n </span>\n </ErrorMessage>\n )}\n\n <div\n className={clsx('ob-lookup__notification', {\n 'is-looking-up': isLookingUp,\n 'is-extended':\n hasLookupFailed || (isCancellable && !hasLookupSucceeded),\n })}\n >\n <div className=\"notification has-margin-top-7 has-text-centered\">\n {hasLookupFailed && (\n <>\n <button\n type=\"button\"\n className=\"delete fade-in\"\n onClick={() => setIsLookingUp(false)}\n />\n\n <div>\n {isOffline && isNotStaticLookup ? (\n <div>\n <i className=\"material-icons fade-in has-text-warning\">\n wifi_off\n </i>\n <p className=\"fade-in\">\n It looks like you're offline. Please try again when\n connectivity is restored.\n </p>\n </div>\n ) : (\n <div>\n <i className=\"material-icons fade-in has-text-danger\">\n error_outline\n </i>\n <p\n className=\"fade-in\"\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: lookupErrorHTML || '',\n }}\n />\n </div>\n )}\n </div>\n </>\n )}\n\n {hasLookupSucceeded && (\n <i className=\"material-icons has-text-success fade-in\">\n check_circle_outline\n </i>\n )}\n\n {!hasLookupSucceeded && !hasLookupFailed && <OnLoading small />}\n\n {isCancellable && !hasLookupSucceeded && !hasLookupFailed && (\n <div className=\"has-margin-top-5 fade-in\">\n <p>Taking longer than expected?</p>\n <button\n type=\"button\"\n className=\"button has-margin-top-8\"\n onClick={onCancelLookup}\n >\n Cancel\n </button>\n </div>\n )}\n </div>\n </div>\n </LookupNotificationContext.Provider>\n )\n}\n\nexport default function LookupNotification(props: Props) {\n if (props.element.isDataLookup || props.element.isElementLookup) {\n return <LookupNotificationComponent {...props} />\n }\n\n return <>{props.children}</>\n}\n\nasync function fetchLookup(\n formElementLookup: formService.FormElementLookupResult | undefined,\n payload: FetchLookupPayload,\n abortSignal: AbortSignal,\n): Promise<\n | SubmissionTypes.S3SubmissionData['submission']\n | FormTypes.FormElement[]\n | undefined\n> {\n if (!formElementLookup) {\n return\n }\n\n if (formElementLookup.records) {\n const elementName = payload.element.name\n const inputValue = payload.submission[elementName]\n\n const matchingRecord = formElementLookup.records.find(\n (r) =>\n (r.inputType === 'UNDEFINED' && !inputValue) ||\n (r.inputType !== 'UNDEFINED' && r.inputValue === inputValue),\n )\n\n // insert prefill values\n return matchingRecord?.preFills.reduce<\n SubmissionTypes.S3SubmissionData['submission']\n >((lookupResult, prefill) => {\n switch (prefill.type) {\n case 'TEXT':\n lookupResult[prefill.formElementName] = prefill.text\n break\n case 'NUMBER':\n lookupResult[prefill.formElementName] = prefill.number\n break\n case 'CLEAR':\n lookupResult[prefill.formElementName] = undefined\n break\n }\n return lookupResult\n }, {})\n }\n\n if (!formElementLookup.url) {\n console.log(\n 'Could not find dynamic URL or static records for form element lookup:',\n formElementLookup,\n )\n throw new Error('Could not find element lookup configuration')\n }\n\n const headers = await generateHeaders()\n console.log(\n `Attempting a ${formElementLookup.type} lookup request to:`,\n formElementLookup.url,\n )\n const response = await fetch(formElementLookup.url, {\n method: 'POST',\n headers,\n body: JSON.stringify(payload),\n signal: abortSignal,\n })\n\n const data = await response.json()\n console.log(\n 'Response from lookup to: POST',\n formElementLookup.url,\n response.status,\n data,\n )\n\n if (!response.ok) {\n Sentry.captureException(\n new Error(`Received ${response.status} status code from lookup`),\n )\n if (response.status === 400 && data && data.message) {\n throw data.message\n }\n throw new Error('Invalid response from lookup')\n }\n\n return data as FormTypes.FormElement[]\n}\n"]}
|
1
|
+
{"version":3,"file":"LookupNotification.js","sourceRoot":"","sources":["../../../src/components/renderer/LookupNotification.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { generateHeaders } from '@oneblink/apps/dist/services/fetch'\nimport { Sentry, formService } from '@oneblink/apps'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\n\nimport useIsOffline from '../../hooks/useIsOffline'\nimport OnLoading from './OnLoading'\nimport generateDefaultData from '../../services/generate-default-data'\nimport {\n LookupNotificationContext,\n LookupNotificationContextValue,\n} from '../../hooks/useLookupNotification'\nimport useFormDefinition from '../../hooks/useFormDefinition'\nimport useInjectPages from '../../hooks/useInjectPages'\nimport useFormSubmissionModel from '../../hooks/useFormSubmissionModelContext'\nimport useFormIsReadOnly from '../../hooks/useFormIsReadOnly'\nimport useIsMounted from '../../hooks/useIsMounted'\nimport useFormElementLookups from '../../hooks/useFormElementLookups'\nimport mergeExecutedLookups from '../../utils/merge-executed-lookups'\n\nimport { FormElementLookupHandler, ExecutedLookups } from '../../types/form'\nimport ErrorMessage from '../messages/ErrorMessage'\n\ntype FetchLookupPayload = {\n element: FormTypes.LookupFormElement\n definition?: FormTypes.Form\n submission: SubmissionTypes.S3SubmissionData['submission']\n}\ntype Props = {\n autoLookupValue?: unknown\n stringifyAutoLookupValue?: (autoLookupValue: unknown) => string\n element: FormTypes.LookupFormElement\n onLookup: FormElementLookupHandler\n children: React.ReactNode\n}\n\nfunction LookupNotificationComponent({\n autoLookupValue,\n stringifyAutoLookupValue,\n element,\n onLookup,\n children,\n}: Props) {\n const isMounted = useIsMounted()\n const isOffline = useIsOffline()\n const definition = useFormDefinition()\n const injectPagesAfter = useInjectPages()\n const { isLoading, formElementLookups, loadError, onTryAgain } =\n useFormElementLookups()\n\n const [onCancelLookup, setOnCancelLookup] = React.useState<\n (() => void) | undefined\n >(undefined)\n const [isLookingUp, setIsLookingUp] = React.useState(false)\n const [hasLookupFailed, setHasLookupFailed] = React.useState(false)\n const [hasLookupSucceeded, setHasLookupSucceeded] = React.useState(false)\n const [isCancellable, setIsCancellable] = React.useState(false)\n const [isDisabled, setIsDisabled] = React.useState(false)\n const [lookupErrorHTML, setLookupErrorHTML] = React.useState<string | null>(\n null,\n )\n const formIsReadOnly = useFormIsReadOnly()\n const { formSubmissionModel: model } = useFormSubmissionModel()\n\n const formElementElementLookup = React.useMemo(() => {\n return formElementLookups.find(\n ({ id }) => element.isElementLookup && id === element.elementLookupId,\n )\n }, [element.elementLookupId, element.isElementLookup, formElementLookups])\n\n const formElementDataLookup = React.useMemo(() => {\n return formElementLookups.find(\n ({ id }) => element.isDataLookup && id === element.dataLookupId,\n )\n }, [element.dataLookupId, element.isDataLookup, formElementLookups])\n\n const runLookupOnClear = React.useMemo<boolean>(() => {\n return !!(\n formElementDataLookup?.runLookupOnClear ||\n formElementElementLookup?.runLookupOnClear\n )\n }, [\n formElementDataLookup?.runLookupOnClear,\n formElementElementLookup?.runLookupOnClear,\n ])\n\n const excludeDefinition = React.useMemo(() => {\n return !!(\n (formElementDataLookup?.type !== 'STATIC_DATA' &&\n formElementDataLookup?.excludeDefinition) ||\n (formElementElementLookup?.type !== 'STATIC_DATA' &&\n formElementElementLookup?.excludeDefinition)\n )\n }, [formElementDataLookup, formElementElementLookup])\n\n const mergeLookupData = React.useCallback(\n ({\n newValue,\n dataLookupResult,\n elementLookupResult,\n executedLookup,\n }: {\n newValue: unknown\n dataLookupResult:\n | SubmissionTypes.S3SubmissionData['submission']\n | undefined\n elementLookupResult: FormTypes.FormElement[] | undefined\n executedLookup: ExecutedLookups\n }) => {\n const executedLookupResult = executedLookup?.[element.name]\n if (elementLookupResult && executedLookupResult !== false) {\n if (elementLookupResult[0] && elementLookupResult[0].type === 'page') {\n injectPagesAfter(\n element,\n elementLookupResult as FormTypes.PageElement[],\n dataLookupResult,\n )\n return\n }\n }\n\n onLookup(({ submission, elements, executedLookups }) => {\n let allElements: FormTypes.FormElement[] = elements\n if (\n Array.isArray(elementLookupResult) &&\n executedLookupResult !== false\n ) {\n const indexOfElement = elements.findIndex(\n ({ id }) => id === element.id,\n )\n if (indexOfElement === -1) {\n console.log('Could not find element', element)\n } else {\n // Filter out already injected elements if lookup was successful\n allElements = elements.filter(\n // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n (e) => e.injectedByElementId !== element.id,\n )\n allElements.splice(\n indexOfElement + 1,\n 0,\n ...elementLookupResult.map((e) => {\n // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n e.injectedByElementId = element.id\n return e\n }),\n )\n }\n }\n\n return {\n elements: allElements,\n submission: generateDefaultData(allElements, {\n ...submission,\n [element.name]: newValue,\n ...dataLookupResult,\n }),\n executedLookups: mergeExecutedLookups({\n dataLookupResult,\n currentSubmission: submission,\n executedLookups: {\n ...executedLookups,\n ...executedLookup,\n },\n }),\n }\n })\n },\n [element, injectPagesAfter, onLookup],\n )\n\n const isNotStaticLookup = React.useMemo(() => {\n return (\n (formElementDataLookup && formElementDataLookup.type !== 'STATIC_DATA') ||\n (formElementElementLookup &&\n formElementElementLookup.type !== 'STATIC_DATA')\n )\n }, [formElementDataLookup, formElementElementLookup])\n\n const triggerLookup = React.useCallback<\n LookupNotificationContextValue['onLookup']\n >(\n async ({ newValue, abortController, continueLookupOnAbort }) => {\n // No lookups for read only forms\n if (formIsReadOnly) return\n\n setIsLookingUp(true)\n\n if (isOffline && isNotStaticLookup) {\n setHasLookupFailed(true)\n return\n }\n\n setIsDisabled(true)\n setIsCancellable(false)\n setHasLookupFailed(false)\n setHasLookupSucceeded(false)\n setLookupErrorHTML(null)\n setOnCancelLookup(() => () => {\n if (isMounted.current) {\n setIsLookingUp(false)\n }\n abortController.abort()\n })\n\n // After certain amount of time, show the cancel button\n const isCancellableTimeout = setTimeout(() => {\n setIsCancellable(!abortController.signal.aborted)\n }, 5000)\n\n const payload: FetchLookupPayload = {\n element,\n definition: !excludeDefinition ? definition : undefined,\n submission: {\n ...model,\n [element.name]: newValue,\n },\n }\n\n try {\n const [dataLookupResult, elementLookupResult] = await Promise.all([\n fetchLookup(formElementDataLookup, payload, abortController.signal),\n fetchLookup(\n formElementElementLookup,\n payload,\n abortController.signal,\n ),\n ])\n\n mergeLookupData({\n newValue,\n dataLookupResult: dataLookupResult as\n | SubmissionTypes.S3SubmissionData['submission']\n | undefined,\n elementLookupResult: elementLookupResult as\n | FormTypes.FormElement[]\n | undefined,\n executedLookup: { [element.name]: true },\n })\n\n if (isMounted.current) {\n setHasLookupSucceeded(true)\n }\n\n // After certain amount of time, hide the lookup succeeded message\n setTimeout(() => {\n if (isMounted.current) {\n setIsLookingUp(false)\n }\n }, 750)\n } catch (error) {\n if (!isMounted.current) {\n return\n }\n\n if (abortController.signal.aborted) {\n console.log('Fetch aborted')\n if (!continueLookupOnAbort) {\n setIsLookingUp(false)\n }\n return\n }\n\n setHasLookupFailed(true)\n mergeLookupData({\n newValue: model[element.name],\n dataLookupResult: {},\n elementLookupResult: [],\n executedLookup: { [element.name]: false },\n })\n setLookupErrorHTML(\n typeof error === 'string'\n ? error\n : 'It looks like something went wrong.<br/>Please try again.<br />If the issue continues, please contact support.',\n )\n } finally {\n clearTimeout(isCancellableTimeout)\n if (isMounted.current) {\n setIsDisabled(false)\n setOnCancelLookup(undefined)\n }\n }\n },\n [\n definition,\n element,\n excludeDefinition,\n formElementDataLookup,\n formElementElementLookup,\n formIsReadOnly,\n isMounted,\n isNotStaticLookup,\n isOffline,\n mergeLookupData,\n model,\n ],\n )\n\n // For certain elements, do not add click event\n // instead, watch model for changes and trigger lookup function.\n // We add this stringify function here to allow the value to be\n // an object which may have a reference change, but the values\n // have not changed. e.g. the 'location' element's value\n const autoLookupValueString = stringifyAutoLookupValue\n ? stringifyAutoLookupValue(autoLookupValue)\n : autoLookupValue\n React.useEffect(() => {\n if (isLoading || loadError) {\n return\n }\n const hasLookupRan = hasLookupFailed || hasLookupSucceeded\n\n // For lookups configured with `runLookupOnClear` set to true, we want to\n // allow empty values for `autoLookupValue`, but only if the lookup has\n // been ran previously. This prevents the lookup running on load with an empty value.\n if (\n (autoLookupValue === undefined || autoLookupValue === null) &&\n (!runLookupOnClear || !hasLookupRan)\n ) {\n setIsLookingUp(false)\n return\n }\n const abortController = new AbortController()\n triggerLookup({\n newValue: autoLookupValue,\n abortController,\n continueLookupOnAbort: true,\n })\n return () => {\n abortController.abort()\n }\n // Wants to use \"triggerLookup\" as a dependency,\n // however, this will change on any change made on any\n // element. Checking if \"value\" has changed is enough\n // to trigger a lookup when the correct dependencies change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [autoLookupValueString, isLoading])\n\n const contextValue = React.useMemo(\n () => ({\n isLookup: true,\n isDisabled,\n isLoading,\n onLookup: triggerLookup,\n allowLookupOnEmptyValue: runLookupOnClear,\n isLookingUp,\n }),\n [isDisabled, isLoading, runLookupOnClear, triggerLookup, isLookingUp],\n )\n\n return (\n <LookupNotificationContext.Provider value={contextValue}>\n {children}\n\n {loadError && (\n <ErrorMessage\n title=\"Error Loading Configuration\"\n onTryAgain={onTryAgain}\n >\n <span className=\"cypress-lookup-notification-loading-error\">\n {loadError.message}\n </span>\n </ErrorMessage>\n )}\n\n <div\n className={clsx('ob-lookup__notification', {\n 'is-looking-up': isLookingUp,\n 'is-extended':\n hasLookupFailed || (isCancellable && !hasLookupSucceeded),\n })}\n >\n <div className=\"notification has-margin-top-7 has-text-centered\">\n {hasLookupFailed && (\n <>\n <button\n type=\"button\"\n className=\"delete fade-in\"\n onClick={() => setIsLookingUp(false)}\n />\n\n <div>\n {isOffline && isNotStaticLookup ? (\n <div>\n <i className=\"material-icons fade-in has-text-warning\">\n wifi_off\n </i>\n <p className=\"fade-in\">\n It looks like you're offline. Please try again when\n connectivity is restored.\n </p>\n </div>\n ) : (\n <div>\n <i className=\"material-icons fade-in has-text-danger\">\n error_outline\n </i>\n <p\n className=\"fade-in\"\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: lookupErrorHTML || '',\n }}\n />\n </div>\n )}\n </div>\n </>\n )}\n\n {hasLookupSucceeded && (\n <i className=\"material-icons has-text-success fade-in\">\n check_circle_outline\n </i>\n )}\n\n {!hasLookupSucceeded && !hasLookupFailed && <OnLoading small />}\n\n {isCancellable && !hasLookupSucceeded && !hasLookupFailed && (\n <div className=\"has-margin-top-5 fade-in\">\n <p>Taking longer than expected?</p>\n <button\n type=\"button\"\n className=\"button has-margin-top-8\"\n onClick={onCancelLookup}\n >\n Cancel\n </button>\n </div>\n )}\n </div>\n </div>\n </LookupNotificationContext.Provider>\n )\n}\n\nexport default function LookupNotification(props: Props) {\n if (props.element.isDataLookup || props.element.isElementLookup) {\n return <LookupNotificationComponent {...props} />\n }\n\n return <>{props.children}</>\n}\n\nasync function fetchLookup(\n formElementLookup: formService.FormElementLookupResult | undefined,\n payload: FetchLookupPayload,\n abortSignal: AbortSignal,\n): Promise<\n | SubmissionTypes.S3SubmissionData['submission']\n | FormTypes.FormElement[]\n | undefined\n> {\n if (!formElementLookup) {\n return\n }\n\n if (formElementLookup.records) {\n const elementName = payload.element.name\n const inputValue = payload.submission[elementName]\n\n const matchingRecord = formElementLookup.records.find(\n (r) =>\n (r.inputType === 'UNDEFINED' && !inputValue) ||\n (r.inputType !== 'UNDEFINED' && r.inputValue === inputValue),\n )\n\n // insert prefill values\n return matchingRecord?.preFills.reduce<\n SubmissionTypes.S3SubmissionData['submission']\n >((lookupResult, prefill) => {\n switch (prefill.type) {\n case 'TEXT':\n lookupResult[prefill.formElementName] = prefill.text\n break\n case 'NUMBER':\n lookupResult[prefill.formElementName] = prefill.number\n break\n case 'CLEAR':\n lookupResult[prefill.formElementName] = undefined\n break\n }\n return lookupResult\n }, {})\n }\n\n if (!formElementLookup.url) {\n console.log(\n 'Could not find dynamic URL or static records for form element lookup:',\n formElementLookup,\n )\n throw new Error('Could not find element lookup configuration')\n }\n\n const headers = await generateHeaders()\n console.log(\n `Attempting a ${formElementLookup.type} lookup request to:`,\n formElementLookup.url,\n )\n const response = await fetch(formElementLookup.url, {\n method: 'POST',\n headers,\n body: JSON.stringify(payload),\n signal: abortSignal,\n })\n\n const data = await response.json()\n console.log(\n 'Response from lookup to: POST',\n formElementLookup.url,\n response.status,\n data,\n )\n\n if (!response.ok) {\n Sentry.captureException(\n new Error(`Received ${response.status} status code from lookup`),\n )\n if (response.status === 400 && data && data.message) {\n throw data.message\n }\n throw new Error('Invalid response from lookup')\n }\n\n return data as FormTypes.FormElement[]\n}\n"]}
|
@@ -8,6 +8,7 @@ import LookupButton from '../components/renderer/LookupButton';
|
|
8
8
|
import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
|
9
9
|
import useAbnLookupAuthenticationGuid from '../hooks/useAbnLookupAuthenticationGuid';
|
10
10
|
import { abnService } from '@oneblink/sdk-core';
|
11
|
+
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
11
12
|
function FormElementABN({ id, element, value, onChange, validationMessage, displayValidationMessage, isDirty, setIsDirty, }) {
|
12
13
|
const abnLookupAuthenticationGuid = useAbnLookupAuthenticationGuid();
|
13
14
|
const [label, setLabel] = React.useState(value ? abnService.getABNNumberFromABNRecord(value) || '' : '');
|
@@ -125,6 +126,12 @@ function FormElementABN({ id, element, value, onChange, validationMessage, displ
|
|
125
126
|
}
|
126
127
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
127
128
|
}, [value]);
|
129
|
+
const { isLookingUp } = React.useContext(LookupNotificationContext);
|
130
|
+
const isDisplayingValidationMessage = (((isDirty || displayValidationMessage) &&
|
131
|
+
!!validationMessage &&
|
132
|
+
!isLoading) ||
|
133
|
+
error) &&
|
134
|
+
!isLookingUp;
|
128
135
|
return (React.createElement("div", { className: "cypress-abn-element" },
|
129
136
|
React.createElement(FormElementLabelContainer, { className: "ob-abn", id: id, element: element, required: element.required },
|
130
137
|
React.createElement("div", { className: "field has-addons" },
|
@@ -147,10 +154,7 @@ function FormElementABN({ id, element, value, onChange, validationMessage, displ
|
|
147
154
|
!!element.readOnly && !!value && (React.createElement("div", { className: "control" },
|
148
155
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: label }))),
|
149
156
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton })),
|
150
|
-
((
|
151
|
-
!!validationMessage &&
|
152
|
-
!isLoading) ||
|
153
|
-
error) && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
|
157
|
+
isDisplayingValidationMessage && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
|
154
158
|
React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, (error === null || error === void 0 ? void 0 : error.message) || validationMessage))))));
|
155
159
|
}
|
156
160
|
export default React.memo(FormElementABN);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementABN.js","sourceRoot":"","sources":["../../src/form-elements/FormElementABN.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport InputMask from 'react-input-mask'\nimport { parseString } from 'xml2js'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useAbnLookupAuthenticationGuid from '../hooks/useAbnLookupAuthenticationGuid'\nimport { abnService } from '@oneblink/sdk-core'\ntype Props = {\n id: string\n element: FormTypes.ABNElement\n value: MiscTypes.ABNRecord | undefined\n onChange: FormElementValueChangeHandler<MiscTypes.ABNRecord>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementABN({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const abnLookupAuthenticationGuid = useAbnLookupAuthenticationGuid()\n const [label, setLabel] = React.useState(\n value ? abnService.getABNNumberFromABNRecord(value) || '' : '',\n )\n const [isFocused, setIsFocused, removeFocus] = useBooleanState(false)\n const [{ isLoading, error }, setState] = React.useState<{\n isLoading: boolean\n error: Error | null\n }>({\n isLoading: false,\n error: null,\n })\n\n React.useEffect(() => {\n const searchString = label.replace(/[^\\d]/g, '')\n const isSearchStringValid =\n searchString.length === 11 || (searchString.length === 9 && !isFocused)\n\n const currentABNNumber = value\n ? abnService.getABNNumberFromABNRecord(value)\n : ''\n if (!isSearchStringValid || currentABNNumber === searchString) {\n return\n }\n\n setState({\n isLoading: true,\n error: null,\n })\n\n const abortController = new AbortController()\n const fetchRecord = async () => {\n try {\n const urlSearchParams = new URLSearchParams()\n urlSearchParams.append('searchString', searchString)\n urlSearchParams.append('includeHistoricalDetails', 'N')\n if (abnLookupAuthenticationGuid) {\n urlSearchParams.append(\n 'authenticationGuid',\n abnLookupAuthenticationGuid,\n )\n }\n\n const url =\n searchString.length === 11\n ? 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByABNv202001'\n : 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByASICv201408'\n const response = await fetch(`${url}?${urlSearchParams.toString()}`, {\n mode: 'cors',\n signal: abortController.signal,\n })\n const text = await response.text()\n if (!response.ok) {\n throw new Error(text)\n }\n\n const result = await new Promise<{\n ABRPayloadSearchResults: {\n response: {\n businessEntity201408?: MiscTypes.ABNRecord\n businessEntity202001: MiscTypes.ABNRecord\n exception?: {\n exceptionDescription: string\n exceptionCode: string\n }\n }\n }\n }>((resolve, reject) => {\n parseString(\n text,\n {\n explicitArray: false,\n },\n (err, result) => {\n if (err) {\n reject(err)\n } else {\n resolve(result)\n }\n },\n )\n })\n if (result.ABRPayloadSearchResults.response.exception) {\n throw new Error(\n result.ABRPayloadSearchResults.response.exception.exceptionDescription,\n )\n }\n\n if (result.ABRPayloadSearchResults.response.businessEntity201408) {\n result.ABRPayloadSearchResults.response.businessEntity202001 =\n result.ABRPayloadSearchResults.response.businessEntity201408\n }\n\n if (\n !Array.isArray(\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n )\n ) {\n result.ABRPayloadSearchResults.response.businessEntity202001.businessName =\n [\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n ]\n }\n\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: result.ABRPayloadSearchResults.response.businessEntity202001,\n })\n setState({\n isLoading: false,\n error: null,\n })\n }\n } catch (err) {\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n error: err as Error,\n })\n }\n }\n }\n\n fetchRecord()\n\n return () => {\n abortController.abort()\n }\n }, [abnLookupAuthenticationGuid, element, isFocused, label, onChange, value])\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = abnService.getABNNumberFromABNRecord(value)\n if (!newLabel) {\n // Record in value had no ABN Number. This should never happen\n return\n }\n if (label !== newLabel) {\n setLabel(\n newLabel.split('').reduce((memo, character, index) => {\n switch (index) {\n case 2:\n case 5:\n case 8: {\n return `${memo} ${character}`\n }\n default: {\n return `${memo}${character}`\n }\n }\n }, ''),\n )\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-abn-element\">\n <FormElementLabelContainer\n className=\"ob-abn\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask={isFocused || value ? '99 999 999 999' : '999 999 999'}\n maskChar=\" \"\n type=\"text\"\n id={id}\n name={element.name}\n className=\"input ob-input cypress-abn-control\"\n placeholder={element.placeholderValue}\n value={label}\n onChange={(e) => {\n setLabel(e.target.value)\n if (value) {\n onChange(element, {\n value: undefined,\n })\n }\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n setIsDirty()\n removeFocus()\n }}\n onFocus={setIsFocused}\n />\n </div>\n {value && (\n <div className=\"control ob-abn__record-control\">\n <a className=\"button is-static ob-abn__record-button\">\n {abnService.displayBusinessNameFromABNRecord(value)}\n </a>\n </div>\n )}\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={label}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {(((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n error) && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {error?.message || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementABN)\n"]}
|
1
|
+
{"version":3,"file":"FormElementABN.js","sourceRoot":"","sources":["../../src/form-elements/FormElementABN.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport InputMask from 'react-input-mask'\nimport { parseString } from 'xml2js'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useAbnLookupAuthenticationGuid from '../hooks/useAbnLookupAuthenticationGuid'\nimport { abnService } from '@oneblink/sdk-core'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\ntype Props = {\n id: string\n element: FormTypes.ABNElement\n value: MiscTypes.ABNRecord | undefined\n onChange: FormElementValueChangeHandler<MiscTypes.ABNRecord>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementABN({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const abnLookupAuthenticationGuid = useAbnLookupAuthenticationGuid()\n const [label, setLabel] = React.useState(\n value ? abnService.getABNNumberFromABNRecord(value) || '' : '',\n )\n const [isFocused, setIsFocused, removeFocus] = useBooleanState(false)\n const [{ isLoading, error }, setState] = React.useState<{\n isLoading: boolean\n error: Error | null\n }>({\n isLoading: false,\n error: null,\n })\n\n React.useEffect(() => {\n const searchString = label.replace(/[^\\d]/g, '')\n const isSearchStringValid =\n searchString.length === 11 || (searchString.length === 9 && !isFocused)\n\n const currentABNNumber = value\n ? abnService.getABNNumberFromABNRecord(value)\n : ''\n if (!isSearchStringValid || currentABNNumber === searchString) {\n return\n }\n\n setState({\n isLoading: true,\n error: null,\n })\n\n const abortController = new AbortController()\n const fetchRecord = async () => {\n try {\n const urlSearchParams = new URLSearchParams()\n urlSearchParams.append('searchString', searchString)\n urlSearchParams.append('includeHistoricalDetails', 'N')\n if (abnLookupAuthenticationGuid) {\n urlSearchParams.append(\n 'authenticationGuid',\n abnLookupAuthenticationGuid,\n )\n }\n\n const url =\n searchString.length === 11\n ? 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByABNv202001'\n : 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByASICv201408'\n const response = await fetch(`${url}?${urlSearchParams.toString()}`, {\n mode: 'cors',\n signal: abortController.signal,\n })\n const text = await response.text()\n if (!response.ok) {\n throw new Error(text)\n }\n\n const result = await new Promise<{\n ABRPayloadSearchResults: {\n response: {\n businessEntity201408?: MiscTypes.ABNRecord\n businessEntity202001: MiscTypes.ABNRecord\n exception?: {\n exceptionDescription: string\n exceptionCode: string\n }\n }\n }\n }>((resolve, reject) => {\n parseString(\n text,\n {\n explicitArray: false,\n },\n (err, result) => {\n if (err) {\n reject(err)\n } else {\n resolve(result)\n }\n },\n )\n })\n if (result.ABRPayloadSearchResults.response.exception) {\n throw new Error(\n result.ABRPayloadSearchResults.response.exception.exceptionDescription,\n )\n }\n\n if (result.ABRPayloadSearchResults.response.businessEntity201408) {\n result.ABRPayloadSearchResults.response.businessEntity202001 =\n result.ABRPayloadSearchResults.response.businessEntity201408\n }\n\n if (\n !Array.isArray(\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n )\n ) {\n result.ABRPayloadSearchResults.response.businessEntity202001.businessName =\n [\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n ]\n }\n\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: result.ABRPayloadSearchResults.response.businessEntity202001,\n })\n setState({\n isLoading: false,\n error: null,\n })\n }\n } catch (err) {\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n error: err as Error,\n })\n }\n }\n }\n\n fetchRecord()\n\n return () => {\n abortController.abort()\n }\n }, [abnLookupAuthenticationGuid, element, isFocused, label, onChange, value])\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = abnService.getABNNumberFromABNRecord(value)\n if (!newLabel) {\n // Record in value had no ABN Number. This should never happen\n return\n }\n if (label !== newLabel) {\n setLabel(\n newLabel.split('').reduce((memo, character, index) => {\n switch (index) {\n case 2:\n case 5:\n case 8: {\n return `${memo} ${character}`\n }\n default: {\n return `${memo}${character}`\n }\n }\n }, ''),\n )\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n error) &&\n !isLookingUp\n\n return (\n <div className=\"cypress-abn-element\">\n <FormElementLabelContainer\n className=\"ob-abn\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask={isFocused || value ? '99 999 999 999' : '999 999 999'}\n maskChar=\" \"\n type=\"text\"\n id={id}\n name={element.name}\n className=\"input ob-input cypress-abn-control\"\n placeholder={element.placeholderValue}\n value={label}\n onChange={(e) => {\n setLabel(e.target.value)\n if (value) {\n onChange(element, {\n value: undefined,\n })\n }\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n setIsDirty()\n removeFocus()\n }}\n onFocus={setIsFocused}\n />\n </div>\n {value && (\n <div className=\"control ob-abn__record-control\">\n <a className=\"button is-static ob-abn__record-button\">\n {abnService.displayBusinessNameFromABNRecord(value)}\n </a>\n </div>\n )}\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={label}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {isDisplayingValidationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {error?.message || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementABN)\n"]}
|
@@ -5,6 +5,7 @@ import CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'
|
|
5
5
|
import LookupButton from '../components/renderer/LookupButton';
|
6
6
|
import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
|
7
7
|
import { formService } from '@oneblink/apps';
|
8
|
+
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
8
9
|
function FormElementBSB({ id, formId, element, value, onChange, validationMessage, displayValidationMessage, isDirty, setIsDirty, }) {
|
9
10
|
const [text, setText] = React.useState(typeof value === 'string' ? value : '');
|
10
11
|
const isValidFormat = /\d{3}-\d{3}/.test(text);
|
@@ -71,6 +72,12 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
|
|
71
72
|
abortController.abort();
|
72
73
|
};
|
73
74
|
}, [formId, isValidFormat, text, onChange, element]);
|
75
|
+
const { isLookingUp } = React.useContext(LookupNotificationContext);
|
76
|
+
const isDisplayingValidationMessage = (((isDirty || displayValidationMessage) &&
|
77
|
+
!!validationMessage &&
|
78
|
+
!isLoading) ||
|
79
|
+
errorMessage) &&
|
80
|
+
!isLookingUp;
|
74
81
|
return (React.createElement("div", { className: "cypress-bsb-element" },
|
75
82
|
React.createElement(FormElementLabelContainer, { className: "ob-bsb", id: id, element: element, required: element.required },
|
76
83
|
React.createElement("div", { className: "field has-addons" },
|
@@ -95,10 +102,7 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
|
|
95
102
|
!!element.readOnly && !!value && (React.createElement("div", { className: "control" },
|
96
103
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
97
104
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton })),
|
98
|
-
((
|
99
|
-
!!validationMessage &&
|
100
|
-
!isLoading) ||
|
101
|
-
errorMessage) && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
|
105
|
+
isDisplayingValidationMessage && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
|
102
106
|
React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, errorMessage || validationMessage))))));
|
103
107
|
}
|
104
108
|
export default React.memo(FormElementBSB);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementBSB.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBSB.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,SAAS,MAAM,kBAAkB,CAAA;AACxC,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;
|
1
|
+
{"version":3,"file":"FormElementBSB.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBSB.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport InputMask from 'react-input-mask'\nimport clsx from 'clsx'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { formService } from '@oneblink/apps'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\n\ntype Props = {\n id: string\n formId: number\n element: FormTypes.BSBElement\n value: unknown\n onChange: FormElementValueChangeHandler<\n string | { isInvalid: boolean; isValidating: boolean }\n >\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementBSB({\n id,\n formId,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [text, setText] = React.useState(typeof value === 'string' ? value : '')\n const isValidFormat = /\\d{3}-\\d{3}/.test(text)\n\n const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState<{\n isLoading: boolean\n errorMessage: string | null\n bsbRecord: MiscTypes.BSBRecord | null\n }>({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n\n React.useEffect(() => {\n if (bsbRecord) {\n onChange(element, {\n value: bsbRecord.bsb,\n })\n }\n }, [bsbRecord, element, onChange, value])\n\n React.useEffect(() => {\n if (text === '') {\n return\n }\n\n if (!isValidFormat) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n return\n }\n\n setState({\n isLoading: true,\n errorMessage: null,\n bsbRecord: null,\n })\n\n const abortController = new AbortController()\n const getBSBRecord = async () => {\n onChange(element, {\n value: { isValidating: true, isInvalid: false },\n })\n try {\n const bsbRecord = await formService.getBSBRecord(\n formId,\n text,\n abortController.signal,\n )\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord,\n })\n }\n } catch (error) {\n console.warn('Error validating BSB number', error)\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: { isInvalid: true, isValidating: false },\n })\n setState({\n isLoading: false,\n errorMessage: `The BSB number \"${text}\" does not exist`,\n bsbRecord: null,\n })\n }\n }\n }\n\n getBSBRecord()\n\n return () => {\n abortController.abort()\n }\n }, [formId, isValidFormat, text, onChange, element])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n errorMessage) &&\n !isLookingUp\n\n return (\n <div className=\"cypress-bsb-element\">\n <FormElementLabelContainer\n className=\"ob-bsb\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask=\"999-999\"\n maskChar=\"x\"\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-bsb-control\"\n value={text}\n onChange={(e) => {\n setText(e.target.value)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n if (text === 'xxx-xxx') {\n onChange(element, {\n value: undefined,\n })\n }\n setIsDirty()\n }}\n />\n </div>\n {bsbRecord && (\n <div className=\"control ob-bsb__record-control\">\n <a className=\"button is-static ob-bsb__record-button\">\n {bsbRecord.financialInstitutionMnemonic} - {bsbRecord.name}\n </a>\n </div>\n )}\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {isDisplayingValidationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {errorMessage || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBSB)\n"]}
|
@@ -8,7 +8,7 @@ import useBooleanState from '../hooks/useBooleanState';
|
|
8
8
|
import LookupButton from '../components/renderer/LookupButton';
|
9
9
|
import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
|
10
10
|
import { Sentry } from '@oneblink/apps';
|
11
|
-
import useLookupNotification from '../hooks/useLookupNotification';
|
11
|
+
import useLookupNotification, { LookupNotificationContext, } from '../hooks/useLookupNotification';
|
12
12
|
const MS_BETWEEN_IMAGE_PROCESSING = 10;
|
13
13
|
const fadedSquareWidthInPixels = 200;
|
14
14
|
const fadedSquareHeightInPixels = 150;
|
@@ -48,6 +48,8 @@ function FormElementBarcodeScanner({ id, element, value, onChange, validationMes
|
|
48
48
|
startBarcodeScanner();
|
49
49
|
}
|
50
50
|
}, [handleScan, startBarcodeScanner]);
|
51
|
+
const { isLookingUp } = React.useContext(LookupNotificationContext);
|
52
|
+
const isDisplayingValidationMessage = (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp;
|
51
53
|
const text = typeof value === 'string' ? value : '';
|
52
54
|
return (React.createElement("div", { className: "cypress-barcode-scanner-element" },
|
53
55
|
React.createElement(FormElementLabelContainer, { className: "ob-barcode-scanner", element: element, id: id, required: element.required },
|
@@ -68,7 +70,7 @@ function FormElementBarcodeScanner({ id, element, value, onChange, validationMes
|
|
68
70
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
69
71
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton })),
|
70
72
|
React.createElement("button", { type: "button", className: "button ob-button ob-button__open is-primary cypress-start-scan-barcode-button", disabled: element.readOnly, onClick: openBarcodeScanner }, "Scan Barcode"))),
|
71
|
-
|
73
|
+
isDisplayingValidationMessage && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
|
72
74
|
React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, validationMessage))))));
|
73
75
|
}
|
74
76
|
export default React.memo(FormElementBarcodeScanner);
|