I'm trying to set up a custom dashboard for my Umbraco 17 backend so I have the following manifest:

export const dashboardInstallerDetailsManifest: UmbExtensionManifest = {
    type: 'dashboard',
    alias: 'MyAccount.Dashboard.InstallerDetails',
    name: 'Installer Details Dashboard',
    meta: {
        label: 'Details',
        pathname: 'details/:accountNumber'
    },
    conditions: [{
        alias: Constants.SectionCondition,
        match: Constants.SectionAlias,
    }],
    element: () => import('../Elements/InstallerDetails'),
};

This works fine, but I'm unable to get the account number from the url

I have tried using onBeforeEnter and onAfterEnter like in this answer but my console.log never seem to be hit

export class InstallerDetailsElement extends UmbLitElement implements BeforeEnterObserver {

    // I have tried with and without the implements BeforeEnterObserver

    @state()
    private _accountNumber?: string;

    constructor() {
        super();
    }

    // I have tried with and without the async and public before this method
    async onBeforeEnter(location: RouterLocation) {
        console.log('onBeforeEnter');
        this._accountNumber = location.params.accountNumber as string;
    }

    public onAfterEnter(
        location: RouterLocation,
        commands: PreventAndRedirectCommands,
        router: Router
    ): void {
        console.log('onAfterEnter');
        this._accountNumber = location.params.accountNumber as string;
    }

Does anyone know how to get the account number from the url in the umbLitElement?