Includes: compilation, translations, IDE support (use .tsx not .ts), typings, and other build tools.
TypeScript component have to import PropTypes and React with `import * as React from 'react';`
pillifyLinks leaked Pill components, which if they contained a BaseAvatar
would leak a whole DOM tree retained by the BaseAvatar's onClientSync
event listener. This tracks the Pill containers so they can be unmounted
via unmountPills.
BasicMessageComposer set an event listener on selectionchange in onFocus
which leaked if onBlur wasn't called. This removes it in unmount.
We've also seen Velociraptor retaining full DOM trees from RRs, which
this doesn't address as the leak is probably within Velocity, and the plan
is to replace it with CSS animations.
Should fix https://github.com/vector-im/riot-web/issues/12417
This covers the "recents" section and rough design exclusively. It is known that the Field does nothing and that there's a bunch of missing functionality - this is to be iterated upon in future PRs. Labs flag is to aide development and should be removed in a very near future PR.
Also, this is focusing on DMs and not user lists in general because I misinterpreted the scope. I'll fix this in a future PR and instead make this the best DM invite dialog it can be.
Closes https://github.com/vector-im/riot-web/issues/11197
This is needed because `require()` means something different in webpack - it ends up importing the module as something we didn't expect (and is occasionally async)
With a switch to Only One Webpack™ we need a way to help developers generate the component index without a concurrent watch task. The best way to do this is to have developers import their components, but how do they do that when we support skins? The answer in this commit is to change skinning.
Skinning now expects to receive your list of overrides instead of the react-sdk+branded components. For Riot this means we send over *only* the Vector components and not Vector+react-sdk.
Components can then be annotated with the `replaceComponent` decorator to have them be skinnable. The decorator must take a string with the dot path of the component because we can't reliably calculate it ourselves, sadly.
The decorator does a call to `getComponent` which is where the important part of the branded components not including the react-sdk is important: if the branded app includes the react-sdk then the decorator gets executed before the skin has finished loading, leading to all kinds of fun errors. This is also why the skinner lazily loads the react-sdk components to avoid importing them too early, breaking the app.
The decorator will end up receiving null for a component because of the getComponent loop mentioned: the require() call is still in progress when the decorator is called, therefore we can't error out. All usages of getComponent() within the app are safe to not need such an error (the return won't be null, and developers shouldn't use getComponent() after this commit anyways).
The AuthPage, being a prominent component, has been converted to demonstrate this working. Changes to riot-web are required to have this work.
The reskindex script has also been altered to reflect these skinning changes - it no longer should set the react-sdk as a parent. The eventual end goal is to get rid of `getComponent()` entirely as it'll be easily replaced by imports.