Skip to content

Commit aacf674

Browse files
alicanerdurmazalicanerdurmaz
authored
fix: live preview examples (#6766)
1 parent cb85e0b commit aacf674

File tree

9 files changed

+270
-154
lines changed

9 files changed

+270
-154
lines changed

‎documentation/docs/packages/react-hook-form/use-form/index.md

+87-39
Original file line numberDiff line numberDiff line change
@@ -351,19 +351,35 @@ const PostCreatePage: React.FC = () => {
351351
};
352352
// visible-block-end
353353

354-
setRefineProps({
355-
Layout: (props) => <Layout {...props} />,
356-
resources: [
357-
{
358-
name: "posts",
359-
list: PostList,
360-
create: PostCreatePage,
361-
edit: PostEdit,
362-
},
363-
],
364-
});
365-
366-
render(<RefineHeadlessDemo />);
354+
render(
355+
<ReactRouter.BrowserRouter>
356+
<RefineHeadlessDemo
357+
resources={[
358+
{
359+
name: "posts",
360+
list: "/posts",
361+
create: "/posts/create",
362+
edit: "/posts/edit/:id",
363+
},
364+
]}
365+
>
366+
<ReactRouter.Routes>
367+
<ReactRouter.Route
368+
path="/posts"
369+
element={
370+
<Layout>
371+
<ReactRouter.Outlet />
372+
</Layout>
373+
}
374+
>
375+
<ReactRouter.Route index element={<PostList />} />
376+
<ReactRouter.Route path="create" element={<PostCreate />} />
377+
<ReactRouter.Route path="edit/:id" element={<PostEdit />} />
378+
</ReactRouter.Route>
379+
</ReactRouter.Routes>
380+
</RefineHeadlessDemo>
381+
</ReactRouter.BrowserRouter>,
382+
);
367383
```
368384

369385
</TabItem>
@@ -419,19 +435,35 @@ const PostEditPage: React.FC = () => {
419435
};
420436
// visible-block-end
421437

422-
setRefineProps({
423-
Layout: (props) => <Layout {...props} />,
424-
resources: [
425-
{
426-
name: "posts",
427-
list: PostList,
428-
create: PostCreate,
429-
edit: PostEditPage,
430-
},
431-
],
432-
});
433-
434-
render(<RefineHeadlessDemo />);
438+
render(
439+
<ReactRouter.BrowserRouter>
440+
<RefineHeadlessDemo
441+
resources={[
442+
{
443+
name: "posts",
444+
list: "/posts",
445+
create: "/posts/create",
446+
edit: "/posts/edit/:id",
447+
},
448+
]}
449+
>
450+
<ReactRouter.Routes>
451+
<ReactRouter.Route
452+
path="/posts"
453+
element={
454+
<Layout>
455+
<ReactRouter.Outlet />
456+
</Layout>
457+
}
458+
>
459+
<ReactRouter.Route index element={<PostList />} />
460+
<ReactRouter.Route path="create" element={<PostCreate />} />
461+
<ReactRouter.Route path="edit/:id" element={<PostEdit />} />
462+
</ReactRouter.Route>
463+
</ReactRouter.Routes>
464+
</RefineHeadlessDemo>
465+
</ReactRouter.BrowserRouter>,
466+
);
435467
```
436468

437469
</TabItem>
@@ -490,19 +522,35 @@ const PostCreatePage: React.FC = () => {
490522
};
491523
// visible-block-end
492524

493-
setRefineProps({
494-
Layout: (props) => <Layout {...props} />,
495-
resources: [
496-
{
497-
name: "posts",
498-
list: PostList,
499-
create: PostCreatePage,
500-
edit: PostEdit,
501-
},
502-
],
503-
});
504-
505-
render(<RefineHeadlessDemo />);
525+
render(
526+
<ReactRouter.BrowserRouter>
527+
<RefineHeadlessDemo
528+
resources={[
529+
{
530+
name: "posts",
531+
list: "/posts",
532+
create: "/posts/create",
533+
edit: "/posts/edit/:id",
534+
},
535+
]}
536+
>
537+
<ReactRouter.Routes>
538+
<ReactRouter.Route
539+
path="/posts"
540+
element={
541+
<Layout>
542+
<ReactRouter.Outlet />
543+
</Layout>
544+
}
545+
>
546+
<ReactRouter.Route index element={<PostList />} />
547+
<ReactRouter.Route path="create" element={<PostCreate />} />
548+
<ReactRouter.Route path="edit/:id" element={<PostEdit />} />
549+
</ReactRouter.Route>
550+
</ReactRouter.Routes>
551+
</RefineHeadlessDemo>
552+
</ReactRouter.BrowserRouter>,
553+
);
506554
```
507555

508556
</TabItem>

‎documentation/docs/packages/react-hook-form/use-modal-form/index.md

+48-30
Original file line numberDiff line numberDiff line change
@@ -206,16 +206,22 @@ export interface IPost {
206206
}
207207
// visible-block-end
208208

209-
setRefineProps({
210-
resources: [
211-
{
212-
name: "posts",
213-
list: PostList,
214-
},
215-
],
216-
});
217-
218-
render(<RefineHeadlessDemo />);
209+
render(
210+
<ReactRouter.BrowserRouter>
211+
<RefineHeadlessDemo
212+
resources={[
213+
{
214+
name: "posts",
215+
list: "/posts",
216+
},
217+
]}
218+
>
219+
<ReactRouter.Routes>
220+
<ReactRouter.Route path="/posts" element={<PostList />} />
221+
</ReactRouter.Routes>
222+
</RefineHeadlessDemo>
223+
</ReactRouter.BrowserRouter>,
224+
);
219225
```
220226

221227
</TabItem>
@@ -325,16 +331,22 @@ export interface IPost {
325331
}
326332
// visible-block-end
327333

328-
setRefineProps({
329-
resources: [
330-
{
331-
name: "posts",
332-
list: PostList,
333-
},
334-
],
335-
});
336-
337-
render(<RefineHeadlessDemo />);
334+
render(
335+
<ReactRouter.BrowserRouter>
336+
<RefineHeadlessDemo
337+
resources={[
338+
{
339+
name: "posts",
340+
list: "/posts",
341+
},
342+
]}
343+
>
344+
<ReactRouter.Routes>
345+
<ReactRouter.Route path="/posts" element={<PostList />} />
346+
</ReactRouter.Routes>
347+
</RefineHeadlessDemo>
348+
</ReactRouter.BrowserRouter>,
349+
);
338350
```
339351

340352
:::simple Implementation Tips
@@ -460,16 +472,22 @@ export interface IPost {
460472
}
461473
// visible-block-end
462474

463-
setRefineProps({
464-
resources: [
465-
{
466-
name: "posts",
467-
list: PostList,
468-
},
469-
],
470-
});
471-
472-
render(<RefineHeadlessDemo />);
475+
render(
476+
<ReactRouter.BrowserRouter>
477+
<RefineHeadlessDemo
478+
resources={[
479+
{
480+
name: "posts",
481+
list: "/posts",
482+
},
483+
]}
484+
>
485+
<ReactRouter.Routes>
486+
<ReactRouter.Route path="/posts" element={<PostList />} />
487+
</ReactRouter.Routes>
488+
</RefineHeadlessDemo>
489+
</ReactRouter.BrowserRouter>,
490+
);
473491
```
474492

475493
:::simple Implementation Tips

‎documentation/docs/packages/react-hook-form/use-steps-form/index.md

+40-24
Original file line numberDiff line numberDiff line change
@@ -491,18 +491,26 @@ interface IPost {
491491
}
492492
// visible-block-end
493493

494-
setRefineProps({
495-
resources: [
496-
{
497-
name: "posts",
498-
list: PostList,
499-
create: PostCreatePage,
500-
edit: PostEdit,
501-
},
502-
],
503-
});
504-
505-
render(<RefineHeadlessDemo />);
494+
render(
495+
<ReactRouter.BrowserRouter>
496+
<RefineHeadlessDemo
497+
resources={[
498+
{
499+
name: "posts",
500+
list: "/posts",
501+
create: "/posts/create",
502+
edit: "/posts/edit/:id",
503+
},
504+
]}
505+
>
506+
<ReactRouter.Routes>
507+
<ReactRouter.Route path="/posts" element={<PostList />} />
508+
<ReactRouter.Route path="/posts/create" element={<PostCreate />} />
509+
<ReactRouter.Route path="/posts/edit/:id" element={<PostEdit />} />
510+
</ReactRouter.Routes>
511+
</RefineHeadlessDemo>
512+
</ReactRouter.BrowserRouter>,
513+
);
506514
```
507515

508516
</TabItem>
@@ -655,18 +663,26 @@ interface IPost {
655663
}
656664
// visible-block-end
657665

658-
setRefineProps({
659-
resources: [
660-
{
661-
name: "posts",
662-
list: PostList,
663-
create: PostCreate,
664-
edit: PostEditPage,
665-
},
666-
],
667-
});
668-
669-
render(<RefineHeadlessDemo />);
666+
render(
667+
<ReactRouter.BrowserRouter>
668+
<RefineHeadlessDemo
669+
resources={[
670+
{
671+
name: "posts",
672+
list: "/posts",
673+
create: "/posts/create",
674+
edit: "/posts/edit/:id",
675+
},
676+
]}
677+
>
678+
<ReactRouter.Routes>
679+
<ReactRouter.Route path="/posts" element={<PostList />} />
680+
<ReactRouter.Route path="/posts/create" element={<PostCreate />} />
681+
<ReactRouter.Route path="/posts/edit/:id" element={<PostEdit />} />
682+
</ReactRouter.Routes>
683+
</RefineHeadlessDemo>
684+
</ReactRouter.BrowserRouter>,
685+
);
670686
```
671687

672688
</TabItem>

‎documentation/docs/packages/tanstack-table/examples/_partial-basic-usage-live-preview.md

+16-10
Original file line numberDiff line numberDiff line change
@@ -89,14 +89,20 @@ const PostList: React.FC = () => {
8989
};
9090
// visible-block-end
9191

92-
setRefineProps({
93-
resources: [
94-
{
95-
name: "posts",
96-
list: PostList,
97-
},
98-
],
99-
});
100-
101-
render(<RefineHeadlessDemo />);
92+
render(
93+
<ReactRouter.BrowserRouter>
94+
<RefineHeadlessDemo
95+
resources={[
96+
{
97+
name: "posts",
98+
list: "/posts",
99+
},
100+
]}
101+
>
102+
<ReactRouter.Routes>
103+
<ReactRouter.Route path="/posts" element={<PostList />} />
104+
</ReactRouter.Routes>
105+
</RefineHeadlessDemo>
106+
</ReactRouter.BrowserRouter>,
107+
);
102108
```

‎documentation/docs/packages/tanstack-table/examples/_partial-filtering-live-preview.md

+16-10
Original file line numberDiff line numberDiff line change
@@ -125,14 +125,20 @@ const PostList: React.FC = () => {
125125

126126
// visible-block-end
127127

128-
setRefineProps({
129-
resources: [
130-
{
131-
name: "posts",
132-
list: PostList,
133-
},
134-
],
135-
});
136-
137-
render(<RefineHeadlessDemo />);
128+
render(
129+
<ReactRouter.BrowserRouter>
130+
<RefineHeadlessDemo
131+
resources={[
132+
{
133+
name: "posts",
134+
list: "/posts",
135+
},
136+
]}
137+
>
138+
<ReactRouter.Routes>
139+
<ReactRouter.Route path="/posts" element={<PostList />} />
140+
</ReactRouter.Routes>
141+
</RefineHeadlessDemo>
142+
</ReactRouter.BrowserRouter>,
143+
);
138144
```

0 commit comments

Comments
 (0)