jsverse / transloco-keys-manager

🦄 The Key to a Better Translation Experience

Home Page:https://github.com/jsverse/transloco/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Feature: support Angular 14 inject()

jonathanwilke opened this issue · comments

Is there an existing issue for this?

  • I have searched the existing issues

Is this a regression?

No

Current behavior

When using Angular 14 inject() to inject the TranslocoService, the extract and find commands don't work.

Expected behavior

Should work with inject().

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/angular-ivy-mbcpxm?file=src%2Fapp%2Fapp.component.ts

Transloco Config

No response

Debug Logs

No response

Please provide the environment you discovered this bug in

Transloco: 
Transloco Keys Manager:
Angular:
Node: 
Package Manager: 
OS:

Additional context

No response

I would like to make a pull request for this bug

No

I am not an expert in tsquery, but I managed to match the injects with this query:

const typescript = `
class Animal {
    transloco = inject(TranslocoService);
}
`;

const ast = tsquery.ast(typescript);

const injectNodes = tsquery(
  ast,
  `PropertyDeclaration:has(CallExpression:has(Identifier[name=TranslocoService],Identifier[name=inject]))`
);

console.log(injectNodes[0].name.getText());

Maybe that's helpful.

Key extraction for TranslocoService injected unsing inject() function does not work on version 3.8.0. So changes from this PR #142 didn't help (

I'm using the following code:

export const hasPermissionFactory(): Observable<string> {
    const permission = inject(PermissionService);
    const translate = inject(TranslocoService);
    const snackBarManager = inject(MatSnackBar);

    return permission.hasPermissions().pipe(
        switchMap((hasPermission) => {
            if (!hasPermission) {
                return zip([
                    translate.selectTranslate(
                        'permission.snackbar.no-permission',
                    ),
                    translate.selectTranslate('permission.snackbar.close'),
                ]).pipe(
                    tap(([message, close]) => {
                        snackBarManager.open(message, close, {
                            duration: 3000,
                            horizontalPosition: 'right',
                        });
                    }),
                    map(() => false),
                );
            }
            return of(true);
        }),
    );
}

For this case permission.snackbar.no-permission and permission.snackbar.close are not extracted.
There is a workaround to add messages using marker function