Options
All
  • Public
  • Public/Protected
  • All
Menu

Module "wordpress-plugins/real-cookie-banner/src/public/ts/components/config/cookies/tcf/form"

Index

Variables

Const TcfVendorConfigurationForm

TcfVendorConfigurationForm: FC<{ navigateAfterCreation?: boolean; vendor?: TcfVendor }> = observer(({ vendor, navigateAfterCreation = true }) => {const { vendorConfiguration, id, queried, fetched, link } = useRouteTcfVendorConfiguration();const history = useHistory();const [form] = Form.useForm();const [isBusy, setIsBusy] = useState(false);const [hasChanges, setHasChanges] = useState(false);const {tcfStore,optionStore: { tcfScopeOfConsent }} = useStores();const { vendorConfigurations } = tcfStore;const [useVendor, setUseVendor] = useState(vendor);const initialValues = fetched? {status: vendorConfiguration.data.status,restrictivePurposes: vendorConfiguration.restrictivePurposes,ePrivacyUSA: vendorConfiguration.data.meta.ePrivacyUSA,presetCheck: true}: {status: "publish" as PostStatus,restrictivePurposes: useVendor?.restrictivePurposes,ePrivacyUSA: 2 as typeof vendorConfiguration.data.meta.ePrivacyUSA,presetCheck: false};useEffect(() => {if (vendorConfiguration.vendorModel) {setUseVendor(vendorConfiguration.vendorModel);}}, [vendorConfiguration]);// Initially load the vendor configuration if not yet doneuseEffect(() => {if (queried && !fetched) {vendorConfigurations.getSingle({params: {id,context: "edit"}});}}, [queried, fetched]);// Scroll to top when opening the formuseEffect(() => {scrollTo(0);}, []);const handleSave = useCallback(async (values: typeof initialValues) => {const { status, restrictivePurposes, ...meta } = values;// At least one purpose must be activeconst enabled =Object.values(restrictivePurposes.normal).filter(({ enabled }) => enabled).length +useVendor.specialPurposes.length;if (enabled === 0) {message.error("You need to enable at least one purpose!");throw new Error();}try {const newMeta = {...meta,vendorId: useVendor.data.id,restrictivePurposes: JSON.stringify(restrictivePurposes)};delete newMeta.presetCheck;if (queried) {// Do not override restrictive purposes when scope is globalif (tcfScopeOfConsent === "global") {newMeta.restrictivePurposes = vendorConfiguration.data.meta.restrictivePurposes;}vendorConfiguration.setStatus(status);vendorConfiguration.setMeta(newMeta);await vendorConfiguration.patch();} else {const draft = new TcfVendorConfigurationModel(vendorConfigurations, {status,meta: {...newMeta}});await draft.persist();}setHasChanges(false);message.success(__("You successfully saved the TCF vendor configuration."));navigateAfterCreation && setTimeout(() => history.push(link.slice(1)), 0);} catch (e) {message.error(e.responseJSON.message);throw e;}},[queried, vendorConfiguration, tcfStore, useVendor, tcfScopeOfConsent]);const onFinish: ComponentProps<typeof Form>["onFinish"] = useCallback(async (values) => {setIsBusy(true);try {await handleSave(values as typeof initialValues);} catch (e) {// Silence is golden.} finally {setIsBusy(false);}},[form, handleSave]);const onFinishFailed: ComponentProps<typeof Form>["onFinishFailed"] = useCallback((errorInfo) => {message.error(__("The TCF vendor configuration could not be saved due to missing/invalid form values."));if (errorInfo.errorFields.length) {const instance = form.getFieldInstance(errorInfo.errorFields[0].name) as HTMLElement;instance.parentElement.scrollIntoView({ behavior: "smooth", block: "center" });}}, []);const handleBeforeUnload: ComponentProps<typeof Prompt>["message"] = useCallback(() => {if (!hasChanges) {return true;}return __('You have unsaved changes. If you click on "confirm", your changes will be discarded.');}, [form, initialValues]);if ((queried && !fetched) || !useVendor) {return <Skeleton active paragraph={{ rows: 8 }} />;}return (<Spin spinning={isBusy}><Prompt message={handleBeforeUnload} /><Formname={`blocker-${id}`}form={form}{...TcfVendorConfigurationFormLayout}initialValues={initialValues}onFinish={onFinish}onFinishFailed={onFinishFailed}onValuesChange={() => setHasChanges(true)}><TcfVendorConfigurationFormGeneralFields vendor={useVendor} /><TcfVendorConfigurationFormDeviceStorageFields vendor={useVendor} /><TcfVendorConfigurationFormPurposesFields vendor={useVendor} /><TcfVendorConfigurationFormFeaturesFields vendor={useVendor} />{!queried && (<Form.Itemname="presetCheck"valuePropName="checked"requiredrules={[{type: "boolean",required: true,transform: (value) => value || undefined,message: __("Please confirm that you have checked the information.")}]}wrapperCol={{ offset: TcfVendorConfigurationFormLayout.labelCol.span }}><Checkbox>{__("I have checked the information in the TCF vendor configuration myself and corrected any information that does not fit to my use case.")}{" "}<LearnMoreTagurl={__("https://devowl.io/knowledge-base/is-real-cookie-banner-legally-compliant/")}/></Checkbox></Form.Item>)}<Form.Item className="rcb-form-sticky-submit"><span><input type="submit" className="button button-primary right" value={__("Save")} /></span></Form.Item></Form></Spin>);})

Object literals

Const TcfVendorConfigurationFormLayout

TcfVendorConfigurationFormLayout: object

labelCol

labelCol: object

span

span: number = 6

wrapperCol

wrapperCol: object

span

span: number = 16

Generated using TypeDoc