In this solution, I've created a rendering engine that follows a modern component-based paradigm. It is inspired by React component functions (with a JSX syntax), yet it is backed by RxJS Observables.

It also has a redux-like store and side effects module implemented using the same RxJS.

The app uses the `tdweb` package (via Airgram API) and is reacting to live updates of your contacts statuses, chats list, and their messages.

It lacks messaging and chat-auto update. The signup/ signin flows are 80% complete.

The chats can display stickers and text messages (with standalone emoji 🐶)

Please, leave your feedback and have fun!

Regards,
Fluffy Panda.

The app uses tdweb, which leads to significant amount of downloadable code and slow speed overall. Transferred size: 2.6MB. The current tdweb implementation is not correct since the UI is displayed only after wasm is downloaded.

The contest task is almost completed except for profile picture uploading for the sign up flow.

The design of the app doesn't fully comply with the provided mockups both for login (the country selector, the 'Keep me signed in' check) and chats screens. Chats design: chats headers lack the icons. Profile pictures in groups are missing; last seen timestamps are incorrect and showing offline for people, bots and groups. Incorrect size of media files.

Some other things: the monkey animations are not implemented; the 'Next' button appears immediately after entering a single digit; reverse scrolling.

On the plus side, the app supports several media types, and 2SV hints.

8 mb of resources. Too heavy.

inverted scrolling direction; no animations; cant send messages