1
0
ohmyform/ui/pages/form/[id]/index.tsx
Michael Schramm 9c4c325e5a
Switch to single branch (#221)
* remove submodules
* add api and ui files
* update github actions
* use sparse checkout
* update node setup
* update checkout
* update docker
* change permissions
* update mariadb health check
* update changelog
2023-12-02 19:22:40 +01:00

56 lines
1.5 KiB
TypeScript

import { ErrorPage } from 'components/error.page'
import { LoadingPage } from 'components/loading.page'
import { NextPage } from 'next'
import { useRouter } from 'next/router'
import React, { useEffect } from 'react'
import { useTranslation } from 'react-i18next'
import { CardLayout } from '../../../components/form/layouts/card'
import { SliderLayout } from '../../../components/form/layouts/slider'
import { useSubmission } from '../../../components/use.submission'
import { useFormPublicQuery } from '../../../graphql/query/form.public.query'
const Index: NextPage = () => {
const { t, i18n } = useTranslation()
const router = useRouter()
const submission = useSubmission(router.query.id as string)
const { loading, data, error } = useFormPublicQuery({
variables: {
id: router.query.id as string,
},
})
useEffect(() => {
// check form language to switch to!
if (!data) {
return
}
if (i18n.language !== data.form.language) {
// TODO prompt for language change if is not a match!
i18n
.changeLanguage(data.form.language)
.catch((e: Error) => console.error('failed to change language', e))
}
}, [data])
if (loading) {
return <LoadingPage message={t('form:build')} />
}
if (error) {
return <ErrorPage />
}
switch (data.form.design.layout) {
case 'card':
return <CardLayout form={data.form} submission={submission} />
case 'slider':
default:
return <SliderLayout form={data.form} submission={submission} />
}
}
export default Index