Options to extend modals with custom components
RolginRoman opened this issue Β· comments
hey, guys. It is an ultimately useful library π
Requirement
Is it possible to customise the current modals' view? WalletsModal in particular.
I've seen that theming
is on the roadmap, so that might be extremely handy.
Proposal
Add an additional option to UnifiedWalletContext.Provider
, eg. modalInstance: FC<>
and pass it if necessary.
UnifiedWalletContext.Provider
could render an injected instance or fallback to the default implementation.
Current implementation extended with this proposal.
const ConfigModal = config.modalInstance;
return (
<UnifiedWalletContext.Provider
value={{
walletPrecedence: config.walletPrecedence || [],
handleConnectClick,
showModal,
setShowModal,
walletlistExplanation: config.walletlistExplanation,
theme: config.theme || 'light',
walletAttachments: config.walletAttachments || {},
}}
>
{ConfigModal ? (
<ConfigModal open={showModal} onClose={() => setShowModal(false)}></ConfigModal>
) : (
<ModalDialog open={showModal} onClose={() => setShowModal(false)}>
<UnifiedWalletModal onClose={() => setShowModal(false)} />
</ModalDialog>
)}
{children}
</UnifiedWalletContext.Provider>
);
Other things that might be made public for re-using
usePreviouslyConnected
(https://github.com/TeamRaccoons/Unified-Wallet-Kit/blob/main/src/components/UnifiedWalletModal/index.tsx#L272) might be exported either with public API or just as a context value, like:
<UnifiedWalletContext.Provider ...>
<PreviouslyUsedWallets value={wallets}>
<Modal />
</PreviouslyUsedWallets>
</UnifiedWalletContext.Provider>
- Grouped list might be useful for consumers too https://github.com/TeamRaccoons/Unified-Wallet-Kit/blob/main/src/components/UnifiedWalletModal/index.tsx#L274. It might be exported as a context or public API, for instance.
const list: { highlightedBy: HIGHLIGHTED_BY; highlight: Adapter[]; others: Adapter[] }
WDYT?
What do you think about this? Would you accept such a change if our team implemented it?
I want to contribute to this package instead of locking it in a fork π«‘
Any thoughts, concerns or additional details are super welcome. Hope to hear from you soon π