When Dependancy Injection goes rouge in blazor

Question

I have a blazor project that has a sperate Webapp UI and a mobile app UI utilising blazor hybrid principals, they share multiple components that display some data and allow actions to be performed on that data.

On ONe of the components both UI's use 95% of the actions for that component but there is 5% that is only used by the Webapp and there is absolutley no need for these actions in the mobile app.

All these actions are performed by a command factory class that is injected into the component, the factory know how to do 100% of the commands and uses injected services to perform most of these actions.

The Problem is the 5% of actions that the Mobile doesn't need are on an injected service that the mobile app just doesn't need and has no implementation for.

So my question is how do i split this?

Currently if I don't inject the dependant service from the mobile app (again the mobile app will never need this service or it's actions) the mobile app errors when loading the component.

I don't particularily want a different component or a different factory class for each UI as they share 99% of the layout and 95% of the commands so there is massive amounts of duplication in either of those scenarios, but I also don't want to have to create a service in the mobile app that i can inject as i shouldn't need to implement a service i have 0 need for?

I'm struggling with this so any advice would be greatly appreciated.

I though about implementing a different factory for the Mobile App that doesn't have the dependancy but then I'm going to end up with 2 factories that essentially call the same code which is a nightmare for mainteance and teh same goes for the component??

Answer 1

As there's no MRE, I'm reluctant to try and create one as I'll probably be well wide of the mark,

So on an abstract basis you should be able to do something like this.

First separate out the routed component [the page] from the form.

Take the 95% functionality in the Form in AppForm. Add the 5% to a Component WebAppForm that inherits from AppForm.

In one deployment project

@page "/routename"

<AppForm />

and the other

@page "/routename"

<WebAppForm />

You can collect and pass any parameters into the form.

Take the 95% service AppService.

Add the 5% service in WebAppService that inherits from AppService.

Define the services:

public static class MyServiceExtensions
{
    public static void AddAppServices(this IServiceCollection services)
    {
        services.AddScoped<AppService, AppService>();
    }

    public static void AddWebAppServices(this IServiceCollection services)
    {
        services.AddScoped<AppService, WebAppService>();
    }
}

In each version of the form check the provided service type from injection is the correct type, cast it if necessary and use it.