admin icon indicating copy to clipboard operation
admin copied to clipboard

DeleteButton doesn't work

Open wiktorpikosz opened this issue 1 year ago • 1 comments

API Platform version(s) affected: x.y.z Backend: v3.2.13 Admin: 3.4.9

Description
<DeleteButton /> doesn't work for the list of items. I can click on them and send the get collection or the get request, but don't send a delete request. The element is removed from the list but after a few seconds the list is refreshed and is again on the list.

How to reproduce
I created a list in this way:

const UserList = () => {
  return (
    <ListGuesser>
      <TextField source="originId" label="ID" sortBy="id" />
      <FieldGuesser source="email" />
      <FieldGuesser source="createdAt" />
      <FieldGuesser source="confirmed" sortable={false} />
      <FieldGuesser source="roles" sortable={false} />
      <LoginAsUserButton />
      <DeleteButton />
      <EditButton />
    </ListGuesser>
  );

I can click on the button, but the DELETE request isn't sent.

Possible Solution
I can guess that the dataProvider has some issues. Or this button as a component from react-admin isn't supported.

Additional Context
I used custom authorization and data provider.

const getHeaders = (): HeadersInit => {
  const userToken = token();
  return {
    Authorization: `Bearer ${userToken}`,
  };
};

const httpClient = (url: URL, options: any = {}) => {
  return baseFetchHydra(url, {
    headers: getHeaders,
  });
};

const apiDocumentationParser = async (entrypointUrl: string) => {
  try {
    return await parseHydraDocumentation(entrypointUrl, {
      headers: getHeaders,
    });
  } catch (result: any) {
    const { api, response, status } = result;

    if (status !== 401 || !response) {
      throw result;
    }

    localStorage.removeItem("auth");

    return {
      api,
      response,
      status,
    };
  }
};

const dataProvider = hydraDataProvider({
  entrypoint: entrypoint,
  httpClient: httpClient,
  apiDocumentationParser: apiDocumentationParser,
});
const schemaAnalyzer = hydraSchemaAnalyzer();

function App() {
  return (
    <HydraAdmin
      entrypoint={entrypoint}
      authProvider={authProvider}
      dataProvider={dataProvider}
      schemaAnalyzer={schemaAnalyzer}
      requireAuth
    >
      <ResourceGuesser name="users" list={UserList} />
    </HydraAdmin>
  );
}

wiktorpikosz avatar Jul 29 '24 15:07 wiktorpikosz

My mistake in the client:

const httpClient = (url: URL, options: any = {}) => {
  return baseFetchHydra(url, {
    ...options,
    headers: getHeaders,
  });
};

This was the reason why the DELETE request was sent as GET because the information with the method from the options parameter was removed.

wiktorpikosz avatar Jul 29 '24 17:07 wiktorpikosz

Closing the issue as it seems solved. Feel free to reopen if that's not the case.

slax57 avatar May 12 '25 16:05 slax57