element-hq / element-x-ios

Next generation Matrix client for iOS built with SwiftUI on top of matrix-rust-sdk.

Element X iOS

ElementX iOS is a Matrix iOS Client provided by Element.

The application is a total rewrite of Element-iOS using the Matrix Rust SDK underneath and targetting devices running iOS 16+.

Rust SDK

ElementX leverages the Matrix Rust SDK through an FFI layer exposed as a swift package that the final client can directly import and use.

We're doing this as a way to share code between platforms and while we've seen promising results it's still in the experimental stage and bound to change.

Status

This project is in work in progress. The app does not cover yet all functionalities we expect.

Contributing

Please see our contribution guide.

Come chat with the community in the dedicated Matrix room.

Build instructions

Please refer to the setting up a development environment section from the contribution guide.

Support

When you are experiencing an issue on ElementX iOS, please first search in GitHub issues and then in #element-x-ios:matrix.org. If after your research you still have a question, ask at #element-x-ios:matrix.org. Otherwise feel free to create a GitHub issue if you encounter a bug or a crash, by explaining clearly in detail what happened. You can also perform bug reporting (Rageshake) from the Element application by shaking your phone or going to the application settings. This is especially recommended when you encounter a crash.

Forking

Please read our forking guide.

Copyright & License

Copyright (c) 2022 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this work except in compliance with the License. You may obtain a copy of the License in the LICENSE file, or at:

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

element-x-ios's Issues

Set up danger

To add automatic sanity check like:

• Changelog file
• Sign-off
• ~Test coverage check - https://github.com/f-meloni/danger-swift-coverage\~ failed. Will use codecov.io instead
• Swiflint checks - https://github.com/danger/swift/blob/master/Documentation/tutorials/ios\_app.html.md

Set up rageshakes

We need:

• Log file storage
• UI to create and share a rageshake
• Check if we want to reuse EI rageshake server
• Investigate the redacted view modifier for screenshot uploading

Reuse strings from Element-Android

We want to reuse them for several reasons:

• Android is better for supporting plurals
• Better parity between mobile apps
• Less work for translators

We want to rely entirely on them. This means the iOS developer will have to:

• add strings first on the Android project and PR them
• run a script to retrieve from the EA repo

This script could be run like xcodegen when you set up the project.

The final strategy is still to be defined. As part of this research project, we need to define what will be the best (or least bad) in term of devx.

Open questions:

• Should those generated strings be in git?
• ...

Adopt Swift structured concurrency

We need to refactor our code to use Swift's new structured concurrency instead of the existing GCD based implementation. Ideally we should let the system to most of the work down to the FFI integration layer.

Timeout on /login needs to be much longer.

For whatever reason, /login for some accounts on some servers can take over 30s (up to 90s or so). But it looks like we have a request timeout of ~30s, which is too short.

Sync v3

We need:

• to check product implication. This feature can change the UI.
• feature ready in the SDK
• /issues/65

Add readme file

Try replicating the element android structure.

I want to see the sending state in the timeline

As an user I would like to see the sending state of recently sent messages:

• show an icon indicating that the message is currently in local echo state
• show another icon when the message has been sent
• remove all icons after a small delay

We don't currently have designs for this but it's not a big concern as tweaking things SwiftUI side is easy. Please use current Element for inspiration e.g. empty circle while in local echo, circle with checkmark after sent.

Rust SDK issue: matrix-org/matrix-rust-sdk#639

Bug report screen should disappear after sending

It feels weird to stay on this screen after upload. It looks like there is a sending issue.

Adopt SlidingSync interface

I want to sign in with OIDC

OIDC starts to be ready. We should showcase it using ElementX-iOS Alpha. It will help the OIDC team to get more feedbacks and to improve the UX.

After #40, we need to detect from the selected homeserver .well-known the .m.authentication field (example) and to display a "Log in via OIDC" that will open the authentication web service.

A sample swift app is available here.
Test homeserver with OIDC: https://synapse-oidc.lab.element.dev/
Hydrogen with OIDC in action: https://hydrogen-oidc.lab.element.dev/

I want to verify my new login

We need to think more about what can be the minimal things to cross-sign this new device just after logging in.

• Design question: can we reuse the same design as EI to verify a device?
• Rewrite everything using the new SwiftUI template

Set up test coverage

We also need to find a way to track this metric.

Set up Xcodegen and Swiftgen

Set up ElementX PR

The current Element Alpha but for EX.

Integrate with Sentry.io

DesignKit component

The new Design Kit project should start in EIX as a swift package that EI could use.

Todo

• Handle some rogue colours that have creeped into the EI theme.
• Check in the package.resolved file in EI.
• Try to generate namesAndAvatars array from the style dictionary.
• Consider whether or not fonts can be generated by the style dictionary.
• Migrate DesignKit to use vector-im/compound-design-tokens

Room screen: Timeline UI

We only know that ElementX will use message bubbles.

Can we reuse the design recently implemented on EI?

Room screen: Header UI

We need an header to use in the room screen.

We could simply reused the one in this [design](https://www.figma.com/file/zVtAKK0hzKu5JkpbzlE1pG/Message-Bubbles?node-id=1%3A29\] with no call buttons

I want to see room messages

• HTML messages, emotes, notifications
• Images with blur hash
• Video snapshots
• Files
• Replies
• Reactions in the timeline
• Edits
• Read Receipts
• Option to see all messages for debugging

Rust SDK issue: matrix-org/matrix-rust-sdk#637
UI issue: #34

Research deep linking libraries

In order to prepare for opening permalinks and deep linking we should investigate available 3rd party libraries find one that fits our needs.

https://github.com/pointfreeco/swift-url-routing seems like a very good fit

I want to see my room list

We need to display:

• Room avatar, display name
• Last message, last message sender display name, timestamp
• Unread count, missed notification count

The app has different ways to present room list. We need to be able to query the SDK :

• Sorting by:
  • Recently updated
  • Alphabetically by room name
• Filter by:
  • Room name
  • Tags (Favorites, ...)
  • Type: DM, room, space
  • Invitation
• Pagination for performance reasons

We also need from the SDK:

• Room list updates
• Cache for displayed data. This is the first displayed screen by the app. It must be instant (It currently takes 10s to load the big test account on EIX)

Rust SDK issue: matrix-org/matrix-rust-sdk#634
UI: #30

Danger: Add checks for `png` files

And suggest using SVG or PDF files instead.

Rageshake Service

We need to have a fresh new and robust service to send rageshakes:

• Rage shake detection
• Upload EIX and SDK logs
• Last crash
• Text description
• Screenshot
• Anonymised Screenshot would be nice

The UI will be managed in #24.

Danger doesn't detect new changelog files.

If you create a PR with a new changelog file, Danger comments that you should add one. It looks like it is only checking modified files rather than new files, but switching this line to use editedFiles didn't seem to work when I tested it on a PR.

I want to post content

• text / MD
• Media library
• files
• reactions
• reply
• retry on everything
• read markers

Later:
voice messages, polls, Location sharing, LLS, stickers

Rust issue: matrix-org/matrix-rust-sdk#636
Text composer UI: #29

Support for Right to left like Arabic languages

It would be nice to have support for RTL in element x.

Improve timeline composer keyboard presentation animation

When presenting the keyboard on the timeline the desired behavior is to keep the timeline at the bottom if it was already there. This means hooking into the underlying scroll view and manually pinning it while frames change. This also applies to rotations.
The current implementation relies key value observing the SwiftUI's list underlying tableView offset. Stealing away its delegate is not a viable solution (unless we proxy all the methods).

We need to find a solution to make this smooth.

Info.plist crash on Mac app

ElementInfoPlist crashes on Mac app.

Permalink support

We need to be able to:

• open a particular room from a permalink
• be able to join said room if not already joined
• back and forward paginate
• navigate through several permalinks

Rust SDK issue: matrix-org/matrix-rust-sdk#638

https://github.com/pointfreeco/swift-url-routing seems like a very good fit

Minimal Settings Screen UI

We need a very minimal way to

• logout
• Report bug
• App version + Build number
• Build number navigates to the release / PR

Nightly builds on Xcode cloud

We want to automate the release of develop builds so that we can have feedbacks sooner a la develop.element.io.

• Requires #131

STATE_ERROR_VALIDATION_ERROR for ID

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

Design an efficient way to manage list data through FFI

We have different lists containing live data that need to be provided by the Rust SDK:

• room lists. They can be built (with all sort of queries)
• room timeline both live and from a permalink
• room members

Those list can be large with thousands of items. Items can be updated in live in all manners: item update, insertion, deletion and move.
We need to find a way for the SDK to share list diff updates. The update mechanism needs

• to go through the FFI layer
• to work for any bindings
• to be consumable for reactive programming used in element apps. We can have a extra layer at the top of the bindings to make the mechanism more native to the final language

Stephan wrote an interface proposal doc. It is highly swift oriented but it is very good start for discussion.

Rust SDK issue: matrix-org/matrix-rust-sdk#642

I want the app to stop syncing when going to background

but it needs to finish pending uploads before stopping everything.

We need a pause/resume mechanism in the SDK:

Rust SDK issue: matrix-org/matrix-rust-sdk#633

Setup Brewfile

To allow installing dependencies through brew bundle

• Swifgen
• Swiftlint
• Xcodegen

Set up towncrier

Set up Nightly builds

We want to automate the release of develop builds so that we can have feedbacks sooner a la develop.element.io.

Adjustable text size

Is your feature request related to a problem? Please describe.
As a user with reduced eyesight, I struggle with the size of the text and UI in general (of the old iOS app).

Describe the solution you'd like
I want the app to support the iOS system-wide Text settings, in particular the Larger Text setting. The settings are described here: https://support.apple.com/guide/iphone/display-text-size-iph3e2e1fb0/ios

Setup performance testing

In which we leverage the existing UI testing infrastructure to benchmark high level actions like logging in to a test account using XCTest primitives https://developer.apple.com/documentation/xctest/performance\_tests

Text Composer UI

Can we reuse the text composer from EI?

Timeline composer interactive dismissal

SwiftUI does not provide support for interactive dismissal of the timeline composer. Dragging the keyboard down does work but the SwiftUI view doesn't get resized at all during the process.

The app is currently configured to dismiss on drag, meaning that it will hide the keyboard entirely any time a drag is detected on the timeline, upwards or downwards.

We need to find a way around this and make it feel nicer.

Room list UI

This is a part of IA. We will reuse discoveries from the Delight team

Set up screenshot tests

We would like to use snapshots for our UI tests to speed up repetitive tasks and better resolution.

It seems that the 2 main contenders are:

• https://github.com/pointfreeco/swift-snapshot-testing
• https://github.com/uber/ios-snapshot-test-case

We should play around with both and see which one we like better.

We also need to find a solution for restoring artefacts between successive runs so we have something to compare with.

It's still up for discussion whether this should be done on Github Actions or Xcode Cloud, mainly because we don't have access to Xcode Cloud yet.

We also talked about adding debug borders around all views to improve snapshot accuracy and, if speedy enough, we can use snapshots within the integration tests as well.

I want to sign in with a password

We can reuse the new screen for this use case.
Other authentication flow including registration will be managed by OIDC.

Rageshake UI

We need a screen and UX to report bug via rage shake:

• Text description
• Optional logs
• Optional screenshot
• Anonymised screenshot would be nice

Add an Element-X label to reported issues to the rageshake server

So that we can triage issues more easily.

Introduce State Machine component

In order to better track app states we would like to introduce a FSM component that will hard assert that states transitions are correct.
We will use SwiftState and for starters we will rebuild the AppCoordinator on top of it.

Add license

We should add a license, in preparation for a future release.

Add contribution guide

Try to inspire ourselves from the android version.