https://github.com/myl7/tdl-viewer
Telegram-like viewer for tdl chat exports and downloaded media
https://github.com/myl7/tdl-viewer
nextjs tdl telegram viewer
Last synced: 30 days ago
JSON representation
Telegram-like viewer for tdl chat exports and downloaded media
- Host: GitHub
- URL: https://github.com/myl7/tdl-viewer
- Owner: myl7
- License: apache-2.0
- Created: 2026-02-28T13:57:46.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2026-03-21T13:52:26.000Z (3 months ago)
- Last Synced: 2026-03-22T04:17:52.122Z (3 months ago)
- Topics: nextjs, tdl, telegram, viewer
- Language: TypeScript
- Homepage:
- Size: 109 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
- Agents: AGENTS.md
Awesome Lists containing this project
README
# tdl-viewer
Telegram Web-style viewer for browsing multiple tdl chat exports with media playback
## Features
- Multi-channel support with a collapsible sidebar for switching between channels
- Telegram Web-style chat bubble layout with infinite scroll
- Rich text rendering with hyperlink entities and automatic URL detection
- Inline image preview with click-to-zoom
- Video and audio playback with seek support
- File download for non-media attachments
- Per-message Raw JSON inspector
### Supported media
| Type | Extensions |
| ----- | ------------------------------- |
| Image | jpg, jpeg, png, gif, webp, bmp |
| Video | mp4, webm, mov, mkv |
| Audio | mp3, m4a, aac, wav, ogg, flac |
| File | everything else (download only) |
## Get Started
### 1. Export messages
Export messages from a target chat or channel (`CHAT` can be a username, link, or ID):
```bash
tdl chat export -c CHAT --all --with-content --raw -o tdl-export.json
```
### 2. Download attachments
```bash
tdl dl -f tdl-export.json -d downloads
```
### 3. Organize channel data
Place each channel's export and downloads into a subdirectory under `channels/`:
```
channels/
my_channel/
tdl-export.json
downloads/
another_channel_@someid/
tdl-export.json
downloads/
```
Directory names follow the format `{channel_name}` or `{channel_name}_@{channel_str_id}`. The `_@{channel_str_id}` suffix is optional and will be displayed in the sidebar when present.
### 4. Run the viewer
```bash
pnpm install
pnpm dev
```
Open http://localhost:3000.
## Config
| Option | Type | Default | Description |
| -------------- | --------------- | ---------- | ------------------------------------------------------- |
| `CHANNELS_DIR` | Environment var | `channels` | Path to the directory containing channel subdirectories |
Attachments are matched by the `{channel_id}_{msg_id}_` prefix, so renamed files (e.g. spaces replaced with underscores by `tdl dl`) are resolved correctly.
## Limitations
- Designed for local offline browsing only; no authentication or access control
- No message editing, replying, searching, or real-time sync
## License
Copyright (C) 2026 Yulong Ming .
Apache License, Version 2.0.