Merge branch 'develop' into 17433-composer-expanded-on-cancel

Author: clauxx

.clj-kondo/status-im/config.edn

@@ -1,2 +1,2 @@
-{:hooks   {:analyze-call {utils.i18n/label hooks.core/i18n-label}}
+{:hooks   {:analyze-call {utils.i18n/label utils.i18n/label}}
  :linters {:status-im.linter/invalid-translation-keyword {:level :error}}}

.clj-kondo/status-im/hooks/core.clj

@@ -0,0 +1,26 @@
+(ns utils.i18n
+  (:require [clj-kondo.hooks-api :as hooks]))
+
+(defn label
+  "Verify call to `utils.i18n/label` pass the translation keyword qualified with `t`."
+  [{:keys [node]}]
+  (let [[_ translation-key-node & _] (:children node)]
+    (when (and (hooks/keyword-node? translation-key-node)
+               (not= "t" (-> translation-key-node hooks/sexpr namespace)))
+      (hooks/reg-finding! (assoc (meta translation-key-node)
+                                 :message "Translation keyword should be qualified with \"t\""
+                                 :type    :status-im.linter/invalid-translation-keyword)))))
+
+(comment
+  ;; Valid
+  (label {:node     (hooks/parse-string "(i18n/label :t/foo {:var \"hello\"})")
+          :cljc     false
+          :lang     :cljs
+          :filename ""
+          :config   {}
+          :ns       ""
+          :context  nil})
+
+  ;; Invalid
+  (label {:node (hooks/parse-string "(i18n/label :foo)")})
+)

.clj-kondo/status-im/utils/i18n.clj

@@ -7,3 +7,4 @@ modules
 result
 target
 component-spec
+/app

.prettierignore

@@ -278,7 +278,7 @@ run-android: export ANDROID_ABI_INCLUDE ?= $(shell ./scripts/adb_devices_abis.sh
 run-android: ##@run Build Android APK and start it on the device
 	npx react-native run-android --appIdSuffix debug
 
-SIMULATOR=iPhone 11 Pro
+SIMULATOR=iPhone 13
 run-ios: export TARGET := ios
 run-ios: export IOS_STATUS_GO_TARGETS := iossimulator/amd64
 run-ios: ##@run Build iOS app and start it in a simulator/device
@@ -312,8 +312,10 @@ lint: export TARGET := clojure
 lint: export CLJ_LINTER_PRINT_WARNINGS ?= false
 lint: ##@test Run code style checks
 	@sh scripts/lint-re-frame-in-quo-components.sh && \
+	sh scripts/lint-direct-require-component-outside-quo.sh && \
 	clj-kondo --config .clj-kondo/config.edn --cache false --fail-level error --lint src $(if $(filter $(CLJ_LINTER_PRINT_WARNINGS),true),,| grep -v ': warning: ') && \
 	ALL_CLOJURE_FILES=$(call find_all_clojure_files) && \
+	scripts/lint_translations.clj && \
 	zprint '{:search-config? true}' -sfc $$ALL_CLOJURE_FILES && \
 	sh scripts/lint-trailing-newline.sh && \
 	node_modules/.bin/prettier --write .

Makefile

@@ -23,7 +23,7 @@ setups and runs the test suite once.
 setups and runs the test suite and watches for code changes will then retrigger the test suite.
 
 ## Writing Tests
-New test files will need their namespace added to either the file "src/quo2/core_spec.cljs" or "src/status_im2/core_spec.cljs. These locations may update overtime but it is dependent on the entrypoint in shadow-cljs config discussed below.
+New test files will need their namespace added to either the file "src/quo/core_spec.cljs" or "src/status_im2/core_spec.cljs. These locations may update overtime but it is dependent on the entrypoint in shadow-cljs config discussed below.
 
 
 ### Best practices

doc/component-tests-overview.md

@@ -76,7 +76,7 @@ It's important to name functional components with `f-` prefix.
 
 ### Component props and API scheme to match Figma as closely as possible
 
-Ideally, the prop names for components (particularly in quo2 Design System)
+Ideally, the prop names for components (particularly in quo Design System)
 should match the Figma properties as best as possible. This makes it easier for
 the developer using that component to configure it correctly for the screen it
 is being used on and avoids unnecessary overwrites and adjustments being made.
@@ -134,7 +134,7 @@ For example if Figma has sizes `:small`, `:medium` and `:large`
 
 Prefer to define styles in a separate file named `style.cljs`, colocated with
 the source file. For a real example, see
-[src/quo2/components/record_audio/record_audio/style.cljs](../src/quo2/components/record_audio/record_audio/style.cljs).
+[src/quo/components/record_audio/record_audio/style.cljs](../src/quo/components/record_audio/record_audio/style.cljs).
 
 ```clojure
 ;; bad
@@ -467,9 +467,9 @@ Prefer the pure version of `:json-rpc/call` (no callbacks).
 
 ### Registering event handlers
 
-Register events with `re-frame.core/reg-event-fx` and follow [re-frame's best
+Register events with `utils.re-frame/reg-event-fx` and follow [re-frame's best
 practice](https://github.com/day8/re-frame/blob/39adca93673f334dc751ee2d99d340b51a9cc6db/docs/FAQs/BestPractice.md#use-the-fx-effect)
-so use only `:db` and `:fx` effects. `rf/merge` is deprecated and should not be
+so use only `:db` and `:fx` effects. `utils.re-frame/merge` and `utils.re-frame/defn` are deprecated and should not be
 used in the new code in `src/status_im2/`. Don't use
 `re-frame.core/reg-event-db`.
 
@@ -528,27 +528,27 @@ due to performance constraints.
    (:preferred-name multiaccount)))
 ```
 
-### Requiring quo2 components
+### Requiring quo components
 
-Consume `quo2` components from `quo2.core`, unless the namespace is also inside
-the `quo2/` directory.
+Consume `quo` components from `quo.core`, unless the namespace is also inside
+the `quo/` directory.
 
 ```clojure
 ;; bad
 (ns my-namespace
-  (:require [quo2.components.icon :as icon]))
+  (:require [quo.components.icon :as icon]))
 
 (icon/icon :i/verified)
 
 ;; good
 (ns my-namespace
-  (:require [quo2.core :as quo]))
+  (:require [quo.core :as quo]))
 
 (quo/icon :i/verified)
 
-;; also good because both namespaces are inside quo2/
-(ns quo2.components.tabs.account-selector
-  (:require [quo2.components.markdown.text :as text]))
+;; also good because both namespaces are inside quo/
+(ns quo.components.tabs.account-selector
+  (:require [quo.components.markdown.text :as text]))
 ```
 
 ### Require/import
@@ -615,12 +615,12 @@ Use the appropriate keyword qualification/namespace.
 
 ```clojure
 ;; bad
-(require '[quo2.components.icon :as icons])
+(require '[quo.components.icon :as icons])
 (icons/icon :main-icons2/verified)
 
 ;; good
-(require '[quo2.core :as quo2])
-(quo2/icon :i/verified)
+(require '[quo.core :as quo])
+(quo/icon :i/verified)
 ```
 
 ### Translations
@@ -695,7 +695,7 @@ First, the bird's-eye view with some example ClojureScript files:
 src
 ├── js/
 ├── mocks/
-├── quo2
+├── quo
 │   ├── components/
 │   ├── foundations/
 │   └── theme.cljs
@@ -716,7 +716,7 @@ src
 
 - `src/js`: Raw Javascript files, e.g. React Native Reanimated worklets.
 - `src/mocks`: Plumbing configuration to be able to run tests.
-- `src/quo2/`: The component library for Status Mobile.
+- `src/quo/`: The component library for Status Mobile.
 - `src/react_native/`: Contains only low-level constructs to help React Native
   work in tandem with Clojure(Script).
 - `src/status_im2/`: Directory where we try to be as strict as possible about
@@ -728,7 +728,7 @@ src
   of the directory tree. Just like directories named `utils`, their directory
   nesting level communicates their applicable limits.
 - `src/status_im2/common/components/`: Contains reusable components that are not
-  part of the design system (quo2).
+  part of the design system (quo).
 - `src/status_im2/contexts/`: Contains [bounded contexts](#glossary), like
   `browser/`, `messaging/`, etc. As much as possible, _bounded contexts_ should
   not directly require each other's namespaces.
@@ -743,24 +743,24 @@ directory nesting level precisely indicates its boundaries. For example, a
 `contexts/user_settings/utils/datetime.cljs` file communicates that it should
 only be used in the `user_settings` context.
 
-### src/quo2
+### src/quo
 
-The `src/quo2/` directory holds all components for the new design system. As
+The `src/quo/` directory holds all components for the new design system. As
 much as possible, its sub-directories and component names should reflect the
 same language used by designers.
 
 Even though the directory lives alongside the rest of the codebase, we should
 think of it as an external entity that abstracts away particular Status domain
 knowledge.
 
-Components inside `src/quo2/` should not rely on re-frame, i.e. they should not
+Components inside `src/quo/` should not rely on re-frame, i.e. they should not
 dispatch events or use subscriptions.
 
 Example structure:
 
 ```
 src
-└── quo2
+└── quo
     ├── components
     │   └── dropdown
     │       ├── style.cljs

doc/new-guidelines.md

@@ -1,16 +1,22 @@
 # Pixel Perfection
 The Status Mobile team aims to align the design implementation perfectly according to a given screens respective Figma design spec.
 
-Currently the Figma Designs match up with an "iPhone 11 Pro" screen size. 
+Currently, the Figma Designs match up with both "iPhone 11 Pro" and "iPhone 13" screen size.
+
+The Dimension reference for iPhone 11 Pro is 375 x 812 (width x height) and for iPhone 13 is 390 x 844.
 
 To test your implementation is correct you can take the following steps
 
 - Open a new Figma file so that you have write privileges. 
+
 - Copy in the component or screen from the Figma file.
 
-- Using the "iPhone 11 Pro" simulator (it is the default now) you take a screenshot of your component and paste it into your Figma file.
+- Using the "iPhone 11 Pro" or the "iPhone 13" simulator (it is the default now) you take a screenshot of your component and paste it into your Figma file.
+
+- To get the right size, set your screenshot to width according to your simulator: 
+  - for iPhone 13 set 390
+  - for iPhone 11 Pro set 375
 
-- To get the right size, set your screenshot to width 375px
 
 ![](images/pixel-perfection/layer-width.png)
 

doc/pixel-perfection.md

@@ -30,23 +30,23 @@ You need to have an emulator like [AVD](https://developer.android.com/studio/run
 
 #### Running on a simulator
 
-We highly recommend using the `iPhone 11 Pro` simulator as its screen dimensions match with our design.
+We highly recommend using either the `iPhone 11 Pro` or `iPhone 13` simulator as its screen dimensions match with our design.
 
-If you have Xcode `v12.x` (and above) installed in your system, you need to follow the below steps to add `iPhone 11 Pro` simulator:
+If you have Xcode `v12.x` (and above) installed in your system, you need to follow the below steps to add `iPhone 13` simulator:
 
 1. Open Xcode
 2. Menu `>` Window `>` Devices and Simulators
 3. Tap `+` button on bottom left
-4. Select **Device Type** as `iPhone 11 Pro`
+4. Select **Device Type** as `iPhone 13`
 5. Leave the **Simulator Name** empty and tap on **Create**
 
 ##### NOTE ⚠️
 
-Running `make run-ios` will target `iPhone 11 Pro` by default.
+Running `make run-ios` will target `iPhone 13` by default.
 
 If you need to run on any other simulator, you can specify the simulator type by adding the `SIMULATOR` flag:
 ```sh
-make run-ios SIMULATOR="iPhone 11 Pro"
+make run-ios SIMULATOR="iPhone 13"
 ```
 
 #### Running on a physical device

doc/starting-guide.md

@@ -765,7 +765,7 @@ SPEC CHECKSUMS:
   RNLanguages: 962e562af0d34ab1958d89bcfdb64fafc37c513e
   RNPermissions: ad71dd4f767ec254f2cd57592fbee02afee75467
   RNReactNativeHapticFeedback: 2566b468cc8d0e7bb2f84b23adc0f4614594d071
-  RNReanimated: 62e43ee6baafb9ba3d3af1857d7fd23a1d41bff0
+  RNReanimated: 42f56dc5c032a11177b9ea12cdb57285318b432e
   RNShare: d82e10f6b7677f4b0048c23709bd04098d5aee6c
   RNStaticSafeAreaInsets: 055ddbf5e476321720457cdaeec0ff2ba40ec1b8
   RNSVG: 80584470ff1ffc7994923ea135a3e5ad825546b9

ios/Podfile.lock

@@ -1194,21 +1194,6 @@ public String logFileDirectory() {
         return getPublicStorageDirectory().getAbsolutePath();
     }
 
-    @ReactMethod(isBlockingSynchronousMethod = true)
-    public String generateAlias(final String seed) {
-        return Statusgo.generateAlias(seed);
-    }
-
-    @ReactMethod
-    public void generateAliasAsync(final String seed, final Callback callback) throws JSONException {
-        executeRunnableStatusGoMethod(() -> Statusgo.generateAlias(seed), callback);
-    }
-
-    @ReactMethod(isBlockingSynchronousMethod = true)
-    public String identicon(final String seed) {
-        return Statusgo.identicon(seed);
-    }
-
     @ReactMethod(isBlockingSynchronousMethod = true)
     public String encodeTransfer(final String to, final String value) {
         return Statusgo.encodeTransfer(to, value);
@@ -1269,31 +1254,6 @@ public void identiconAsync(final String seed, final Callback callback) throws JS
         executeRunnableStatusGoMethod(() -> Statusgo.identicon(seed), callback);
     }
 
-    @ReactMethod
-    public void generateAliasAndIdenticonAsync(final String seed, final Callback callback) {
-
-         Log.d(TAG, "generateAliasAndIdenticonAsync");
-                if (!checkAvailability()) {
-                    callback.invoke(false);
-                    return;
-                }
-
-                Runnable r = new Runnable() {
-                    @Override
-                    public void run() {
-                        String resIdenticon = Statusgo.identicon(seed);
-                        String resAlias = Statusgo.generateAlias(seed);
-
-                        Log.d(TAG, resIdenticon);
-                        Log.d(TAG, resAlias);
-                        callback.invoke(resAlias, resIdenticon);
-                    }
-                };
-
-                StatusThreadPoolExecutor.getInstance().execute(r);
-
-    }
-
     @Override
     public @Nullable
     Map<String, Object> getConstants() {