Skip to content

Commit 7a1f6cc

Browse files
github-actions[bot]JasonCWangmatthappensbsiaotickchongcoreymartin
authored
Updates to ui (#466)
* Implement sending invite w/ payment flow (#18492) Trying to split this PR into smaller ones.. WIP ![Screenshot 2025-06-13 at 1.27.44 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/EJphitdgYFvuACNazm1q/1ea1d564-78af-490a-a772-485fa574bb02.png) ![Screenshot 2025-06-13 at 1.27.54 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/EJphitdgYFvuACNazm1q/b28812df-c001-4d0e-8e9c-56528e7f8a79.png) ![Screenshot 2025-06-13 at 1.27.47 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/EJphitdgYFvuACNazm1q/648bd708-848f-45a3-ae70-9bf9a134deed.png) Contributes to PX-527, PX-535, PX-530, PX-528 GitOrigin-RevId: c4b4dcdf938ecf41234091fa9167f7426c01fad4 * add failed onboarding state, warning yellow color, and status on UmaCard (#18683) # Improved UMA Bridge Onboarding Experience with Verification Status Handling ### TL;DR Enhanced the UMA Bridge onboarding flow to properly handle verification failures and pending states. ### What changed? - Added a new verification failure state to the UMA Card with a yellow warning banner - Added support for pending verification status with a blue "pending" label - Fixed the continue onboarding navigation to properly find the next incomplete step - Refactored card wrapper components into a single `StatusCardWrapper` with configurable background color - Added properties to track verification failure and pending states in the onboarding progress data structure ### How to test? 1. Trigger different verification states (pending, failed, completed) in the UMA Bridge 2. Verify that the UI correctly displays: - Yellow warning banner for failed verification - Blue "pending" label for pending verification - Proper navigation to the next incomplete step when continuing onboarding 3. Check that the onboarding flow correctly handles all verification states ### Why make this change? The previous implementation didn't properly handle verification failure states or pending verification, which could lead to user confusion during the onboarding process. These changes provide clearer visual feedback about verification status and ensure users are guided to the correct next step in their onboarding journey. GitOrigin-RevId: 8ae8623d3ac36112a76d6a5667b2b2bc12ed4112 * [bridge] add verification in progress ui to triple a link bank (#18694) ![Screenshot 2025-06-20 at 5.26.57 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/NU8OmLauzLqa61yWDJkY/e8708a22-14b4-4829-b2b5-718ff9cd8906.png) ![Screenshot 2025-06-20 at 5.27.04 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/NU8OmLauzLqa61yWDJkY/07ee8fde-ef15-4fd3-adb6-cd6a980acbd6.png) ![Screenshot 2025-06-20 at 5.25.32 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/NU8OmLauzLqa61yWDJkY/41d34736-7f42-42e5-a546-6fda823c34cf.png) GitOrigin-RevId: 059dcb1c715fb2ce6024e21544dbe84cb01316dd * Revamp transactions list and add payment links (#18530) ![Screenshot 2025-06-20 at 2.22.24 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/EJphitdgYFvuACNazm1q/cf8173cb-3fb8-4a52-856b-6f6ea90b2dcb.png) ![Screenshot 2025-06-20 at 2.57.54 PM.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/EJphitdgYFvuACNazm1q/d9f649a0-9501-4d29-ab56-3148266f957f.png) Contributes to PX-534 GitOrigin-RevId: bdeceb46eb54a9463da7f7c2f1dfb94f4428eb40 * [js] Upgrade turbo (#18839) GitOrigin-RevId: b4f8dd8efc405ea62989fae10ab2aa15b14daf76 * CI update lock file for PR * [ui] fix shared form inset styles, update bridge card form padding (#18842) * buildStandardContentInset is used by cn2 as well, and needs to adjust width * removes a confusing padding style from formInset that overrides other padding styles * makes BridgeCardForm define its own padding which hopefully leads to less conflicts * updates info icon width for triple a link bank GitOrigin-RevId: da57a36a0eb7a4dafc6d718d859ec9dc582a5efe * [js] Lint rule to ensure @lightsparkdev/ui/src imports in apps that can use them (#18859) GitOrigin-RevId: dc5f7057fdea9f2d6d4de982a1f5d24015b4ac67 * [js] Improve start (#18852) * [js] Improve start * wip * improve * fix * fix GitOrigin-RevId: 31e4de1ca11c7a11ef00a58ee46bac3a82b3a13b * CI update lock file for PR * Create strong-garlics-sing.md --------- Co-authored-by: Jason Wang <jason@lightspark.com> Co-authored-by: Matt Davis <matthappens@gmail.com> Co-authored-by: Brian Siao Tick Chong <bsiaotickchong@gmail.com> Co-authored-by: Corey Martin <coreyn.martin@gmail.com> Co-authored-by: Lightspark Eng <engineering@lightspark.com>
1 parent 6fad049 commit 7a1f6cc

22 files changed

Lines changed: 265 additions & 99 deletions

File tree

‎.changeset/strong-garlics-sing.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@lightsparkdev/ui": patch
3+
---
4+
5+
- Theme updates

‎README.md‎

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,16 +19,10 @@ yarn
1919

2020
This will install the proper version of yarn and all dependencies for the Lightspark js-sdk workspaces.
2121

22-
Then to build dependencies and run a specific example - get the package.json name of the example and run this from the repo root:
22+
Then to build dependencies and run a specific example - get the package.json name from the example directory, removing the @lightsparkdev/ portion, and pass as an argument to `yarn start` from the repo root. For example for @lightsparkdev/remote-signing-server:
2323

2424
```
25-
yarn start --filter=@lightsparkdev/remote-signing-server
26-
```
27-
28-
Or to build all packages and run all examples simply do:
29-
30-
```
31-
yarn start
25+
yarn start remote-signing-server
3226
```
3327

3428
Please see the README files in the [examples directory](./apps/examples) for instructions on running the examples. Please note that some packages such as @lightsparkdev/ui are for building the examples only and not necessary for your implementation of our [published SDK packages](https://www.npmjs.com/search?q=%40lightsparkdev).

‎apps/examples/remote-signing-server/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"supertest": "^6.3.3",
3636
"ts-jest": "^29.1.1",
3737
"ts-node": "^10.9.1",
38+
"tsc-absolute": "^1.0.1",
3839
"typescript": "^5.6.2"
3940
},
4041
"engines": {

‎apps/examples/remote-signing-server/turbo.json‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"extends": ["//"],
3+
"tasks": {
4+
"build": {
5+
"dependsOn": [
6+
"@lightsparkdev/core#build",
7+
"@lightsparkdev/lightspark-sdk#build"
8+
]
9+
},
10+
"build:deps": {
11+
"dependsOn": [
12+
"@lightsparkdev/core#build",
13+
"@lightsparkdev/lightspark-sdk#build"
14+
]
15+
},
16+
"start": {
17+
"dependsOn": [
18+
"@lightsparkdev/core#build",
19+
"@lightsparkdev/lightspark-sdk#build"
20+
],
21+
"with": [
22+
"@lightsparkdev/core#build:watch",
23+
"@lightsparkdev/lightspark-sdk#build:watch"
24+
]
25+
}
26+
}
27+
}

‎apps/examples/uma-vasp-cli/turbo.json‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"extends": ["//"],
3+
"tasks": {
4+
"build": {
5+
"dependsOn": [
6+
"@lightsparkdev/core#build",
7+
"@lightsparkdev/lightspark-sdk#build"
8+
]
9+
},
10+
"build:deps": {
11+
"dependsOn": [
12+
"@lightsparkdev/core#build",
13+
"@lightsparkdev/lightspark-sdk#build"
14+
]
15+
},
16+
"start": {
17+
"dependsOn": [
18+
"@lightsparkdev/core#build",
19+
"@lightsparkdev/lightspark-sdk#build"
20+
],
21+
"with": [
22+
"@lightsparkdev/core#build:watch",
23+
"@lightsparkdev/lightspark-sdk#build:watch"
24+
]
25+
}
26+
}
27+
}

‎apps/examples/uma-vasp/turbo.json‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"extends": ["//"],
3+
"tasks": {
4+
"build": {
5+
"dependsOn": [
6+
"@lightsparkdev/core#build",
7+
"@lightsparkdev/lightspark-sdk#build"
8+
]
9+
},
10+
"build:deps": {
11+
"dependsOn": [
12+
"@lightsparkdev/core#build",
13+
"@lightsparkdev/lightspark-sdk#build"
14+
]
15+
},
16+
"start": {
17+
"dependsOn": [
18+
"@lightsparkdev/core#build",
19+
"@lightsparkdev/lightspark-sdk#build"
20+
],
21+
"with": [
22+
"@lightsparkdev/core#build:watch",
23+
"@lightsparkdev/lightspark-sdk#build:watch"
24+
]
25+
}
26+
}
27+
}

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@
4747
"human-id": "^4.1.1",
4848
"octokit": "^4.0.2",
4949
"ts-prune": "^0.10.3",
50-
"turbo": "^2.4.4"
50+
"turbo": "^2.5.4"
5151
},
5252
"engines": {
5353
"node": ">=18"

‎packages/eslint-config/constants/react-restricted-imports.js‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,41 @@ const restrictedImportPaths = [
1111
},
1212
];
1313

14+
const reactAppRestrictedImports = {
15+
paths: [
16+
...restrictedImportPaths,
17+
{
18+
importNames: ["Link", "Navigate", "useNavigate"],
19+
message:
20+
"Please use typesafe imports from @lightsparkdev/ui/router instead.",
21+
name: "react-router-dom",
22+
},
23+
{
24+
importNames: ["default", "QRCodeSVG"],
25+
message: "Please use imports from @lightsparkdev/ui components instead.",
26+
name: "qrcode.react",
27+
},
28+
{
29+
importNames: ["useWhatChanged"],
30+
message: "This is for use in local development only.",
31+
name: "@lightsparkdev/ui/hooks/useWhatChanged",
32+
},
33+
],
34+
patterns: [
35+
{
36+
group: [
37+
"**/services/**/service",
38+
"!**/services/Services",
39+
"!**/services/**/types",
40+
"!**/services/**/constants",
41+
],
42+
message:
43+
"Please do not import services directly, use Services class to access.",
44+
},
45+
],
46+
};
47+
1448
module.exports = {
1549
restrictedImportPaths,
50+
reactAppRestrictedImports,
1651
};

‎packages/eslint-config/react-app-with-internal-ui.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
const reactAppRestrictedImports =
2+
require("./constants/react-restricted-imports").reactAppRestrictedImports;
3+
4+
module.exports = {
5+
extends: ["./react-app"],
6+
rules: {
7+
"no-restricted-imports": [
8+
"error",
9+
{
10+
...reactAppRestrictedImports,
11+
patterns: [
12+
...reactAppRestrictedImports.patterns,
13+
{
14+
group: [
15+
"@lightsparkdev/ui/**",
16+
"!@lightsparkdev/ui/src",
17+
"!@lightsparkdev/ui/src/**",
18+
],
19+
message:
20+
"This app can import directly from @lightsparkdev/ui/src to avoid requiring a build.",
21+
},
22+
],
23+
},
24+
],
25+
},
26+
};

‎packages/eslint-config/react-app.js‎

Lines changed: 3 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,10 @@
1-
const baseRestrictedImportPaths =
2-
require("./constants/react-restricted-imports").restrictedImportPaths;
1+
const reactAppRestrictedImports =
2+
require("./constants/react-restricted-imports").reactAppRestrictedImports;
33

44
module.exports = {
55
extends: ["./react-lib"],
66
ignorePatterns: ["src/generated/"],
77
rules: {
8-
"no-restricted-imports": [
9-
"error",
10-
{
11-
paths: [
12-
...baseRestrictedImportPaths,
13-
{
14-
importNames: ["Link", "Navigate", "useNavigate"],
15-
message:
16-
"Please use typesafe imports from @lightsparkdev/ui/router instead.",
17-
name: "react-router-dom",
18-
},
19-
{
20-
importNames: ["default", "QRCodeSVG"],
21-
message:
22-
"Please use imports from @lightsparkdev/ui components instead.",
23-
name: "qrcode.react",
24-
},
25-
{
26-
importNames: ["useWhatChanged"],
27-
message: "This is for use in local development only.",
28-
name: "@lightsparkdev/ui/hooks/useWhatChanged",
29-
},
30-
],
31-
patterns: [
32-
{
33-
group: [
34-
"**/services/**/service",
35-
"!**/services/Services",
36-
"!**/services/**/types",
37-
"!**/services/**/constants",
38-
],
39-
message:
40-
"Please do not import services directly, use Services class to access.",
41-
},
42-
],
43-
},
44-
],
8+
"no-restricted-imports": ["error", reactAppRestrictedImports],
459
},
4610
};

0 commit comments

Comments
 (0)