Skip to content

Commit

Permalink
fix tutorial posts pages import
Browse files Browse the repository at this point in the history
  • Loading branch information
omeraplak committed Jan 11, 2022
1 parent e62eab3 commit abe25dc
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 22 deletions.
10 changes: 5 additions & 5 deletions documentation/docs/tutorial.md
Original file line number Diff line number Diff line change
Expand Up @@ -426,7 +426,7 @@ import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

// highlight-next-line
import { PostList } from "./pages";
import { PostList } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down Expand Up @@ -767,7 +767,7 @@ import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

// highlight-next-line
import { PostList, PostShow } from "./pages";
import { PostList, PostShow } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down Expand Up @@ -981,7 +981,7 @@ import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

// highlight-next-line
import { PostList, PostShow, PostEdit } from "./pages";
import { PostList, PostShow, PostEdit } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down Expand Up @@ -1224,7 +1224,7 @@ import dataProvider from "@pankod/refine-simple-rest";
import routerProvider from "@pankod/refine-react-router";

// highlight-next-line
import { PostList, PostShow, PostEdit, PostCreate } from "./pages";
import { PostList, PostShow, PostEdit, PostCreate } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down Expand Up @@ -1403,7 +1403,7 @@ import { Refine, Resource } from "@pankod/refine";
import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

import { PostList, PostShow, PostEdit, PostCreate } from "./pages";
import { PostList, PostShow, PostEdit, PostCreate } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down
34 changes: 17 additions & 17 deletions documentation/versioned_docs/version-2.xx.xx/tutorial.md
Original file line number Diff line number Diff line change
Expand Up @@ -338,7 +338,7 @@ Let's create a **Page** component to fetch **posts** and display them as a table

First, we'll need an interface to work with the data from the API endpoint.

Create a new folder named _"interfaces"_ under _"/src"_ if you don't already have one. Then create a _"index.d.ts"_ file with the following code:
Create a new folder named _"interface"_ under _"/src"_ if you don't already have one. Then create a _"index.d.ts"_ file with the following code:

```ts title="interfaces/index.d.ts"
export interface IPost {
Expand Down Expand Up @@ -426,7 +426,7 @@ import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

// highlight-next-line
import { PostList } from "./pages";
import { PostList } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down Expand Up @@ -487,7 +487,7 @@ The category title data can be obtained from the `/categories` endpoint for each

<br />

At this point, we need to join records from different resources. For this, we're going to use the refine hook `useMany`.
At this point, we need to join records from different resources. For this, we're goint to use the refine hook `useMany`.

Before we start, just edit our interface for the new `ICategory` type:

Expand Down Expand Up @@ -623,8 +623,8 @@ import {
Table,
useTable,
useMany,
// highlight-start
FilterDropdown,
// highlight-start
Select,
useSelect,
// highlight-end
Expand Down Expand Up @@ -701,7 +701,7 @@ export const PostList: React.FC = () => {
};
```

✳️ `<FilterDropdown>` component serves as a bridge between its child input and **refine**'s `useTable` hook. It passes child's input value to `useTable` using `filterDropdown`'s embedded props and provides a filter button.
✳️ `<FilterDropdown>` component serves as a bridge between its child input and **refine**'s `useTable` hook. It passes childs input value to `useTable` using `filterDropdown`'s embedded props and provides a filter button.

[Refer to the `<FilterDropdown>` documentation for detailed usage. &#8594](api-references/components/filter-dropdown)

Expand Down Expand Up @@ -767,7 +767,7 @@ import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

// highlight-next-line
import { PostList, PostShow } from "./pages";
import { PostList, PostShow } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down Expand Up @@ -870,10 +870,10 @@ export const PostList: React.FC = () => {
</FilterDropdown>
)}
/>
// highlight-start
<Table.Column<IPost>
title="Actions"
dataIndex="actions"
// highlight-start
render={(_text, record): React.ReactNode => {
return (
<ShowButton
Expand All @@ -883,8 +883,8 @@ export const PostList: React.FC = () => {
/>
);
}}
// highlight-end
/>
// highlight-end
</Table>
</List>
);
Expand Down Expand Up @@ -981,7 +981,7 @@ import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

// highlight-next-line
import { PostList, PostShow, PostEdit } from "./pages";
import { PostList, PostShow, PostEdit } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand All @@ -1003,9 +1003,9 @@ export const App: React.FC = () => {
};
```

We are going to need an _edit_ button on each row to display the `<PostEdit>` component. **refine** doesn't automatically add one, so we have to update our `<PostList>` component to add an `<EditButton>` for each record:
We are going to need an _edit_ button on each row to diplay the `<PostEdit>` component. **refine** doesn't automatically add one, so we have to update our `<PostList>` component to add a `<EditButton>` for each record:

```tsx title="pages/posts/list.tsx"
```tsx title="components/pages/posts.tsx"
import {
List,
TextField,
Expand Down Expand Up @@ -1134,7 +1134,7 @@ In edit page, `useForm` hook initializes the form with current record values.

✳️ Form data is set automatically, whenever children inputs `<Form.Item>`'s are edited.

✳️ Save button submits the form by executing the `useUpdate` method provided by the [`dataProvider`](api-references/providers/data-provider.md). After a successful response, the application will be redirected to the listing page.
✳️ Save button submits the form by executing the `useUpdate` method provided by the [`dataProvider`](api-references/providers/data-provider.md). After a succesfull response, the application will be redirected to the listing page.

<br />

Expand Down Expand Up @@ -1224,7 +1224,7 @@ import dataProvider from "@pankod/refine-simple-rest";
import routerProvider from "@pankod/refine-react-router";

// highlight-next-line
import { PostList, PostShow, PostEdit, PostCreate } from "./pages";
import { PostList, PostShow, PostEdit, PostCreate } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand All @@ -1249,7 +1249,7 @@ export const App: React.FC = () => {

<br />

And that's it! Try it in your browser and see if you can create new posts from scratch.
And that's it! Try it on browser and see if you can create new posts from scratch.

We should notice some minor differences from the edit example:

Expand All @@ -1276,9 +1276,9 @@ We should notice some minor differences from the edit example:

Deleting a record can be done in two ways.

First way is adding a delete button on each row since _refine_ doesn't automatically add one, so we have to update our `<PostList>` component to add a `<DeleteButton>` for each record:
First way is adding an delete button on each row since _refine_ doesn't automatically add one, so we have to update our `<PostList>` component to add a `<DeleteButton>` for each record:

```tsx title="pages/posts/list.tsx"
```tsx title="components/pages/posts.tsx"
import {
List,
TextField,
Expand Down Expand Up @@ -1403,7 +1403,7 @@ import { Refine, Resource } from "@pankod/refine";
import routerProvider from "@pankod/refine-react-router";
import dataProvider from "@pankod/refine-simple-rest";

import { PostList, PostShow, PostEdit, PostCreate } from "./pages";
import { PostList, PostShow, PostEdit, PostCreate } from "./pages/posts";

export const App: React.FC = () => {
return (
Expand Down

0 comments on commit abe25dc

Please sign in to comment.