Replace ({ record }) with useRecordContext() (#236)

* replace `({ record })` with `useRecordContext()`

* code style

Co-authored-by: Michael Albert <37796947+awesome-michael@users.noreply.github.com>

src/components/RoomDirectory.js

@@ -19,6 +19,7 @@ import {
   useMutation,
   useNotify,
   useTranslate,
+  useRecordContext,
   useRefresh,
   useUnselectAll,
 } from "react-admin";
@@ -105,7 +106,8 @@ export const RoomDirectoryBulkSaveButton = ({ selectedIds }) => {
   );
 };
 
-export const RoomDirectorySaveButton = ({ record }) => {
+export const RoomDirectorySaveButton = props => {
+  const record = useRecordContext();
   const notify = useNotify();
   const refresh = useRefresh();
   const [create, { loading }] = useCreate("room_directory");

src/components/ServerNotices.js

@@ -9,6 +9,7 @@ import {
   useCreate,
   useMutation,
   useNotify,
+  useRecordContext,
   useTranslate,
   useUnselectAll,
 } from "react-admin";
@@ -64,7 +65,8 @@ const ServerNoticeDialog = ({ open, loading, onClose, onSend }) => {
   );
 };
 
-export const ServerNoticeButton = ({ record }) => {
+export const ServerNoticeButton = props => {
+  const record = useRecordContext();
   const [open, setOpen] = useState(false);
   const notify = useNotify();
   const [create, { loading }] = useCreate("servernotices");

src/components/devices.js

@@ -1,5 +1,12 @@
 import React, { Fragment, useState } from "react";
-import { Button, useDelete, useNotify, Confirm, useRefresh } from "react-admin";
+import {
+  Button,
+  useDelete,
+  useNotify,
+  Confirm,
+  useRecordContext,
+  useRefresh,
+} from "react-admin";
 import ActionDelete from "@material-ui/icons/Delete";
 import { makeStyles } from "@material-ui/core/styles";
 import { alpha } from "@material-ui/core/styles/colorManipulator";
@@ -22,7 +29,7 @@ const useStyles = makeStyles(
 );
 
 export const DeviceRemoveButton = props => {
-  const { record } = props;
+  const record = useRecordContext();
   const classes = useStyles(props);
   const [open, setOpen] = useState(false);
   const refresh = useRefresh();

src/components/media.js

@@ -14,6 +14,7 @@ import {
   useCreate,
   useDelete,
   useNotify,
+  useRecordContext,
   useRefresh,
   useTranslate,
 } from "react-admin";
@@ -154,7 +155,7 @@ export const DeleteMediaButton = props => {
 };
 
 export const ProtectMediaButton = props => {
-  const { record } = props;
+  const record = useRecordContext();
   const translate = useTranslate();
   const refresh = useRefresh();
   const notify = useNotify();
@@ -250,7 +251,7 @@ export const ProtectMediaButton = props => {
 };
 
 export const QuarantineMediaButton = props => {
-  const { record } = props;
+  const record = useRecordContext();
   const translate = useTranslate();
   const refresh = useRefresh();
   const notify = useNotify();

src/components/rooms.js

@@ -87,7 +87,8 @@ const EncryptionField = ({ source, record = {}, emptyText }) => {
   );
 };
 
-const RoomTitle = ({ record }) => {
+const RoomTitle = props => {
+  const record = useRecordContext();
   const translate = useTranslate();
   var name = "";
   if (record) {
@@ -354,7 +355,7 @@ const RoomFilter = ({ ...props }) => {
 
 const RoomNameField = props => {
   const { source } = props;
-  const record = useRecordContext(props);
+  const record = useRecordContext();
   return (
     <span>{record[source] || record["canonical_alias"] || record["id"]}</span>
   );

src/components/users.js

@@ -39,6 +39,7 @@ import {
   maxLength,
   regex,
   required,
+  useRecordContext,
   useTranslate,
   Pagination,
   CreateButton,
@@ -329,7 +330,8 @@ export const UserCreate = props => (
   </Create>
 );
 
-const UserTitle = ({ record }) => {
+const UserTitle = props => {
+  const record = useRecordContext();
   const translate = useTranslate();
   return (
     <span>