Add `replace` to `useNavigation()`

[remorses]

Description

Like in a browser sometimes you don't want to create a new navigation stack, you would use replace instead of push for that.

Who will benefit from this feature?

Any extension that has many navigations, you can reduce the number of navigation stacks so that the user can go back with esc without encountering too many non desired views.

Anything else?

No response

[mathieudutour]

you can just return the view you want to replace, can't you?

[remorses]

This would basically mean reimplementing useNavigation using some global state in my use case, which would add complexity. We already have push and pop, it makes sense to add replace

[mathieudutour]

I'd argue that

const [showOtherView, setShowOtherView] = useState(false)

if (showOtherView) {
  return <OtherView />
}

...
onAction={() => setShowOtherView(true)}

isn't too hard to implement...

[remorses]

Let's say an extension to browse a database has 3 views, a list view of the tables, a list view of the rows and a form to add a new row to a table.

The user selects a table in the table list, gets pushed to the rows list, decides to add a row with the form, after submitting he gets pushed to the rows list again, here he decides to press esc to go to the previous view. He will get redirected to the form view. Instead he probably wants to go to the table view.

This is very common in web applications, you use replace in views you don't want the user to be able to navigate back to. Using your method I am not sure if you can keep the navigation stack, you would need to set the showOtherView back to false when user presses esc.

You recently added the option to close Raycast on esc probably because of this issue, too many navigation stacks because there is only push and no replace

[mathieudutour]

after submitting he gets pushed to the rows list again

Ah well you shouldn't push here, but pop instead

[remorses]

Ah well you shouldn't push here, but pop instead

Right, chose a wrong example, but the idea should come across anyway, for example if after the form submission you have another view different than the previous with the row details. It should be very easy to implement in Raycast, developers are already familiar with the browser model of push, pop and replace.

[mathieudutour]

The difference with the browser is that Raycast doesn't have a concept of URL so replace doesn't do anything other than what returning something directly would do.