Loopback 4 - JWT authentication - error with given UserRepository

Question

First of all, I have to say I'm new to TypeScript and moreover that since I cannot find a single tutorial about LB and JWT authentication that seems to work correctly from the beginning to the end I had to follow more than one and try to put the pieces together while coding.

Started following this article on Medium, but did feels as something were missing, so switched to @loopback/authentication-jwt documentation and find out I had to make my own (empty) User model that extends LB's one just to have its table created, so far so good, so got back to Medium.

The real problem arise when trying to add the controller: copy-pasted the linked controller file and fixed any import to use @loopback/authentication-jwt own UserRepository class, but I when trying to register a new user via the /signup route I get back a 500 response with an error at line #156 of given controller file:

Request POST /signup failed with status code 500. TypeError: this.userRepository.userCredentials is not a function
    at UserController.signUp (/home/node/app/dist/controllers/user.controller.js:78:35)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async /home/node/app/node_modules/@loopback/rest/dist/providers/invoke-method.provider.js:37:32
    at async /home/node/app/node_modules/@loopback/express/dist/middleware-interceptor.js:82:25
    at async /home/node/app/node_modules/@loopback/express/dist/middleware-interceptor.js:82:25
    at async /home/node/app/node_modules/@loopback/rest/dist/providers/send.provider.js:39:32
    at async MySequence.handle (/home/node/app/node_modules/@loopback/rest/dist/sequence.js:201:9)
    at async HttpHandler._handleRequest (/home/node/app/node_modules/@loopback/rest/dist/http-handler.js:64:9)

Inspecting UserRepository code I can see that

export declare class UserRepository extends DefaultCrudRepository<User, typeof User.prototype.id, UserRelations> {
    // ...
    readonly userCredentials: HasOneRepositoryFactory<UserCredentials, typeof User.prototype.id>;
    // ...
}

and digging deeper inspecting HasOneRepositoryFactory I see this:

export interface HasOneRepositoryFactory<Target extends Entity, ForeignKeyType> {
    /**
     * Invoke the function to obtain HasOneRepository.
     */
    (fkValue: ForeignKeyType): HasOneRepository<Target>;
    /**
     * Use `resolver` property to obtain an InclusionResolver for this relation.
     */
    inclusionResolver: InclusionResolver<Entity, Target>;
}

Maybe I'm missing something about TS syntax, but to me the given user controller code seems to be correct and calling this.userRepository.userCredentials(savedUser.id) at line 156 should not give any error, but still I get it.

Probably I'm missing something else about LB itself, but can't figure out what.

Update #1

@ShubhamP find out an issue about my problem:
https://github.com/loopbackio/loopback-next/issues/6964

Update #2

Created Github repo with current project state: https://github.com/xfudox/test-lb4

Just start the project with docker compose up -d --build, then log into the node container, install the dependancies and run with npm run start