* Modify reanimated/view to support vectors contained in styles
* Add code examples of animated inline styles
Additionally,
* Fix warning about reactive deref not supported in lazy-seqs
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.
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>
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>
* 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
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>
* 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
* 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
* Move docstring to be available while using `colors/resolve-color`
* Add text combinations - username component and tests
* Add username related svg icons
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>
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.
This commit moves the emoji categories selector height from the "showcase-nav" component to the "emoji-picker" as we should not use any "quo" ns (except "quo.core") inside the "status-im2" ns.
Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
This commit updates the following:
- Allow users to create new wallet accounts without having to re-login (latest account data is fetched immediately)
- Updates the max length of the wallet account name to 20
- Updates the account cards in the wallet home screen to render the actual account colour
- Updates the (individual) account screen to show the correct color, emoji, name and address
- Allows users to edit account name, colour and emoji
- The rest of the wallet screens would see the updated account information immediately
- Fixes the color (uses profile color) of the context tag and button color in the authentication (enter password) bottom sheet
- Fixes the overflowing of the "+" card in the wallet home when there are two or more accounts.
Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
Add account creation screen
remove icons
remove extra utility and create a new one that would use conventional way of getting an emoji
fix lint
Use button component instead of bottom-actions
Provide global customization color to buttons
Use conventional approach to extract account name
Move to another address
Move to another namespace
Refactor bottom-actions to have button props in maps
Update doc with new icon location
Add spaces between styles
Work on pr comments
Use :on-change-text instead of :on-change for input component
Subscribe to :profile/customization-color directly
Use bottom button from the create-or-edit-account wrapper
Remove extra code
Sort requires
Move ns to proper fileˆ
Fix styles
This commit updates the following in the selectors component:
- Introduces the "type" prop (Figma 1-1 property) to the selectors component for easy switching between the selector types while using it on lists.
- Updates the component styles to use the "resolve-color" function as the "custom-color" function is deprecated
- Updates the component usage across the codebase
Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
* Align docstring
* Create share-qr-code component
* Remove empty style file
* Implement common.share-qr-code including call to media server
* Add share-qr-code preview screen
* Use share-qr-code component in shell's share screen
* Add tests and some fixes
This commit moves the "network-routing" component test to the quo ns from quo2 ns.
Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
This commit
- Adds the base Screen base for the Create/Edit Account/Address
- Adds the Wallet Edit Account screen
- Adds the gradient in the account options bottom sheet
- Adds a new key/prop "right-icon" in the data-item component to prevent overlapping with the icon used in the description and updates its usage.
- Updates the "section-label" component to receive "container-style" (this will prevent adding a wrapping view in the screens)
---------
Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>
Unshadows all remaining vars in status-mobile, including non
cljs.core/clojure.core ones. The only exceptions are cljs.core/type and
cljs.core/name (which happen quite often, so I'm not sure if it's worth
unshadowing them).
This is a continuation of https://github.com/status-im/status-mobile/pull/16500 (Lint
& fix some shadowed core Clojure(Script) vars).
Notes: As a reminder, the goal is to eventually disallow shadowing core Clojure
vars entirely, but to get there and avoid rebase hell and regressions, we need
to do in smaller steps, especially because we can't safely automate the process
of unshadowing vars.
We are already down from ~500 shadowed core vars to 350 in total.
Why is this PR is using names such as "s", "v" or "sym"? Names such as s or v
are the so called idiomatic names, and are listed in the Clojure Style Guide
https://guide.clojure.style/#idiomatic-names. I used them whenever I felt
appropriate. For the var cljs.core/symbol I opted to use sym, even though the
symbol in question is not necessarily a Clojure symbol, I think the alias
conveys the meaning well enough
(https://www.clojure.org/guides/learn/syntax#_symbols_and_idents).
New vars linted:
- comparator
- identity
- str
- symbol
- val
Outstanding shadowed vars include type, name, hash, comp.
It's well known that shadowing core Clojure vars can lead to unexpected bugs. In
fact, it's a common source of bugs in other languages too. In the status-mobile
repository there are, in total, 562 shadowed vars, ~500 are core vars. Excluding
the "old code" we still have 285 offenders.
In status-mobile I've already seen two bugs caused by shadowed vars, both with
the shadowed var "name". But probably other problems happened in the past, and
others will happen in the future if we don't do something about this. This PR is
also my response to my frustration trying to review PRs and checking for
shadowed vars, humans were not meant for that!
In this commit we are enabling ":shadowed-var" to lint certain (not all) core
vars as errors (not warnings). In future PRs we can gradually unshadow more
vars. For the record, name is shadowed 40 times in the new code and 130 in
total, and type is shadowed 93 times in the new code and 124 in total!
What about non-core vars, should we allow shadowing? There are ~70 non-core
shadowed vars. In my opinion, we should also lint and disallow shadowing
non-core vars, since it may cause the same kind of bugs of shadowing core vars.
But this decision can be left for another moment/issue, after we have fixed the
most prominent problem of shadowing core vars.
Which vars are unshadowed in this PR? I fixed 62 errors and unshadowed
cljs.core/iter, cljs.core/time, cljs.core/count, cljs.core/key,
clojure.core/key.
Resources:
- [clj-kondo linter: shadowed-var](https://github.com/clj-kondo/clj-kondo/blob/master/doc/linters.md#shadowed-var)
* nix: upgrade zprint from 1.2.4 to 1.2.5
To address issue described in:
https://github.com/kkinnear/zprint/issues/273
Signed-off-by: Jakub Sokołowski <jakub@status.im>
* chore: use zprint :multi-lhs-hang
* refactor: re-format clojure using zprint 1.2.5
---------
Signed-off-by: Jakub Sokołowski <jakub@status.im>
Co-authored-by: yqrashawn <namy.19@gmail.com>
This was a tricky one :P
removing un-necessary check of new-ui?
this is a better solution
The core issue was that when new-ui? was passed instead of the actual value just the key was passed
CLJ Refactor x Hydra are cool. Add modal
Swap UI
Swap token input and gas slider in place
Asset selector sheets
WIP
Selector events
Tabs are back
Hide Swaps behind ff, add cards and modals for advanced settings
Fix lint issues
Signed-off-by: Shivek Khurana <shivek@status.im>
Remove redudant println, don't stop the task in case of a bad event, just reject that batch, capture navigate-to-cofx events with an effect, capture parts of screens/on-will-focus event
Fix lint
Shorten comment widths, update to use less brackets, call events reset once, double run safety for long running task
Call onboard after stopping
Reset periodic-tasks-chan to on close, formatting
Get rid of redundant inline function
Update go version to point to 0.75.1
Signed-off-by: Shivek Khurana <shivek@status.im>
Update strings
Check if transaction has receipt on login
Notification on accept
Add large icon
Unify notifications for referral
Fix duplicate path for acquisition
Fix accept notification and visibility
Small fixes
Do not show notifications when not rewardable
Add home item
Show referral on lets go button
Fix list item on home
Hide messages on accept
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Add inner border to image message
Add max batch size of 5
Disable camera roll more images
Use interop instead of aget
Add border as a separate layer
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Cleanup http events
Add loaders
Add dapp flow
Fix tests
Fix dapp success event
Hide reward based on referrals metadata
New flows
Terms link
TX watcher event
Do not show success popup
Use new rewardable field from backend
Fix referral pulling
Update copy
Translate advertiser modal
Move modal styles into style ns
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Add acquisition backend methods
Init referrals sharing UI
Add invite on home screen
Use i18n for strings
Lint
Update status go
Pull acquisition contract to get SNT amount
Use new invite component
f pulling
go
Use screen instead of bottom sheet
Handle android install referrer
Post referrer to backend if present
go go
Add async storage for referral decisions
Update with the stage backend
Update contract methods
Modal
UI
Full handling of advertiser type
UI
test
UI
Handle with universal link
Allow multiple acquisition per installation
Fix android bottom sheet
Do not call service if no click-id received
Disable invite in release
Parse query params for referrer
Adapt UI changes
Add push notification
update deps
Mock react-native-push-notification
Request push notifications permission on press accept
Store transaction to local storage and load it back on login
Separate acquisition into smaller ns
Add chat invite
Get referrer only on first install
fix string
Fix firebase crash
Handle outdate click-id
Cleanup business logic
Update contract
Revert pn
Minor update to advertiser modal copy
OLD - Welcome to Status! Here is some crypto to get you started
NEW - Here’s some crypto to get you started! Use it to get stickers, an ENS name and try dapps
OLD - By accepting you agree to the starter pack
NEW - By accepting you agree to the referral program
upgrade status-go
Add mainnet
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
New input UI
Inverse panel height calculation
Remove old chat input
Better animations
fix for pasting text
Add buttons accessibility
Fix dark mode
Update react navigation to fix the keyboard issues
Force close bottom sheet
Unmount android bottom sheet when not visible
Reset bottom sheet height android
more fixes
more fixes
Add hidden audio icon
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Remove extra fn's
Long press animation cancel
Make select primary ens accessible
Add accessibility to controls components
Update e2e tests
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Fix android password visibility change
Do not change secure-text-entry on android password visiblity
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Replace all the usage of the button without component
Use quo
Fix tests
List item in multiaccounts
Use list items in contacts
Fix welcome screen button
Experiment long press
Big list item
Remove old bottom sheet
Use bottom sheet
Keycard
Add error to list item
Stickers panel button
Images panel
Fix z-index in profile
Fix android crash
Fix signing list item
Try fixing test
iOs gas sheet keyboard
Disable root alert in e2e
keycard signing sheet height
Clean up bottom sheet events
Replace flat list in profile
Memorise the manual-close value for bottom sheet
Mailserver QR scanner
Fix e2e tests
E2e fix 2
Fix e2e 3
Remove extra fn
Reduce bridging time for animation
Trick android layout
Try hooks
Fix profile missing ens-name
Disable press on control in list-view
allow disabling animations in list item
Use simple list in wallet assets settings
TBD - this screen should be rewritten from scratch. Now on every interaction the full list is re-rendered, also it makes the wallet main screen to re-render.
Fix send sheet
Handle long press in main thread
UI fixes
perf
Update e2e
fix missing user name in image long press
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Add new switch component
Add all controls components
Use controls in list items
Delete leftover file
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Accessibility hide password only input
Do not hide all other elements, as only password should be secured
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
This reverts commit db202f03bf.
Fix leftover get-ref for text input
Use uuid as a unique identifier for input
Generate a random uuid on mount, ensures that no stale ref are kept
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Replace all text-inputs with label
Fix tooltip
Replace search input
Replace white bg text inputs with Quo
Add placeholders
Clear quo text inputs on blur
Change seed phrase word count style
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
EXPERIMENTAL: uses reanimated lib so we can use reanimated buttons inside and have simultaneous handlers
Add react hooks
Use hooks
mocks
Use timing for drag transition
Use view on android
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Change press animation ns
Add list item component
Fix pressable does not reset animation state
Improve long-press handling
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
fix header title spacing
Remove translate animation
Add press for profile header
Rebase
Attempt to fix e2e
Add back button accessibility-label
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Add text component
Add header component
Change animated root ns
Add spacing design tokens
Add components preview
Add Readme
Add safe area components
Use reanimated from component library
Add colors tokens
Add inherit style for text
Add animated header component
A view with header which can be animated on scroll, used in walled, profile and contact screens
Persist previews navigation state
Rename component library into Quo
Document colors
Extend readme
Header handle long titles
Add InterStatus as monospace font
Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>
Omar Basem
Ulises Manuel
Alexander
Brian Sztamfater
mmilad75
Ibrahem Khalil
Mohsen
Jamie Caprani
Ajay Sivan
Icaro Motta
flexsurfer
codemaster
Mohamed Javid
Parvesh Monu
Lungu Cristian
Siddarth Kumar
Volodymyr Kozieiev
Alex Tumanov
yqrashawn
Nikolay
Jakub Sokołowski
Ibrahem Khalil
John Ngei
phrohdoh
andrey
Shivek Khurana
Roman Volosovskyi
Michele Balistreri
Pavlos Vinieratos
Brian Sztamfater
Gheorghe Pinzaru
Andrea Franz
Andrea Maria Piana
yenda