mirror of
https://github.com/formbricks/formbricks.git
synced 2026-04-28 20:49:34 -05:00
feat: build basic integration with snoop-react to post submissions to snoopHub, modify schema accordingly to support schema and submission, add basic display of submissions
This commit is contained in:
@@ -18,11 +18,11 @@ export default function FormOnboardingModal({
|
||||
formId,
|
||||
}: FormOnboardingModalProps) {
|
||||
const { form, mutateForm, isLoadingForm } = useForm(formId);
|
||||
const [title, setTitle] = useState(form.title);
|
||||
const [name, setName] = useState(form.name);
|
||||
|
||||
const submitForm = async (e) => {
|
||||
e.preventDefault();
|
||||
const updatedForm = { ...form, title, finishedOnboarding: true };
|
||||
const updatedForm = { ...form, name, finishedOnboarding: true };
|
||||
await persistForm(updatedForm);
|
||||
mutateForm(updatedForm);
|
||||
setOpen(false);
|
||||
@@ -106,11 +106,11 @@ export default function FormOnboardingModal({
|
||||
<div className="mt-1">
|
||||
<input
|
||||
type="text"
|
||||
name="title"
|
||||
name="name"
|
||||
className="block w-full border-gray-300 rounded-md shadow-sm focus:ring-red-500 focus:border-red-500 sm:text-sm"
|
||||
placeholder="My form"
|
||||
value={title}
|
||||
onChange={(e) => setTitle(e.target.value)}
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -22,7 +22,7 @@ export default function LayoutShare({ title, formId, children }) {
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
</Head>
|
||||
<div className="flex h-screen overflow-hidden bg-gray-50">
|
||||
<div className="flex min-h-screen overflow-hidden bg-gray-50">
|
||||
<div className="flex flex-col flex-1 overflow-hidden">
|
||||
<header className="w-full">
|
||||
<div className="relative z-10 flex flex-shrink-0 h-16 bg-white border-b border-gray-200 shadow-sm">
|
||||
|
||||
@@ -7,7 +7,7 @@ export default function MenuBreadcrumbs({ formId }) {
|
||||
|
||||
const pages = [
|
||||
{ name: "Forms", href: "/forms", current: false },
|
||||
{ name: form.title, href: "#", current: true },
|
||||
{ name: form.name, href: "#", current: true },
|
||||
];
|
||||
|
||||
if (isLoadingForm) {
|
||||
|
||||
@@ -0,0 +1,51 @@
|
||||
import { useForm } from "../../lib/forms";
|
||||
import Loading from "../Loading";
|
||||
|
||||
export default function Submission({ formId, submissionSession }) {
|
||||
const { form, mutateForm, isLoadingForm } = useForm(formId);
|
||||
if (isLoadingForm) {
|
||||
return <Loading />;
|
||||
}
|
||||
|
||||
// fill the schema with the values provided by the user
|
||||
const getSubmission = (submissionSession, schema) => {
|
||||
console.log("schema", JSON.stringify(schema, null, 2));
|
||||
console.log(
|
||||
"submissionSession",
|
||||
JSON.stringify(submissionSession, null, 2)
|
||||
);
|
||||
if (!schema) return {};
|
||||
const submission = { ...schema };
|
||||
for (const page of submission.pages) {
|
||||
if (page.type === "form") {
|
||||
const pageSubmission = submissionSession.submissions.find(
|
||||
(s) => s.pageName === page.name
|
||||
);
|
||||
if (typeof pageSubmission !== "undefined") {
|
||||
for (const element of page.elements) {
|
||||
if (element.type !== "submit") {
|
||||
if (element.name in pageSubmission.data) {
|
||||
element.value = pageSubmission.data[element.name];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return submission;
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-white shadow sm:rounded-lg max-w-">
|
||||
<div className="px-4 py-5 sm:p-6">
|
||||
<h3 className="text-gray-900 whitespace-pre-wrap">
|
||||
{JSON.stringify(
|
||||
getSubmission(submissionSession, form.schema),
|
||||
null,
|
||||
2
|
||||
)}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user