diff --git a/src/screens/OMPSwitch/OrgSwitch.res b/src/screens/OMPSwitch/OrgSwitch.res index d18ee6c23..b50d0b4de 100644 --- a/src/screens/OMPSwitch/OrgSwitch.res +++ b/src/screens/OMPSwitch/OrgSwitch.res @@ -1,3 +1,61 @@ +module SwitchOrg = { + @react.component + let make = (~setShowModal) => { + let showToast = ToastState.useShowToast() + let showPopUp = PopUpState.useShowPopUp() + let orgSwitch = OMPSwitchHooks.useOrgSwitch() + let (value, setValue) = React.useState(() => "") + let {userInfo: {orgId}} = React.useContext(UserInfoProvider.defaultContext) + + let input = React.useMemo((): ReactFinalForm.fieldRenderPropsInput => { + { + name: "-", + onBlur: _ => (), + onChange: ev => { + let value = {ev->ReactEvent.Form.target}["value"] + if value->String.includes("") { + showPopUp({ + popUpType: (Warning, WithIcon), + heading: `Script Tags are not allowed`, + description: React.string(`Input cannot contain tags`), + handleConfirm: {text: "OK"}, + }) + } + let val = value->String.replace("", "") + setValue(_ => val) + }, + onFocus: _ => (), + value: JSON.Encode.string(value), + checked: false, + } + }, [value]) + + let switchOrg = async () => { + try { + setShowModal(_ => true) + let _ = await orgSwitch(~expectedOrgId=value, ~currentOrgId=orgId) + setShowModal(_ => false) + } catch { + | _ => showToast(~message="Failed to switch the org! Try again.", ~toastType=ToastError) + } + } + + let handleKeyUp = event => { + if event->ReactEvent.Keyboard.keyCode === 13 { + switchOrg()->ignore + } + } + + + } +} module NewOrgCreationModal = { @react.component let make = (~setShowModal, ~showModal, ~getOrgList) => { @@ -211,47 +269,52 @@ let make = () => { let customScrollStyle = "bg-blue-840 max-h-72 overflow-scroll px-1 pt-1" let dropdownContainerStyle = "min-w-[15rem] rounded" -
- generateDropdownOptions} - marginTop="mt-14" - hideMultiSelectButtons=true - addButton=false - customStyle="bg-blue-840 hover:bg-popover-background-hover rounded !w-full" - customSelectStyle="md:bg-blue-840 hover:bg-popover-background-hover rounded" - searchable=false - baseComponent={} - baseComponentCustomStyle="border-blue-820 rounded bg-popover-background rounded text-white" - bottomComponent={ - - } - optionClass="text-gray-200 text-fs-14" - selectClass="text-gray-200 text-fs-14" - customDropdownOuterClass="!border-none !w-full" - fullLength=true - toggleChevronState - customScrollStyle - dropdownContainerStyle - shouldDisplaySelectedOnTop=true - /> +
+
+ generateDropdownOptions} + marginTop="mt-14" + hideMultiSelectButtons=true + addButton=false + customStyle="bg-blue-840 hover:bg-popover-background-hover rounded !w-full" + customSelectStyle="md:bg-blue-840 hover:bg-popover-background-hover rounded" + searchable=false + baseComponent={} + baseComponentCustomStyle="border-blue-820 rounded bg-popover-background rounded text-white" + bottomComponent={ + + } + optionClass="text-gray-200 text-fs-14" + selectClass="text-gray-200 text-fs-14" + customDropdownOuterClass="!border-none !w-full" + fullLength=true + toggleChevronState + customScrollStyle + dropdownContainerStyle + shouldDisplaySelectedOnTop=true + /> + Array.length > 20}> + + +