Explore

Mobile App Developer Task - Agency Handy

Objective

Build a small mobile chat module aligned with the provided Figma. The app use Pusher for real-time events. No backend API integration is required.

We want to evaluate:

Project structure

State ownership

Real-time event handling

Test coverage and testing mindset

Use mock/local data where needed, but the architecture must allow backend APIs to be plugged in later.

Must-have Screens

Figma:

https://www.figma.com/design/M9HArBXn7uOxXJw5NKJf5x/Mobile-Chat-Application?node-id=13012-82078&p=f&t=QGAvUe2e4uZzGAeZ-0⁠

1) Inbox Screen (Conversation List)

List of conversations (1–1 + group)

Search by chat name

Each conversation item shows:

Avatar

Title (username or group name)

Last message preview

Timestamp

Notes:

Local filtering only (no backend search)

Unread count is optional (bonus)

2) New Chat Screen

Show list of users

Selecting:

One user → open User Chat

Multiple users → open Group Chat

Show selected users visually

No backend creation logic (UI + state only)

3) User Chat Screen

Message list

Send text message

Optimistic UI (message appears immediately)

Typing indicator (single user)

Message status simulated locally:

Sent → Delivered → Seen

4) Group Chat Screen

Same as User Chat, plus:

Sender name shown above messages

Typing indicator supports multiple users

Real-time Requirements (Pusher)

Use Pusher Channels for only these events:

message:newndw → Add message to active chat

typing:start → Show typing indicator

typing:stop → Hide typing indicator

Message status (Sent / Delivered / Seen) can be handled locally without Pusher events.

Pusher logic must live in a dedicated service layer, not inside UI components.

No Backend

It is acceptable to use:

Pusher client events

A mock service inside the app

A debug button or panel to trigger events

What matters is that the design clearly allows replacing mocks with real APIs later.

Data Layer Expectations

Preferred structure:

ui/ → Screens and UI components

domain/ → Models and state logic

data/ → Repositories / mock data sources

realtime/ → Pusher setup and event mapping

storage/ → In-memory or local cache

We want to see:

Clear ownership of state:

Inbox state

Active chat state

Typing indicator state

Clean mapping:

Pusher events → state updates

Business logic testable without UI

Testing Requirements

Required

A Test Plan in the README (what you tested and why)

Automated tests:

At least 3 unit tests

At least 1 UI / widget test

Basic coverage report

Suggested Unit Tests

Message is added on message:new

Typing indicator start/stop logic

Search filtering logic

Group chat shows sender name

Suggested UI Test

Chat screen updates when a mock real-time event is received

Submission

GitHub repository

APK file

README must include:

Setup steps + Pusher key configuration

Short architecture explanation

State management choice and reasoning

Test plan + covered cases

Tradeoffs and assumptions

Want to print your doc?
This is not the way.

Try clicking the ··· in the right corner or using a keyboard shortcut (

CtrlP

) instead.