2
0
mirror of https://github.com/status-im/status-mobile.git synced 2025-02-20 04:18:14 +00:00

286 Commits

Author SHA1 Message Date
Icaro Motta
0b4a1545ae
Fix component tests, upgrade Jest & friends, and a few other goodies ()
Fix all component tests after the latest RN upgrade.

Fixes https://github.com/status-im/status-mobile/issues/18157
Closes https://github.com/status-im/status-mobile/pull/18235

Dependency changes

- Upgraded Jest: from 26.6.3 to latest 29.7.0.
- Upgraded @testing-library/jest-native: from 5.3.0 to latest 5.4.3
- Upgraded @testing-library/react-native: from 11.5.4 to 12.4.2
- Removed explicit dependency on jest-circus, this is now the default test
  runner.
- Removed explicit dependency on jest-environment-node. This is handled by the
  package manager.
- Added jest-silent-reporter at version 0.5.0.

### Why component tests were failing?

Many tests were failing because we were using RN Testing Library (RNTL) in an
unreliable fashion. With the recent library upgrades, the unreliability was
excerbated. Other times, the tests were incorrectly arranging data.

### with-redefs does not work with async code

Generally speaking, with-redefs should not be used with async code, assume the
worst. The scope of the macro will cease to exist by the time the async code
runs. In many tests we were using with-redefs, then calling render, but for some
components that use use-effect, JS timers, animations, etc it's unreliable and
were the reason for failures.

It's easy to reproduce too:

```clojure
(defn foo []
  :foo)

(foo)
;; => :foo

(with-redefs [foo (constantly :bar)]
  (foo))
;; => :bar

(js/setTimeout
 (fn []
   (tap> [:calling-foo (foo)]))
 100)
;; Taps [:calling-foo :foo]
;; As you would expect, when running without with-redefs, it prints :foo.

;; So far so good, but whatch what happens with async code:

(with-redefs [foo (constantly :bar)]
  (js/setTimeout
   (fn []
     (tap> [:calling-foo (foo)]))
   100))
;; Taps [:calling-foo :foo]
;; ====> PROBLEM: Taps :foo, not :bar as one might expect
```

### Not waiting on wait-for

When test-helpers.component/wait-for is used, subsequent assertions/etc should
be done after the promise returned by wait-for is resolved. But remember to not
perform side-effects inside the wait-for callback (check out the docs
https://callstack.github.io/react-native-testing-library/docs/api#waitfor).
Most, if not all of our usages of wait-for were not waiting.

#### Improvement 1 - Silence Jest on demand

If you need to re-run component tests frequently, you may want to reduce the
output verbosity. By passing JEST_USE_SILENT_REPORTER=true to make
component-test or make component-test-watch you will see a lot less noise and be
able to focus on what really matters to you.

#### Improvement 2 - Selectively focus/disable tests

Because of our need to first compile CLJS to JS before running tests via Jest,
we couldn't easily skip or focus on specific tests. From this commit onwards, we
should never again have to change the list of requires in files core_spec.cljs.
Commenting out required namespaces gives a bad DX because it causes constant
rebasing issues.

#### Improvement 3 - Translations now work as in prod code (but only English)

Translations performed by *-by-translation-text can be done now without any
workaround under the hood. The query functions are now linted just like
i18n/label, which means static translation keywords must be qualified with :t/,
which is good for consistency.
2023-12-26 11:58:23 -03:00
flexsurfer
31acb8e9c4
improve profile screen performance () 2023-12-22 16:59:12 +01:00
Jamie Caprani
eda8c0ccb0
fix(quo): truncation on wallet account card long name ()
---------

Co-authored-by: Paul Fitzgerald <paulfitz99@gmail.com>
2023-12-22 15:48:57 +00:00
codemaster
7915ba85ab
fix: theming toast component () 2023-12-23 01:29:50 +10:00
Omar Basem
5eb0baa64d
Wallet: best route UI ()
* Wallet: best route UI
2023-12-22 09:40:43 +04:00
Ulises Manuel
5fa9c0cab6
[] emoji screen performance ()
* Fix `->` style in emoji-picker.data

* Make `temp-empty-symbol` component code safer to avoid app crashing

* fix `->` style in `emoji-picker.utils`

* Pass sheet-animating? ratom to bottom-sheet's content component

* Improve emoji picker performance
2023-12-21 15:44:33 -06:00
Omar Basem
4f9544d20c
Wallet: receive screen ()
* wallet: receive screen
2023-12-21 22:07:27 +04:00
Jamie Caprani
4c3d1667ca
chore: add outline for transacation-progress page () 2023-12-21 15:37:18 +00:00
Mohamed Javid
60dfd6ce78
Added assets skeleton in wallet home and account screen ()
This commit:

- Updates the "skeleton-list" component to support the "assets" type
- Adds the assets skeleton to the assets tab in the wallet home and account screen

Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
2023-12-21 13:28:52 +05:30
Ajay Sivan
4ca533a534
Move disabled component tests outside of require block to fix lint messup () 2023-12-20 22:18:59 -08:00
Ulises Manuel
7cf31651b3
[] Implement Page top component ()
* Add container style and fix `:auto-complete` parameter in address-input

* Add container style to recovery-phrase input

* Add container style and accessibility-label to search-input

* Add page-top component and tests

* Add page top preview
2023-12-20 13:17:39 -06:00
Ajay Sivan
04184b41e5
Wallet/Account Permissions Quo Component () 2023-12-20 07:54:13 -08:00
Mohsen
f631e1fe9d
[] feat: add new setting ui () 2023-12-20 17:03:49 +03:00
mmilad75
b70493691c
Implement Link Card component ()
* add basics

* finalize component

* add test structure

* add tests

* fix lint issues

* move color to props

* move variants to props

* change file structure

* working

* finalize loader

* fix tests

* fix lint issues

* fix style issues

* fix typos

* resolve comments

---------

Co-authored-by: Jamie Caprani <jamiecaprani@gmail.com>
2023-12-20 14:07:04 +03:30
Ajay Sivan
a40862c5a9
Disable component tests that use wait-for helper function () 2023-12-20 02:26:57 -08:00
Parvesh Monu
17c442a373
Add placeholder illustration in jump-to screen () 2023-12-20 14:56:33 +05:30
flexsurfer
602b27105b
FINAL BOSS! rename status-im2 to status-im () 2023-12-19 20:59:07 +01:00
Parvesh Monu
d40f70dca4
Optimize chat screen navigation view () 2023-12-19 16:01:13 +05:30
Mohamed Javid
da61233302
Wallet - Watched Account UI Updates ()
This commit:

- Updates the account switcher in the "page-nav" component to use "account-avatar" instead of "dropdown"
- Updates the account avatar (on the top right corner of the account screen) to display the watched account variant correctly
- Updates the accounts list in the account switcher to display the correct background for the watched account with the eye icon

---------

Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
2023-12-18 23:31:36 +05:30
Ajay Sivan
31dea1ca13
Quo Wallet/Required-Tokens Component () 2023-12-14 23:54:42 -08:00
Lungu Cristian
e790f7177d
Chat fixes based on design feedback ()
* fix: chat header position when only a few messages

* fix: system_message add contact icon margin

* fix: fixed last grouped message vertical padding

* fix: show message user info on long press of grouped message

* feat: added mute button to chat's channel-actions

* fix: no custom color in message list background

* fix: composer placeholder color (light theme)

* draft: fix android initial chat position

* fix: scrolling chat to top changed content size

* fix: chat message list header animation and behavior

* fix: android initial chat state

* fix: adjusted the chat avatar animation position

* fix: chat content change with keyboard visible

* ref: small refactor and added some notes

* fix: removed broken require

* fix: mute label for channel chat

* fix: merge conflict fixes
2023-12-14 13:03:21 +02:00
Mohamed Javid
b668e4dea4
[Feature] Wallet - Account Switcher for send flow ()
This commit:

- adds another variant ("Select account" bottom sheet) of the account switcher for wallet - send flow
- adds watch-only? key in the account to prevent repetitive account type checks across the codebase

Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
2023-12-13 22:49:54 +05:30
Omar Basem
424a7b17b0
Wallet: Token item fixes ()
* Wallet: token item fixes
2023-12-13 11:29:57 +04:00
Ulises Manuel
0ba057ae9d
[] Create token component ()
* Create token component

* Replace token images by new token component

The new component is being used in the following components:
 - token-input
 - network-amount
 - token-tag
 - summary-tag
 - context-tag
 - token-value
 - token-network
 - preview-list

* Rename token image file: eth-token -> eth

* Remove resources/get-token function
2023-12-08 14:13:11 -06:00
Ulises Manuel
8b919f4058
[] Raw balances using big number ()
* Add `utils.money/add` version able to work with `nil`s

* Store token raw-balance as big-number

* Improve account balance calculations using `utils.money` existing functions

* Update `:wallet/tokens-filtered` sub

* Make `prettify-balance` able to work with bignumbers
2023-12-08 13:40:26 -06:00
Ulises Manuel
de4e233884
[] text combinations - username component ()
* Move docstring to be available while using `colors/resolve-color`
* Add text combinations - username component and tests
* Add username related svg icons
2023-12-07 17:44:24 -06:00
Omar Basem
f692ae2222
Wallet: ENS ()
* wallet: ens
2023-12-07 08:00:56 +04:00
Brian Sztamfater
198a4d74a5
feat: transaction confirmation page ui ()
Signed-off-by: Brian Sztamfater <brian@status.im>
2023-12-06 20:16:08 -03:00
mmilad75
aaf0b8e423
Implement transaction progress component ()
* copy codes

* refactor preview

* refactor deprecated codes in view

* change condition structure in view-internal

* comment unused codes

* refactor title

* fix title style

* fix icon style

* fix context tag

* fix icon and row

* refactor icon-internal

* rename network-state and network-type

* fix progress-container style

* fix progress-box-container style

* fix progress container naming and style

* change progress-bar component

* fix progress box component

* convert to functional component and bring back the animation

* fix progress box for arbitrum-optimism network

* fix text-steps

* fix status-row

* refactor code style

* refactor get-network-text

* resolve comment

* add translations

* remove btn-title prop

* fix dark mode border color

* fix dark mode icon color

* move interval to preview

* add tests ns

* add tests

* fix lint issues

* fix rendering issue

* fix lint issue

* add arbitrum and optimism as separate networks

* create const for progress percentage

* fix progress bar component and preview

* refactor text-steps

* refactor names

* fix lint issues

* rename arbitrum-progress-percentage and optimism-progress-percentage

* update tests

* convert hard-coded color to customization-color

* fix progress_bar tests

* separate state for each network

* add progress percentage for each network and refactor params of functions

* separate epoch number for  each network

* update tests

* fix lint issues

* refactor codes

* fix lint issues

* resolve comments

* add confirmation progress

* use confirmation-progress component in transaction-progress

* fix preview

* add tests

* fix lint issue

* resolve comment

* refactor networks

* change sending state style

* update tests

* fix lint issues

* remove unused code

* add helper for calculate counter step

* add assoc-props to view-networks

* change text-internal props order

* fix colors/resolve-color usage

* refactor view codes

* add get-networks to preview

* add max-value to progress bar style

* remove threading macros in the previews

* remove inline functional components in the previews

* remove optimism-arbitrum checks in the view

* fix lint issues

* add max-progress and min-progress to confirmation-progress

* refactor text-steps

* fix counter structure in transaction-progress

* fix counter structure in confirmation-progress

* fix resolve-color usage

* fix lint issue

* fix tests

* resolve comments

* fix color issue

* fix margins

* fix lint issue
2023-12-06 14:09:52 +03:30
Mohamed Javid
56d135f1f8
Implemented Wallet - Account Switcher ()
This commit:

- Implements the Wallet Account Switcher for easy switching between wallet accounts
- Updates the About tab in the accounts screen to display the correct account address and derivation path along with the profile.
- Updates the account-item component to pass the state from the parent and refactors the depreciated color functions
- Moves the handle-bar in the bottom sheet to a standalone component 
- Adds customization-color in account-origin component

---------

Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
2023-12-04 18:47:03 +05:30
Siddarth Kumar
3cd302b271
fix: get rid of :redef-in-file warning () 2023-12-04 14:18:43 +05:30
Ulises Manuel
3fee21c73a
[] text combinations - standard title component ()
* Simplify tag components by turning them to from-1

* Add standard-title component, preview screen and tests
2023-12-01 15:49:49 -06:00
Jamie Caprani
f9f328107d
chore: add ability to create watch address & some related ui changes on account page () 2023-12-01 04:29:01 -08:00
Alexander
52f7fc59ee
Updated data-item, monospaced & aligned address ()
* Upd

* Fix
2023-12-01 10:03:08 +01:00
Mohamed Javid
b5202b4d28
[Feature] Added activity check on entered watch address ()
This commit 
 - implements the activity check for the entered watch address.
 - added warning colors
 - fixes bottom inset in add address to watch screen

---------

Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
2023-12-01 00:28:09 +05:30
Volodymyr Kozieiev
bfa23c182f
Add requirement for component tests () 2023-11-29 18:50:49 +00:00
Mohsen
6b721265af
[] feat: implement new settings ui, header section () 2023-11-29 20:54:11 +03:00
Jamie Caprani
589a581298
chore(wallet): add ui for send page () - merged in ()
---------
Co-authored-by: Rende11 <artamonovn@gmail.com>
2023-11-29 05:12:21 -08:00
Alex Tumanov
a9a17aaae8
Implement dropdown-input based on the original dropdown component () 2023-11-28 15:21:15 +00:00
Brian Sztamfater
1385e27cf4
feat: select asset screen ui ()
feat: select asset screen ui

Signed-off-by: Brian Sztamfater <brian@status.im>
2023-11-27 11:03:02 -03:00
Volodymyr Kozieiev
f82d28c6c9
Show network info on collectible info page () 2023-11-27 12:29:12 +00:00
Omar Basem
dbc8df251a
Wallet: Keypair follow up ()
* Wallet: Keypair follow up
2023-11-23 10:00:22 +04:00
Ulises Manuel
279993b658
Add channel-name component () 2023-11-22 15:54:52 -06:00
Omar Basem
73e9f67dbd
Wallet: illustrations ()
* wallet: illustrations
2023-11-21 10:55:46 +04:00
Jamie Caprani
86c5505c94
chore(wallet): hook up qr scanner on watch only flow. () 2023-11-19 16:26:00 -08:00
Icaro Motta
c1dcd7a764
Introduce malli library ()
This commit is the foundational step to start using malli
(https://github.com/metosin/malli) in this project.

Take in consideration we will only be able to realize malli's full power in
future iterations.

For those without context: the mobile team watched a presentation about malli
and went through a light RFC to put everyone on the same page, among other
discussions here and there in PRs.

To keep things relatively short:

1. Unit, integration and component tests will short-circuit (fail) when
   inputs/outputs don't conform to their respective function schemas (CI should
   fail too).
2. Failed schema checks will not block the app from initializing, nor throw an
   exception that would trigger the LogBox. Exceptions are only thrown in the
   scope of automated tests.
3. There's zero performance impact in production code because we only
   instrument. Instrumentation is removed from the compiled code due to the
   usage of "^boolean js.goog/DEBUG".
4. We shouldn't expect any meaningful slowdown during development.

**What are we instrumenting in this PR?**

Per our team's agreement, we're only instrumenting the bare minimum to showcase 2 examples.

- Instrument a utility function utils.money/format-amount using the macro
  approach.
- Instrument a quo component quo.components.counter.step.view/view using the
  functional approach.

Both approaches are useful, the functional approach is powerful and allow us to
instrument anonymous functions, like the ones we pass to subscriptions or event
handlers, or the higher-order function quo.theme/with-theme. The macro approach
is perfect for functions already defined with defn.

**I evaluated the schema or function in the REPL but nothing changes**

- If you evaluate the source function, you need to evaluate schema/=> or
  schema/instrument as well.
- Remember to *var quote* when using schema/instrument.
- You must call "(status-im2.setup.schema/setup!)" after any var is
  re-instrumented. It's advisable to add a keybinding in your editor to send
  this expression automatically to the CLJS REPL, or add the call at the end of
  the namespace you are working on (similar to how some devs add "(run-tests)"
  at the end of test namespaces).

**Where should schemas be defined?**

For the moment, we should focus on instrumenting quo components, so define each
function schema in the same namespace as the component's public "view" var.

To be specific:

- A schema used only to instrument a single function and not used elsewhere,
  like a quo component schema, wouldn't benefit from being defined in a separate
  namespace because that would force the developer to constantly open two files
  instead of one to check function signatures.
- A common schema reused across the repo, like ":schema.common/theme" should be
  registered in the global registry "schema.registry" so that consumers can just
  refer to it by keyword, as if it was a built-in malli schema.
- A common schema describing status-go entities like message, notification,
  community, etc can be stored either in the respective
  "src/status_im2/contexts/*" or registered globally, or even somewhere else.
  This is yet to be defined, but since I chose not to include schemas for them,
  we can postpone this guideline.
2023-11-18 11:04:48 -03:00
Brian Sztamfater
a74c934936
feat: implement summary tag component ()
Signed-off-by: Brian Sztamfater <brian@status.im>
2023-11-14 11:50:58 -03:00
Omar Basem
87c9946092
Wallet: Keypair Screen ()
* wallet: keypair screen
2023-11-13 14:43:43 +04:00
Omar Basem
f3e47ac1a2
Wallet: watch address - select random color ()
Wallet: randomize color picker
2023-11-13 14:25:44 +04:00
Ajay Sivan
e48a5c4e83
Quo community-stat component () 2023-11-09 04:39:42 -08:00