import { observer, useField } from '@nocobase/schema'; import { useAPIClient, useApp } from '@nocobase/client'; import { Card } from 'antd'; import React from 'react'; import { useTranslation } from 'react-i18next'; import RIframe from 'react-iframe'; import type { IIframe } from 'react-iframe/types'; import { IframeDesigner } from './Iframe.Designer'; function isNumeric(str: string | undefined) { if (typeof str !== 'string') return false; // we only process strings! return ( !isNaN(str as any) && // use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)... !isNaN(parseFloat(str)) ); // ...and ensure strings of whitespace fail } export const Iframe: any = observer( (props: IIframe & { html?: string; htmlId?: number; mode: string }) => { const { url, htmlId, mode = 'url', height, html, ...others } = props; const { t } = useTranslation(); const api = useAPIClient(); const field = useField(); const app = useApp(); const src = React.useMemo(() => { if (mode === 'html') { const options = app.getOptions(); const apiBaseURL: string = options?.apiClient?.['baseURL']; return `${apiBaseURL}iframeHtml:getHtml/${htmlId}?token=${api.auth.getToken()}&v=${field.data?.v || ''}`; } return url; }, [app, url, mode, htmlId, field.data?.v]); if ((mode === 'url' && !url) || (mode === 'html' && !htmlId)) { return {t('Please fill in the iframe URL')}; } return ( ); }, { displayName: 'Iframe' }, ); Iframe.Designer = IframeDesigner;