Questions tagged [react-admin]
A frontend Framework for building admin applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design. Previously named admin-on-rest. Open sourced and maintained by marmelab.
1,797
questions
0
votes
0
answers
11
views
Custom query for RA Create and Edit components
We use RA with "ra-data-graphql-simple" data provider.
Our backend was designed to work with RA CRUD format, and this data-provider fit most of our use cases until now.
Now, we need other ...
0
votes
0
answers
13
views
[JS][React] Creating Custom Avatar Group
I am trying to create a custom avatar. However, nothing is being rendered since by the time that the avatar component is being re-rendered, the count for the avatar is already greater causing it to ...
0
votes
0
answers
18
views
Relation property : EditGuesser, ReferenceArrayInput and CheckboxGroupInput
I want to use a CheckboxGroupInput to modify a OneToMany property (account).
I have code that works with an ArrayInput and many list, but I don't find it practical and would prefer to use checkboxes.
...
0
votes
1
answer
31
views
Using DataProvider in ReactAdmin, how to fix an errorr: the expected type comes from the return type of this signature
I'm following the tutorial to implement dataprovider in react-admin. Here is the link: https://marmelab.com/react-admin/Tutorial.html#connecting-to-a-real-api
Below is the sample implementation of ...
0
votes
2
answers
52
views
Issue with useNavigate() Hook in Custom React-Admin Application
I'm facing a challenging issue in my React-Admin application. When I try to use the useNavigate() hook within my custom login component (MyLoginPage), I'm getting the following error:
[Route] is not a ...
0
votes
0
answers
13
views
React-Admin List empty data placeholder not showed with "filterDefaultValues"
I have a List component with a custom component for "empty". Without filterDefaultValues, it shows it.
<List
filters={DataFilters}
filterDefaultValues={{ statuses: ['All'] }}
...
1
vote
2
answers
34
views
How to create a List with custom JSON data
I have data coming from the Firestore db. I created multiple resources with test collections coming from Firestore and it worked very well. The problem I'm having now, is that I have a collection with ...
1
vote
0
answers
40
views
React Admin with ra-data-hasura Error: Unknown resource . Make sure it has been declared on your server side schema
I'm using React Admin with GraphQL and ra-data-hasura.
My problem is that the Introspection Query is made only when the app starts (when the user has the role of a guest before logging in). After ...
0
votes
0
answers
21
views
AWS Amplify looking for graphql when I am not using graphql
I am working on an react-admin project and I am implementing a cognito login with federated users as well. For some reason, when I install aws-amplify I get a series of errors related to graphql. We ...
1
vote
0
answers
25
views
React-Admin styling issue with SingleFieldList and ChipField
I am working on React project based on React Admin 4.12.1.
It worked fine before I update the packages by running yarn upgrade.
The issue is that, I cannot see the text inside ChipField anymore.
<...
0
votes
0
answers
28
views
React Admin AWS Cognito login not working
I am using AWS Cognito as a login for a react admin login. I followed the instructions here and put the info in the App.js file.
This lead to the app.js file containing the following:
import { ...
0
votes
0
answers
69
views
Issue with Content-Range Header in Go and React-admin
I am facing an issue while developing an application using Go as the backend and React-admin as the frontend. We have created a simple REST API in Go to work with a PostgreSQL database and want to use ...
2
votes
1
answer
99
views
The Content-Range header is missing in the HTTP Response. React Admin. Golang api
I'm trying to create a admin panel using react-admin.
I'm trying to connect my api and react admin for the umpteenth time, but nothing works. The Content-Range header is missing in the HTTP Response. ...
1
vote
1
answer
39
views
Dependencies errors using react-admin with ra-data-django-rest-framework
I created a new project using vite and installed react-admin. I have a backend in django so I want to use ra-data-django-rest-framework. But the issue is it's very old and when I try to install it's ...
0
votes
0
answers
21
views
await userEvent.type does not work when input has defaultValue
I test my react-admin SimpleForm, it works perfectly in create context but provoke an infinite wait in edit context <EditBase/> (instead of <CreateBase/>).
npm packages useful here:
vitest:...
0
votes
1
answer
60
views
SaveButton disabled with isValid still disabled after await user.type success
I test my SimpleForm, but even after writing input successfuly, my SaveButton is still disabled (contains className 'Mui-disabled').
npm packages useful here:
vitest: 0.34.1
react-hook-form: 7.45.2
...
1
vote
0
answers
41
views
Getting Response from Spring boot to React-Admin Framework
React-Admin: https://www.npmjs.com/package/react-admin
This is the response from the spring-boot when we send the bearer token to the spring-boot app from the Postman Application:
[
{
&...
0
votes
1
answer
40
views
React Admin - top level store variable and selection
I want users to be able to select a variable at the top of the page that is then used in remaining sections. This is shown in the image below as the "Select Election" dropdown. I am storing ...
0
votes
1
answer
44
views
Custom function to save a form using React Admin
In my react-admin app, I have a list of items accompanied by two buttons: Create using email and create. The "create" button is pre-existing and uses the funcionalitties by the data provider....
0
votes
0
answers
29
views
React-Admin Enterprise Edition: Breadcrumb component with recordRepresentation does not display specified field
I am working on the implementation of a Breadcrumb component in my React Admin project using the Enterprise edition.
The Breadcrumb is specified like this:
import { Breadcrumb } from '@react-admin/ra-...
0
votes
0
answers
77
views
How to use the usePermissions React-Admin hook correctly to restrict access to resources?
I'm trying to make a distinction in the UI to resources based on the roles obtained from the usePermissions hook.
This is my App component:
import * as React from "react";
...
const store = ...
0
votes
1
answer
45
views
Fields inside a ReferenceManyInput have empty values
I am trying <ReferenceManyInput> with a setup similar to the docs example. My inputs are rendered, but all of them have empty values, although related records themselves are fetched correctly. ...
1
vote
1
answer
52
views
How can I delete AppBar in react-admin?
I deleted Menu by using theme.
components: {
...defaultTheme.components,
RaSidebar: {
styleOverrides: {
root: {
width: 0,
}
}
}
}
I want to ...
0
votes
0
answers
14
views
How to get whole record from ShowRecord component in react-admin
I have DataGrid and I use ShowButton to get the detail of the data and show it in antoher page. When I click the showClick it calls the right path and opens the page with the right path "details/{...
0
votes
2
answers
72
views
Loading view for some pages
In my react-admin app when I go to some section I see the default loading page but I cannot understand the reason. It seems to appear when I go to http://localhost:3000/#/ before the redirection to ...
0
votes
0
answers
33
views
ReactAdmin sticky the RichTextInput toolbar to the top of the text field even when scrolling the page
How can I sticky the RichTextInput toolbar (I thin the CSS class is RaRichTextInputToolbar-root) on the top of the rich text field?
I tried but only made to use position: fixed and it fix it relative ...
1
vote
1
answer
43
views
How to rename "Unlabeled Column #N"
I followed the SelectColumnsButton documentation and added an action column. I have the following code:
<DatagridConfigurable>
<TextField source="id" />
<TextField source=&...
0
votes
0
answers
44
views
react-admin date input component not displaying correctly when view in mobile device
Do you all have a workaround for the date input component of react-admin?
(https://marmelab.com/react-admin/DateInput.html)
It seems that when the date input component is view in mobile device, the ...
0
votes
0
answers
66
views
React Admin & Supabase: primaryKeys is undefined error
I am facing an issue using React Admin with ra-supabase. The following message appears in the logs and I can't find why:
TypeError: primaryKeys is undefined
Here are my codes:
supabase.js
import { ...
0
votes
0
answers
49
views
How to avoid sending getMany query after selecting item in ReferenceInput Select Input [React-Admin V4]
I'm using ReferenceInput with SelectInput, and i noticed that a getMany query will be send once i change select input value, i know it's default behavior from here. i just don't need it, getList query ...
0
votes
1
answer
101
views
API Platform - React Admin and permissions error
I am using API Platform and need to open an Admin access with limitation due to user roles.
Meanwhile the permission system seems to work properly accordingly to the user logged, I have an error in ...
1
vote
0
answers
52
views
Deleted record in React-admin shows in the list using custom data provider
I have a custom data provider implementing delete method this way:
delete: (resource, { id, previousData }) => {
return deleteRecord(id).then(res => {
if (res.data.deleteRecord.success) {
...
1
vote
1
answer
41
views
How to change row's id value of <Datagrid /> with other attributu's value
<Datagrid /> component seems automatically set id of each row to id attribute of a record
this is my records:
[
{
id: "d28dda00-a835-4fb2-956d-b70b168fc2ab",
name: "...
0
votes
0
answers
22
views
How to implement a filter without case sensitive using List component of react admin? I mean no diference to filter banada, Banana or BaNana
Below at my code, I create the component postFilters, that will be used as filters. I want to filter works at my List independent if the world is lowercase or uppercase. I search a lot, but didn't ...
0
votes
1
answer
38
views
Firestore rules allowing to read even when not allowed
I want to create Firebase Firestore rules so that only verified users can read and write into the members collection. But I seem to be unable to write such firesore rules.
I wrote those Firestore ...
0
votes
1
answer
41
views
DateRangePicker in a React-Admin application
I want to use material ui's DateRangePicker in my React-Admin app.
But when i do an npm install @material-ui/pickers, I get:
While resolving: [email protected]
Found: [email protected]
node_modules/react
...
-1
votes
1
answer
36
views
Style react admin with bootstrap
I have a React Admin application set up, and it's functioning correctly with the default styles. Now, I want to use Bootstrap to enhance the UI. sx doesn't help a lot, I want to style the inner ...
0
votes
1
answer
157
views
How to create react-admin custom route?
I tried to create a custom route in my react-admin app, but I get an error when I try to load it.
Here is the code:
// src/pages/MyAdmin.tsx
export const MyAdmin = () => (
<Admin
...
0
votes
1
answer
68
views
Button component disappear in mobile
In my React-Admin project I'm using the Button component to call my custom methods but it disappears in the 'sm' (mobile) breakpoint.
It depends directly from React-Admin because using the MUI Button ...
1
vote
1
answer
72
views
Freeze headers in react-admin `List` component
Some of my users like to have 100 list items visible, to suit their workflow.
But, when scrolling down, they no longer see the column headers.
Is it possible to freeze the headers in a List component, ...
0
votes
1
answer
55
views
Adding Javascript to Header in React-Admin App
I'd like to add a dynamic javascript script to every page's <head> in a react-admin app, but not sure the best way/place to do this. I've seen a lot with React-Helmet, but feel like this should ...
2
votes
2
answers
144
views
Create hidden ID field using React-Admin in React Native
I am trying to use the SimpleFormIterator in the React-Admin module to create a list of children records from the parent record edit form.
So I've setup a SimpleFormIterator component with the details ...
0
votes
0
answers
34
views
Can one include filter dropdowns on a Show page in React-Admin?
E.g. Partly working code of what I want to achieve:
import {
List,
Show,
Tab,
AutocompleteArrayInput,
} from 'react-admin';
// react-select used as a convenient workaround, I found it more ...
0
votes
1
answer
240
views
Connect FastAPI and react-admin via websocket [duplicate]
I'm kinda new with react and react-admin.
The task is pretty simple, it is to connect FastAPI server with react-admin app via websocket. I think I have to create websocket dataProvider somehow.
for ...
1
vote
1
answer
64
views
FilterList with a SelectItem FilterItem
I have what is probably a common situation. In many of my applications <List> pages I have a Filter aside. Wonderful from a UIX standpoint on wide displays.
The <FilterList> component ...
0
votes
0
answers
118
views
React Admin - Adding access token to GraphQL request
I am using react-admin and Azure B2C for authentication, As a data provider I am using react-admin provided graphql, I need to add msal provided accessToken to graphql.
Problem is react-admin ...
0
votes
1
answer
96
views
Updating context value in react-admin causes a router history warning
I'm using context to store a global piece of information which is updated when navigating around the web app from a Link component. For some reason, when I update the context data, I get a "...
1
vote
2
answers
65
views
Is it possible to disable react-admin persisting the filters in application state?
I'm trying to disable filters being persisted in application state whilst keeping the applied filters in the URL
I've tried the disableSyncWithLocation prop, but this removes applied filters from the ...
0
votes
1
answer
43
views
Field validations don't get called if react-admin SimpleForm has a validate function
Consider the following code:
const validateLetterTypeForm = (values: Partial<ILetterType>) => {
const errors: Partial<ILetterType> = {};
//TODO: put code to validate form here
...
0
votes
1
answer
42
views
Datagrid expandable opens on all Datagrids on page
When having multiple Datagrid components on one page the expandable function gets confused and opens the record with the same id on all Datagrids on the page. See example on the tag list here: https://...