tmail-flutter icon indicating copy to clipboard operation
tmail-flutter copied to clipboard

[PART 2] Migrate `dev-features` to `dev`

Open dab246 opened this issue 1 year ago • 21 comments

Issues

  • [x] Part of the content is lost when replying or forwarding emails
  • [x] The editor background appears gray when the waning dialog appears
  • [x] Overflow height delete identity dialog on mobile
  • [x] Avoid fetching again identity lists in SingleEmailController

Dependent

  • Need merged:
    • https://github.com/linagora/enough_html_editor/pull/32

Resolved

  • Part of the content is lost when replying or forwarding emails

https://github.com/linagora/tmail-flutter/assets/80730648/1d0c7518-7183-40bc-b43c-bbba2c758ea0

  • The editor background appears gray when the waning dialog appears

https://github.com/linagora/tmail-flutter/assets/80730648/d8d50fe0-981e-420b-a81d-a3a0762727e8

Related

  • https://github.com/linagora/tmail-flutter/pull/2807

dab246 avatar Apr 24 '24 01:04 dab246

This PR has been deployed to https://linagora.github.io/tmail-flutter/2826.

github-actions[bot] avatar Apr 24 '24 02:04 github-actions[bot]

Still found the cut in composer Android

IMG_4402

hoangdat avatar Apr 26 '24 09:04 hoangdat

  • [ ] cancel sending or saving draft, composer will be closed -> please avoid it

hoangdat avatar Apr 26 '24 09:04 hoangdat

  • [x] cancel sending or saving draft, composer will be closed -> please avoid it

Fixed, please see video demo below:

  • Web

https://github.com/linagora/tmail-flutter/assets/80730648/1571735d-5b37-4d29-b174-c32bf803c75c

  • Mobile

demo-mobile.webm

  • Sending offline

Screen_recording_20240426_185308.webm

dab246 avatar Apr 26 '24 10:04 dab246

  • close composer, save dialog show, click on back button -> can not show saving dialog anymore

hoangdat avatar Apr 26 '24 16:04 hoangdat

  • close composer, save dialog show, click on back button -> can not show saving dialog anymore

Please attach video demo. thanks.

dab246 avatar Apr 29 '24 01:04 dab246

[x] close composer, save dialog show, click on back button -> can not show saving dialog anymore

Fixed. Please see video demo below

Screen_recording_20240502_152831.webm

dab246 avatar May 02 '24 01:05 dab246

  • [x] test in Android, email which have very long and rich html: reply many times @tddang-linagora

hoangdat avatar May 03 '24 02:05 hoangdat

  • [x] test in Android, email which have very long and rich html: reply many times @tddang-linagora

https://github.com/linagora/tmail-flutter/assets/160106668/6458b728-33ba-407d-a0e8-71fbec84cfd2

tddang-linagora avatar May 03 '24 03:05 tddang-linagora

https://github.com/linagora/tmail-flutter/assets/160106668/14910f18-3009-4da1-8b1c-2e004c276ffd

tddang-linagora avatar May 06 '24 03:05 tddang-linagora

RPReplay_Final1714967535.mp4

Possible cause The lazy-loading components won't load until they are scrolled to, and the height-calculating logic won't trigger again after lazy-loading components are completely loaded

Proposal Remove all lazy-loading attribute among components. Inside the onLoaded() of HtmlEditorState in enough_html_editor, add these lines above every existed lines:

var lazyLoadingComponents = document.querySelectorAll('*');
for (var i = 0; i < lazyLoadingComponents.length; i++) {
  if (lazyLoadingComponents[i].getAttribute('loading')) {
    lazyLoadingComponents[i].removeAttribute('loading');
  }
}

Trade-offs TMail won't benefit from lazy-loading in composing email anymore

Demo solution

https://github.com/linagora/tmail-flutter/assets/160106668/c435b214-4913-409d-bbea-367f4659a92c

Read more

  • https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading#images_and_iframes
  • https://stackoverflow.com/a/65006363/23727759

@dab246 @hoangdat What do you think?

tddang-linagora avatar May 06 '24 06:05 tddang-linagora

RPReplay_Final1714967535.mp4

Possible cause The lazy-loading components won't load until they are scrolled to, and the height-calculating logic won't trigger again after lazy-loading components are completely loaded

Proposal Remove all lazy-loading attribute among components. Inside the onLoaded() of HtmlEditorState in enough_html_editor, add these lines above every existed lines:

var lazyLoadingComponents = document.querySelectorAll('*');
for (var i = 0; i < lazyLoadingComponents.length; i++) {
  if (lazyLoadingComponents[i].getAttribute('loading')) {
    lazyLoadingComponents[i].removeAttribute('loading');
  }
}

Trade-offs TMail won't benefit from lazy-loading in viewing email anymore

Demo solution

RPReplay_Final1714977866.mp4 Read more

  • https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading#images_and_iframes
  • https://stackoverflow.com/a/65006363/23727759

@dab246 @hoangdat What do you think?

We only allow removing lazy loading in composer. Let's try that direction.

dab246 avatar May 06 '24 06:05 dab246

var lazyLoadingComponents = document.querySelectorAll('*');
for (var i = 0; i < lazyLoadingComponents.length; i++) {
 if (lazyLoadingComponents[i].getAttribute('loading')) {
   lazyLoadingComponents[i].removeAttribute('loading');
 }
}

Takes only img tags


dab246 avatar May 06 '24 07:05 dab246

var lazyLoadingComponents = document.querySelectorAll('*');
for (var i = 0; i < lazyLoadingComponents.length; i++) {
 if (lazyLoadingComponents[i].getAttribute('loading')) {
   lazyLoadingComponents[i].removeAttribute('loading');
 }
}

Takes only img tags


Lazy-loading can also exist inside iframe element with image url. Consider iframe too.

tddang-linagora avatar May 06 '24 07:05 tddang-linagora

var lazyLoadingComponents = document.querySelectorAll('*');
for (var i = 0; i < lazyLoadingComponents.length; i++) {
 if (lazyLoadingComponents[i].getAttribute('loading')) {
   lazyLoadingComponents[i].removeAttribute('loading');
 }
}

Takes only img tags


Lazy-loading can also exist inside iframe element with image url. Consider iframe too.

No we need to process it before putting it in the iframe

dab246 avatar May 06 '24 07:05 dab246

var lazyLoadingComponents = document.querySelectorAll('*');
for (var i = 0; i < lazyLoadingComponents.length; i++) {
 if (lazyLoadingComponents[i].getAttribute('loading')) {
   lazyLoadingComponents[i].removeAttribute('loading');
 }
}

Takes only img tags


Lazy-loading can also exist inside iframe element with image url. Consider iframe too.

No we need to process it before putting it in the iframe

or simply query for tags with a loading attribute

dab246 avatar May 06 '24 07:05 dab246

  • [x] optimize query components
  • [x] transformer to remove lazy load -> add it to

hoangdat avatar May 07 '24 02:05 hoangdat

  • [x] optimize query components
  • [x] transformer to remove lazy load -> add it to

Please attach demo video after fixed lazy loading

dab246 avatar May 07 '24 05:05 dab246

  • [x] optimize query components
  • [x] transformer to remove lazy load -> add it to

Please attach demo video after fixed lazy loading

https://github.com/linagora/tmail-flutter/assets/160106668/c435b214-4913-409d-bbea-367f4659a92c

tddang-linagora avatar May 07 '24 07:05 tddang-linagora

Quoted content is clipped before signature loaded

https://github.com/linagora/tmail-flutter/assets/160106668/476e13d0-5cb2-4f88-b1cf-5dc29bc09827

tddang-linagora avatar May 09 '24 02:05 tddang-linagora

Work around - Show toast

https://github.com/linagora/tmail-flutter/assets/160106668/7d600512-7f1d-456d-8f0d-65f6c5d3e982

tddang-linagora avatar May 09 '24 08:05 tddang-linagora

Crashed eml when open Crashed_20240520-Re_Fwd_ 📢 USDC on Polkadot _ 8x Scalability Update _ Blockspace Explained-1148.eml.zip

Reproduce step:

  1. open message: original.eml.zip
  2. load message completed in email view
  3. reply
  4. send when this message is not load completed in composer
  5. open sent folder -> open mail from sent -> crashed

https://github.com/linagora/tmail-flutter/assets/6462404/4a7b42e4-5a24-446e-90d4-cf1ca42da351

hoangdat avatar May 20 '24 09:05 hoangdat

  • [ ] mail is stuck in loading in composer. Always show toast Email content is being loaded. Fx: medium in Vietnam.

hoangdat avatar May 20 '24 10:05 hoangdat

Crashed eml when open Crashed_20240520-Re_Fwd_ 📢 USDC on Polkadot _ 8x Scalability Update _ Blockspace Explained-1148.eml.zip

Reproduce step:

  1. open message: original.eml.zip
  2. load message completed in email view
  3. reply
  4. send when this message is not load completed in composer
  5. open sent folder -> open mail from sent -> crashed

Screenrecorder-2024-05-20-15-17-22-206.mp4

Cannot reproduce on virtual machine. Testing on real device Oppo F7

  • [x] mail is stuck in loading in composer. Always show toast Email content is being loaded. Fx: medium in Vietnam.

Fixed

https://github.com/linagora/tmail-flutter/assets/80730648/2ded599a-d5ac-4f27-8f23-ad53efebdd4f

dab246 avatar May 21 '24 07:05 dab246

I still have stuck when some content is blocked to fetch

https://github.com/linagora/tmail-flutter/assets/6462404/faadf5d5-c1ea-4187-95f0-f5958fc7f009

hoangdat avatar May 22 '24 12:05 hoangdat

I still have stuck when some content is blocked to fetch

Screenrecorder-2024-05-22-18-51-02-99.mp4

Please fetch latest commit to test again.

dab246 avatar May 23 '24 02:05 dab246

  • [x] Fix crash when open composer on Android 12 (Xiaomi)

https://github.com/linagora/tmail-flutter/assets/80730648/cf08f42f-f624-4a9f-9a68-285a323cd68a

  • [x] Fix size Discard Change button in dialog composer

Screen_recording_20240524_163336.webm

@hoangdat Please help me test again on your Xiaomi device. Thanks.

dab246 avatar May 24 '24 09:05 dab246