[BUG] goBack prop with SHOW Component is not working as expected. Back button is not coming.

[ammar-yasir]

Describe the bug

<Show
      isLoading={isLoading}
      title={'Dummy Title'}
      goBack={<BackButton />}
      headerButtons={() => <BackButton />}
>
    

As you can see in the above code that I have given prop goBack but it is not working as expected. It is not showing me the back /previous icon with link. It just shows title and no button prior to it which should not be like this.

Note: The URL for this page is "/crfqs/comparison-analysis/97d0aab2". It is not having show keyword, I even tried with changed URL as well. But when I use it on this URL "/crfqs/show/97d0aab2", it shows back button.

Kindly look into this issue and get it fixed as soon as possible.

Steps To Reproduce

No steps.

Expected behavior

It should show BACK button with goBack prop.

Screenshot

Desktop

OS: Mac Browser: Chrome

Mobile

No mobile preview.

Additional Context

No response

[BatuhanW]

Hello @ammar-yasir could you provide us a minimal reproducible example?

[salihozdemir]

Hey @ammar-yasir,

Internally <Show> compoennt uses the <PageHeader> component from @ant-design/pro-layout. <PageHeader> component has a onBack property which is a function that is called when the back button is clicked. By default, if your route has no :action parameter, the back button will not be shown. You can override this behavior by passing a headerProps property to the <Show> component like this:

import { useBack } from "@refinedev/core";
import { Show } from "@refinedev/antd";

const back = useBack();

<Show goBack={<BackButton />} headerProps={{ onBack: back }} />;

[BatuhanW]

Hello @ammar-yasir we've merged a PR making the clarification. Feel free to re-open the issue if your problem still persists.

[ammar-yasir]

Thank you so much. It worked like a charm.