How to inject custom computed variables to login page

Hi, so I work at a company that’s trying to adopt KeyCloak.
Our business is such that we have different end points for different customers.
ex: client1.companyname.cloud, client2.companyname.cloud, etc.
For bigger clients we are thinking of having different realms to manage their Auth. But for smaller clients we will be using a common Auth endpoint (one realm).
Inside our application we allow the admin to select which identity provider they want to use. Ex: GitHub, Gmail, AWS Cognito etc (Once they have been successfully logged in).
There are some clients that will be sharing a realm for authentication. So if one client selects google IDP then every other client will see it despite them not choosing so.
What we want is, where exactly in the source code can I make changes so that I can make an API call and get the current supported IDPs for a particular tenant (this will be our own API call, nothing to do with keycloak) and then we want to inject it to the login page. So that login page will only show those IDPs and not all the available ones. Ex: If a client uses AWS cognito he will only see AWS cognito and not other ones like Facebook.
Since I am from Express background (Node.js) think of it like: injecting an object in the template in: response.render(template, dynamicObject). And we have the properties of dynamicObject available in our template so we can show / hide data based on that. I hope I made my point clear. But in case there is any further clarification needed from my end please feel free to comment and ask.
Thanks.