We should only set one provider at a time, not both the light client and a WsProvider instance.

I think it makes sense to add a config in the ConfigProvider so a user or the developer can choose if they want one or the other globally or per chain. The default should be WsProvider.

1. Maybe something like this?

// in config/model.ts

export type ConnectionType = 'trusted' | 'light-client';

export type ConfigProps = {
  // ... omitted
  api?: {
    default?: ConnectionType;
  } & Partial<Record<ChainId, ConnectionType>>;
};

Then inside of ApiProvider you use useConfig() to get the values and create the instances accordingly. This will update automatically when the config is changed

We can also add a setter function to ConfigProvider so a user can change the connection type for all chains or for a specific one.

e.g.

const { setConnectionType } = useConfig();

// set for default chain
setConnectionType('light-client');

// set for a specific chain
setConnectionType('light-client', 'aleph');

// set for all chains
setConnectionType('light-client', 'all');

Maybe setConnectionType is defined like this:

type Chain = ChainId | 'all';
const setConnectionType = (type: ConnectionType, chain?: Chain) => void;

1. If chain is omitted as an argument, it uses the default chain.
2. If chain has the value all, set config.api to { default: '<type>' }
3. If chain is a ChainId then set config.api[chainId] = '<type>'

thx, made some changes, will continue with ApiProvider in the upcoming commits

used early returns to keep it flat and avoid if/ else

@DoubleOTheven in this comment you mentioned

Then inside of ApiProvider you use useConfig() to get the values and create the instances accordingly. This will update automatically when the config is changed

I tried to use useEffect to update automatically, but not entirely sure if this is the right approach and/ or if the other useEffect becomes obsolete.

Let me know how do you envision APIProvider to behave.

If you think there is a better approach you can suggest it. I was only giving some ideas.

useEffect can be used to update the state of ApiProvider if some other state changes.

Nit: it looks like your IDE formatter is set to something other than Deno. Deno should be the formatter. I think this will fix the issue where ' is converted to "