# Real-Time Updates (Socket.IO) {#real-time-updates-socketio}


Client-side real-time updates using Socket.IO.


## Overview {#overview}


Gauzy uses Socket.IO on the frontend for:

- Live timer status across team members
- Instant notifications
- Real-time dashboard updates
- Collaborative editing signals


## Socket Service {#socket-service}


```typescript
@Injectable()
export class SocketService {
  private socket: Socket;

  constructor(private authService: AuthService) {}

  connect() {
    this.socket = io(environment.API_BASE_URL, {
      auth: { token: this.authService.getToken() },
    });

    this.socket.on("connect", () => {
      console.log("WebSocket connected");
    });
  }

  onTimerStarted(callback: (data: any) => void) {
    this.socket.on("timer-started", callback);
  }

  onNotification(callback: (data: any) => void) {
    this.socket.on("notification", callback);
  }

  disconnect() {
    this.socket?.disconnect();
  }
}
```


## Usage in Components {#usage-in-components}


```typescript
@Component({ ... })
export class TeamDashboardComponent implements OnInit, OnDestroy {
  constructor(private socketService: SocketService) {}

  ngOnInit() {
    this.socketService.onTimerStarted((data) => {
      this.updateTeamMemberStatus(data);
    });
  }

  ngOnDestroy() {
    this.socketService.disconnect();
  }
}
```


## Events Reference {#events-reference}


| Event           | Payload                    | Description      |
| --------------- | -------------------------- | ---------------- |
| `timer-started` | `{ employeeId, task }`     | Timer started    |
| `timer-stopped` | `{ employeeId, duration }` | Timer stopped    |
| `notification`  | `{ type, message }`        | New notification |
| `task-updated`  | `{ taskId, changes }`      | Task changed     |
| `screenshot`    | `{ employeeId, url }`      | New screenshot   |


## Related Pages {#related-pages}


- [WebSocket Architecture](https://sourcey-gauzy.pages.dev/architecture/websocket-realtime/index.md) — server-side
- [Employee Notifications](https://sourcey-gauzy.pages.dev/features/employee-notifications/index.md) — notification system