element-hq / element-hq/element-web

Migrate timeline tiles to shared components

Open
#31,651 1 comment 0 reactions 0 assignees View on GitHub
A-Developer-Experience A-Timeline T-Story
Dominant language
TypeScript
Stars
13.5k
Forks
2.8k
PR merge metrics
PR metrics pending

Description

This issue is to track the migration of timeline tile to [shared components](https://github.com/element-hq/element-web/tree/develop/packages/shared-components).

**Core Timeline Tiles**
| Status | Tile | Architecture | PR |
| ------ | ----------------------------- | ---------------- | ---------------------------------------------------- |
| ✅| DateSeparator.tsx | MVVM | https://github.com/element-hq/element-web/pull/32482 |
| ✅| TimelineSeparator.tsx | Shared Component | https://github.com/element-hq/element-web/pull/31937 |
| ✅| DecryptionFailureBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/31829 |
| ✅| DisambiguatedProfile.tsx | MVVM | https://github.com/element-hq/element-web/pull/31835 |
| ✅| EncryptionEvent.tsx | MVVM | https://github.com/element-hq/element-web/pull/32531 |
| ✅| EventContentBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/31914 |
| ✅| EventTileBubble.tsx | Shared Component | https://github.com/element-hq/element-web/pull/31911 |
| ✅| MAudioBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/30386 |
| ✅| TextualEvent.tsx | MVVM | https://github.com/element-hq/element-web/pull/30216 |
| | SenderProfile.tsx | MVVM | https://github.com/element-hq/element-web/pull/32529 Blocked |
| ✅ | TextualBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/33165 |
| | MessageEvent.tsx | MVVM | https://github.com/element-hq/element-web/pull/33080 @rbondesson |
| ✅| MFileBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/32730 |
| ✅| MessageTimestamp.tsx | MVVM | https://github.com/element-hq/element-web/pull/31988 |
| ✅| MessageActionBar.tsx | MVVM | https://github.com/element-hq/element-web/pull/32784 |
| ✅| MImageBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/33212 |
| | MImageReplyBody.tsx | MVVM | Phase 1 https://github.com/element-hq/element-web/pull/33517 |
| ✅| MVideoBody.tsx | MVVM | https://github.com/element-hq/element-web/pull/32849 |
| ✅| ReactionsRow.tsx | MVVM | https://github.com/element-hq/element-web/pull/32634 |
| ✅| ReactionsRowButton.tsx | MVVM | https://github.com/element-hq/element-web/pull/31993 |
| ✅| ReactionsRowButtonTooltip.tsx | MVVM | https://github.com/element-hq/element-web/pull/31866 |
| ✅| TileErrorBoundary | | https://github.com/element-hq/element-web/pull/32793 |
| ✅| PinnedMessageBadge | | https://github.com/element-hq/element-web/pull/32768 |
| ✅ | create ReadMarkerView from readMarkerForEvent in MessagePanel| | https://github.com/element-hq/element-web/pull/32777 |
|✅ | RedactedBody.tsx | | https://github.com/element-hq/element-web/pull/32772 |
| ✅| E2ePadlock.tsx | | https://github.com/element-hq/element-web/pull/33538 |
| ✅| E2eMessageSharedIcon.tsx | | https://github.com/element-hq/element-web/pull/33544|
| | ReplyChain.tsx | | https://github.com/element-hq/element-web/pull/34755 |
|✅ | ReplyTile.tsx | | https://github.com/element-hq/element-web/pull/34617 |
| ✅ | ThreadSummary.tsx | |https://github.com/element-hq/element-web/pull/33603 |
| ✅ | EventPreview.tsx | | https://github.com/element-hq/element-web/pull/33646 |
| | ReadReceiptGroup.tsx | | |
| | ReadReceiptMarker.tsx | | |
|✅ | NotificationBadge.tsx | | https://github.com/element-hq/element-web/pull/33843|
| ✅ | UnreadNotificationBadge.tsx | | https://github.com/element-hq/element-web/pull/33672 |
|✅ | RoomAvatar.tsx | | https://github.com/element-hq/element-web/pull/33937 |
| | MessageContextMenu.tsx | | |
| ✅ | EmojiPicker.tsx | | https://github.com/element-hq/element-web/pull/33650, https://github.com/element-hq/element-web/pull/34337 |
| | ContextMenu.tsx | | |

**Remaining tiles**
- [ ] CallEvent.tsx
- [ ] CodeBlock.tsx
- [x] HiddenBody.tsx https://github.com/element-hq/element-web/pull/33403
- [x] ~DownloadActionButton.tsx - Replaced in PR 32784~
- [ ] EditHistoryMessage.tsx
- [x] HiddenMediaPlaceholder.tsx https://github.com/element-hq/element-web/pull/33404
- [x] ~HideActionButton.tsx - Replaced in PR 32784~
- [x] ~JumpToDatePicker.tsx - Replaced in PR 32482~
- [ ] LegacyCallEvent.tsx
- [ ] MBeaconBody.tsx
- [x] MJitsiWidgetEvent.tsx https://github.com/element-hq/element-web/pull/33457
- [x] MjolnirBody.tsx https://github.com/element-hq/element-web/pull/33407
- [x] MKeyVerificationRequest.tsx https://github.com/element-hq/element-web/pull/33461
- [ ] MLocationBody.tsx
- [ ] MPollBody.tsx
- [ ] ~MStickerBody.tsx~
- [ ] MVoiceMessageBody.tsx
- [ ] MVoiceOrAudioBody.tsx
- [x] RoomAvatarEvent.tsx https://github.com/element-hq/element-web/pull/33473
- [ ] RoomPredecessorTile.tsx
- [x] UnknownBody.tsx https://github.com/element-hq/element-web/pull/33406
- [x] ViewSourceEvent.tsx https://github.com/element-hq/element-web/pull/33428

Contributor guide

Open the contributing guide

Research direction

Start by reviewing the remaining tile names in the issue, such as CallEvent.tsx, CodeBlock.tsx, and MLocationBody.tsx, alongside packages/shared-components. Check the linked migration pull requests to understand the established approach; done means a selected remaining tile is migrated and its entry is updated from unchecked to complete.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Refactor
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.