Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

ON-42474 # add form not published message #256

Merged
merged 2 commits into from
Aug 7, 2024
Merged

ON-42474 # add form not published message #256

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0b27f1d
ON-42474 # add form not published message
divporter Aug 6, 2024
fbbe527
ON-42474 # stop useState, useEffect bad habit
divporter Aug 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 40 additions & 1 deletion src/form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import {
OneBlinkAppsError,
} from '@oneblink/apps'
import { OneBlinkForm, useLoadDataState } from '@oneblink/apps-react'
import sanitizeHtml from '@oneblink/apps-react/dist/services/sanitize-html'
import OnLoading from '@oneblink/apps-react/dist/components/renderer/OnLoading'
import { useHistory } from 'react-router-dom'
import ErrorModal from './ErrorModal'
Expand All @@ -28,6 +29,11 @@ const formIsSubmittingContainerStyles: React.CSSProperties = {
opacity: 0.7,
}

const defaultUnpublishedHTML = `
<p style="font-size:1.5em">Form Unavailable</p>
<p>This form is currently unpublished.</p>
`

function Form({
formId,
formsAppId,
Expand Down Expand Up @@ -143,6 +149,28 @@ function Form({
}
}, [isSubmitting])

const [form, formsAppConfiguration] = React.useMemo(() => {
if (state.status === 'SUCCESS') {
return state.result
}
return []
}, [state])

const formNotPublishedError = React.useMemo(() => {
if (!form) {
return
}
const startDate = form.publishStartDate
? new Date(form.publishStartDate)
: null
const endDate = form.publishEndDate ? new Date(form.publishEndDate) : null
const now = new Date()
// If now is before startDate or after endDate
if ((startDate && now < startDate) || (endDate && now > endDate)) {
return sanitizeHtml(form.unpublishedUserMessage || defaultUnpublishedHTML)
}
}, [form])
mymattcarroll marked this conversation as resolved.
Show resolved Hide resolved

if (state.status === 'LOADING') {
return <OnLoading className="has-text-centered" small />
}
Expand All @@ -159,7 +187,18 @@ function Form({
)
}

const [form, formsAppConfiguration] = state.result
if (formNotPublishedError || !form || !formsAppConfiguration) {
return (
<div
className="ob-form-unpublished-user-message__content ql-editor"
// eslint-disable-next-line react/no-danger
dangerouslySetInnerHTML={{
__html: formNotPublishedError || defaultUnpublishedHTML,
}}
></div>
)
}

const googleMapsApiKey =
optionsGoogleMapsApiKey || formsAppConfiguration.googleMapsApiKey

Expand Down