Skip to content

Commit 960feae

Browse files
committed
Add links to soft delete feature
1 parent 5265fb7 commit 960feae

File tree

6 files changed

+104
-2
lines changed

6 files changed

+104
-2
lines changed

docs/Buttons.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -838,7 +838,7 @@ If your `authProvider` implements [Access Control](./Permissions.md#access-contr
838838

839839
## `<DeleteButton>`
840840

841-
Delete the current record.
841+
Deletes the current record.
842842

843843
![Delete button](./img/DeleteButton.png)
844844

@@ -867,6 +867,8 @@ You can also call it with a record and a resource:
867867
```
868868
{% endraw %}
869869

870+
**Tip**: React-admin provides a [`<SoftDeleteButton>`](./SoftDeleteButton.md) variant, which archives the record instead of deleting it. Check out the [Soft Delete documentation](./SoftDeleteDataProvider.md) for more information.
871+
870872
### Props
871873

872874
| Prop | Required | Type | Default | Description |

docs/Features.md

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1047,6 +1047,48 @@ const dataProvider = addEventsForMutations(
10471047
);
10481048
```
10491049

1050+
## Soft Delete
1051+
1052+
React-admin lets you implement **soft delete** in your admin app, so that users can recover deleted records.
1053+
1054+
![Soft delete example](https://react-admin-ee.marmelab.com/assets/DeletedRecordsList.png)
1055+
1056+
Replace the standard `<DeleteButton>` with the [`<SoftDeleteButton>`](./SoftDeleteButton.md) in your `<List>`, `<Show>`, and `<Edit>` views to enable soft delete:
1057+
1058+
```jsx
1059+
import { List, DataTable, TextField } from 'react-admin';
1060+
import { SoftDeleteButton } from '@react-admin/ra-soft-delete';
1061+
1062+
export const PostList = () => (
1063+
<List>
1064+
<DataTable>
1065+
<DataTable.Col source="id" />
1066+
<DataTable.Col source="title" />
1067+
<DataTable.Col>
1068+
<SoftDeleteButton />
1069+
</DataTable.Col>
1070+
</DataTable>
1071+
</List>
1072+
);
1073+
```
1074+
1075+
Then, add a `<DeletedRecordsList>` somewhere in your app to let users view and restore deleted records:
1076+
1077+
```jsx
1078+
import { Admin, CustomRoutes } from 'react-admin';
1079+
import { DeletedRecordsList } from '@react-admin/ra-soft-delete';
1080+
1081+
const App = () => (
1082+
<Admin>
1083+
<CustomRoutes>
1084+
<Route path="/deleted-records" element={<DeletedRecordsList />} />
1085+
</CustomRoutes>
1086+
</Admin>
1087+
);
1088+
```
1089+
1090+
Check out the [Soft Delete Documentation](./SoftDeleteDataProvider.md) to learn more.
1091+
10501092
## Calendar
10511093

10521094
If your app needs to display **events**, **appointments**, **time intervals**, or any other kind of time-based data, you can use the [`<Calendar>`](./Calendar.md) component.

docs/SoftDeleteDataProvider.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ title: "Soft Delete Setup"
55

66
# Soft Delete Setup
77

8-
The soft delete feature is an Enterprise Edition add-on that allows you to "delete" records without actually removing them from your database.
8+
The soft delete feature is an [Enterprise Edition add-on](https://react-admin-ee.marmelab.com/documentation/ra-soft-delete) that allows you to "delete" records without actually removing them from your database.
99

1010
Use it to:
1111

docs/Toolbar.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,3 +96,25 @@ You can override the style of the toolbar using the `sx` prop. Use the class nam
9696
| `& .RaToolbar-defaultToolbar` | Applied to the internal wrapper of the `<Toolbar>` buttons when no children are passed |
9797

9898
To override the style of all instances of `<Toolbar>` components using the [application-wide style overrides](./AppTheme.md#theming-individual-components), use the `RaToolbar` key.
99+
100+
## Soft Delete
101+
102+
`<Toolbar>` displays a `<DeleteButton>` by default. React-admin provides a [`<SoftDeleteButton>`](./SoftDeleteButton.md) variant, which archives the record instead of deleting it.
103+
104+
To replace the default `<DeleteButton>` with a `<SoftDeleteButton>`, create a custom toolbar:
105+
106+
{% raw %}
107+
```jsx
108+
import { Toolbar, SaveButton } from 'react-admin';
109+
import { SoftDeleteButton } from '@react-admin/ra-soft-delete';
110+
111+
const MyToolbar = () => (
112+
<Toolbar sx={{ justifyContent: 'space-between' }}>
113+
<SaveButton label="Save" />
114+
<SoftDeleteButton />
115+
</Toolbar>
116+
);
117+
```
118+
{% endraw %}
119+
120+
Then inject it to `<SimpleForm>` or `<TabbedForm>` using the `toolbar` prop.

docs/useDelete.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,3 +81,21 @@ useDelete<Product, Error>(undefined, undefined, {
8181
},
8282
})
8383
```
84+
85+
## Soft Delete
86+
87+
Many applications require a "soft delete" feature, where records are not permanently removed from the database but are instead marked as deleted. This allows for easy recovery of deleted records and helps maintain data integrity.
88+
89+
`useSoftDelete`, part of [the `ra-soft-delete` Enterprise Edition module](https://react-admin-ee.marmelab.com/documentation/ra-soft-delete), works similarly to `useDelete`, but it calls `dataProvider.softDelete()` instead of `dataProvider.delete()`.
90+
91+
```tsx
92+
const [softDeleteOne, { data, isPending, error }] = useSoftDelete(
93+
resource,
94+
{ id, authorId, previousData, meta },
95+
options,
96+
);
97+
```
98+
99+
The `authorId` parameter is optional, and is populated automatically if you have an `authProvider` with a `getIdentity` method.
100+
101+
Check the [Soft Delete documentation](./SoftDeleteDataProvider.md) for more information.

docs/useDeleteMany.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,3 +80,21 @@ useDeleteMany<Product, Error>(undefined, undefined, {
8080
},
8181
})
8282
```
83+
84+
## Soft Delete
85+
86+
Many applications require a "soft delete" feature, where records are not permanently removed from the database but are instead marked as deleted. This allows for easy recovery of deleted records and helps maintain data integrity.
87+
88+
`useSoftDeleteMany`, part of [the `ra-soft-delete` Enterprise Edition module](https://react-admin-ee.marmelab.com/documentation/ra-soft-delete), works similarly to `useDeleteMany`, but it calls `dataProvider.softDeleteMany()` instead of `dataProvider.deleteMany()`.
89+
90+
```tsx
91+
const [softDeleteMany, { data, isPending, error }] = useSoftDeleteMany(
92+
resource,
93+
{ ids, authorId, meta },
94+
options,
95+
);
96+
```
97+
98+
The `authorId` parameter is optional, and is populated automatically if you have an `authProvider` with a `getIdentity` method.
99+
100+
Check the [Soft Delete documentation](./SoftDeleteDataProvider.md) for more information.

0 commit comments

Comments
 (0)