Mobile UI for desktop

@yenda, no, not a fork. I created a module that uses react-navigation - GitHub - vkjr/react-native-navigation-twopane
And I used documentation from react-navigation 3, so we should be good, I believe basic API is the same

1 Like

@hester, I also noticed that welcome screen doesnā€™t look correct in landscape mode. So yeah, image settings should be checked. It is not related to two-pane UI itself, I believe.

1 Like

yes itā€™s not relative , they are developed only for mobile, so they resize full screen with fixed margins in px

great progress! :smiley:
also, love to see so much interest in this topic :smiley:

What would be required to set relative margins? (and would this fix it?)

Progress update:

Problems:
Code from PR worked fine with react-navigation v2, but after status-react moved to react-navigation v3 one glitch appeared - every time user switches between chats whole screen re-renders 2 times. So PR is still WIP and Iā€™m looking into this issue.

2 Likes

Progress update:
After a bunch of fixes 2-pane ui for mobile platforms finally merged!

So now it is time to make mobile ui the default one for desktop platforms.

4 Likes

great work guys. Looking forward to using the new desktop ui.

@volodymyr.kozieiev could you confirm that if we remove realm it will be much easier to remove the ubuntu-server? Iā€™m making a plan to remove realm WIP Removing realm - CodiMD

3 Likes

@yenda, yes, it is correct!

hey @volodymyr.kozieiev what are our next steps? can we use mobile screens and remove desktop ones?

@andrey, correct, these are next steps:

  • run 2-pane mobile UI on desktop,
  • make mobile UI default for desktop,
  • remove old desktop UI

Right now working on the first one .

1 Like

Current issue:
We already have flag in .env file that enables mobile ui for desktop. But since it was last checked mobile ui switched to react-navigation v3. And newer navigation depends on react-native-gesture-handler library that provides native (ios and android) ways to deal with gestures. It looks like we need to support this library on desktop to reuse latest mobile UI :-/

what project is this?

Progress update:

  • react-native-gesture-handler mock created

After this few problems revealed that fixed in `react-native-desktop:

  • Added implementation of pointerEvents property of View
  • Fixed internal events propagation.

Now 2-pane mobile UI works fine with desktop. PR with test builds created. It needs full testing to find all small issues before merging to develop.
So far known issues are:

  • Text input in chat gains focus only when clicked in the leftmost part of area.
  • Window that opens after click on ā€œshare my profileā€ has broken layout

Working on them.

6 Likes

Volodymyr youā€™re a one man army, incredible work man!

1 Like

Progress update:

  • Fixed issue with text input focus and not always working ā€œsendā€ button in chat.
  • Started work on implementing shadows in react-native-desktop View component. It is crucial for design.

Bunch of issues were collected for mobile UI desktop builds. Most of them are desirable UI improvements but some should be implemented on react-native-desktop side, like shadows mentioned above.

Note: Iā€™m on a long vacation till 2nd September, so will continue when return.

2 Likes

Quick update:
I returned from vacation and continue 2-pane UI. A lot of changes were made in develop during these 3 weeks, so fixes needed to make 2-pane PR work again. So far desktop compiling was fixed in develop branch and added missed functions in react-native-status. Now working on problem with logging in on desktop.

5 Likes

Any recent updates about this?

1 Like

@jakubgs,
During this time was fixed issue with login, keychain build (thanks @pedro), desktop icons.
Currently desktop builds and runs successfully on my local computer. For jenkins tests should be fixed. This is in progress now.