create-nscope-app 1.0.2 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
|
-
import { Can, useNscope } from "@nscope/react";
|
|
3
|
+
import { Can, useFormSubmissions, useNscope } from "@nscope/react";
|
|
4
|
+
import { formatOnboardingFieldValue } from "@nscope/sdk";
|
|
4
5
|
|
|
5
6
|
export function HomePage() {
|
|
6
7
|
const { authenticated, customer, login, logout } = useNscope();
|
|
8
|
+
const { submissions, loading: submissionsLoading } = useFormSubmissions();
|
|
7
9
|
|
|
8
10
|
return (
|
|
9
11
|
<main className="page">
|
|
@@ -24,6 +26,30 @@ export function HomePage() {
|
|
|
24
26
|
<p>Permissão <code>profile:list</code> concedida.</p>
|
|
25
27
|
</Can>
|
|
26
28
|
|
|
29
|
+
<section className="form-submissions">
|
|
30
|
+
<h2>Form responses</h2>
|
|
31
|
+
{submissionsLoading ? (
|
|
32
|
+
<p className="muted">Loading form responses…</p>
|
|
33
|
+
) : Object.keys(submissions).length === 0 ? (
|
|
34
|
+
<p className="muted">No form responses yet.</p>
|
|
35
|
+
) : (
|
|
36
|
+
Object.entries(submissions).map(([formId, submission]) => (
|
|
37
|
+
<article key={formId} className="form-submission-card">
|
|
38
|
+
<h3>{formId}</h3>
|
|
39
|
+
<p className="muted">{submission.submittedAt}</p>
|
|
40
|
+
<dl>
|
|
41
|
+
{(submission.fields ?? []).map((field) => (
|
|
42
|
+
<div key={field.id}>
|
|
43
|
+
<dt>{field.label}</dt>
|
|
44
|
+
<dd>{formatOnboardingFieldValue(field.value)}</dd>
|
|
45
|
+
</div>
|
|
46
|
+
))}
|
|
47
|
+
</dl>
|
|
48
|
+
</article>
|
|
49
|
+
))
|
|
50
|
+
)}
|
|
51
|
+
</section>
|
|
52
|
+
|
|
27
53
|
<button type="button" onClick={() => logout()}>
|
|
28
54
|
Sign out
|
|
29
55
|
</button>
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
import { Can, useNscope } from "@nscope/react";
|
|
1
|
+
import { Can, useFormSubmissions, useNscope } from "@nscope/react";
|
|
2
|
+
import { formatOnboardingFieldValue } from "@nscope/sdk";
|
|
2
3
|
|
|
3
4
|
export default function App() {
|
|
4
5
|
const { authenticated, customer, login, logout } = useNscope();
|
|
6
|
+
const { submissions, loading: submissionsLoading } = useFormSubmissions();
|
|
5
7
|
|
|
6
8
|
return (
|
|
7
9
|
<main className="page">
|
|
@@ -22,6 +24,30 @@ export default function App() {
|
|
|
22
24
|
<p>Permissão <code>profile:list</code> concedida.</p>
|
|
23
25
|
</Can>
|
|
24
26
|
|
|
27
|
+
<section className="form-submissions">
|
|
28
|
+
<h2>Form responses</h2>
|
|
29
|
+
{submissionsLoading ? (
|
|
30
|
+
<p className="muted">Loading form responses…</p>
|
|
31
|
+
) : Object.keys(submissions).length === 0 ? (
|
|
32
|
+
<p className="muted">No form responses yet.</p>
|
|
33
|
+
) : (
|
|
34
|
+
Object.entries(submissions).map(([formId, submission]) => (
|
|
35
|
+
<article key={formId} className="form-submission-card">
|
|
36
|
+
<h3>{formId}</h3>
|
|
37
|
+
<p className="muted">{submission.submittedAt}</p>
|
|
38
|
+
<dl>
|
|
39
|
+
{(submission.fields ?? []).map((field) => (
|
|
40
|
+
<div key={field.id}>
|
|
41
|
+
<dt>{field.label}</dt>
|
|
42
|
+
<dd>{formatOnboardingFieldValue(field.value)}</dd>
|
|
43
|
+
</div>
|
|
44
|
+
))}
|
|
45
|
+
</dl>
|
|
46
|
+
</article>
|
|
47
|
+
))
|
|
48
|
+
)}
|
|
49
|
+
</section>
|
|
50
|
+
|
|
25
51
|
<button type="button" onClick={() => logout()}>
|
|
26
52
|
Sign out
|
|
27
53
|
</button>
|