Deploy Angular universal app to non root path in firebase hosting

i have multiple angular apps for different paths

here is my firebase.json

...
"hosting": {
            "target": "app",
            "public": "dist",
            "ignore": [
                "firebase.json",
                "**/.*",
                "**/node_modules/**"
            ],
            "rewrites": [
                {
                    "source": "/app2/**",
                    "function": "serveApp2Ssr"
                },
                {
                    "source": "**",
                    "function": "serverAppSsr"
                }
            ]
        }
 ...

i have two functions serverAppSsr for serving first ssr app and serveApp2Ssr for serving app2

i build my app2 with the command ng build app2 --base-href /app2/ --deploy-url /about/

both apps work well locally

but when the deploy serveApp2Ssr and run the app with the domain url [https://domain.url/app2] it says Error: Cannot match any routes. URL Segment: 'app2 or whatever path i visit

the error occurs in angular routing module.

what i understand is when firebase function serveApp2Ssr trys to resolve the angular app with 'app2' as suffix which is unknown to angular app routing module