From 2a626b6b58086a18010dbca26e3be4ca781f5673 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A9lcio=20Franco?= Date: Tue, 10 Sep 2024 16:44:33 -0400 Subject: [PATCH] fix: add word-wrapping in the network url (#1469) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Closes https://github.com/FuelLabs/fuels-wallet/issues/1458 --- | 📷 Demo | | --- | | Screenshot 2024-09-10 at 16 12 33 | --- .changeset/fair-berries-fix.md | 5 +++ package.json | 4 ++- .../NetworkReviewCard/NetworkReviewCard.tsx | 7 +++- pnpm-lock.yaml | 32 ++++++++----------- 4 files changed, 27 insertions(+), 21 deletions(-) create mode 100644 .changeset/fair-berries-fix.md diff --git a/.changeset/fair-berries-fix.md b/.changeset/fair-berries-fix.md new file mode 100644 index 0000000000..6586a8bcb3 --- /dev/null +++ b/.changeset/fair-berries-fix.md @@ -0,0 +1,5 @@ +--- +"fuels-wallet": patch +--- + +Fix long network URLs breaking layout by enabling word wrapping. diff --git a/package.json b/package.json index 48be4fd08d..dc5634cd77 100644 --- a/package.json +++ b/package.json @@ -120,7 +120,9 @@ "elliptic@>=4.0.0 <=6.5.6": ">=6.5.7", "elliptic@>=2.0.0 <=6.5.6": ">=6.5.7", "elliptic@>=5.2.1 <=6.5.6": ">=6.5.7", - "micromatch@<4.0.8": ">=4.0.8" + "micromatch@<4.0.8": ">=4.0.8", + "send@<0.19.0": ">=0.19.0", + "serve-static@<1.16.0": ">=1.16.0" } } } diff --git a/packages/app/src/systems/Network/components/NetworkReviewCard/NetworkReviewCard.tsx b/packages/app/src/systems/Network/components/NetworkReviewCard/NetworkReviewCard.tsx index d6665c5063..260cbcda29 100644 --- a/packages/app/src/systems/Network/components/NetworkReviewCard/NetworkReviewCard.tsx +++ b/packages/app/src/systems/Network/components/NetworkReviewCard/NetworkReviewCard.tsx @@ -30,7 +30,9 @@ export function NetworkReviewCard({ {name} - {url} + + {url} + ); @@ -46,6 +48,9 @@ const styles = { height: '$6', }, }), + url: cssObj({ + wordWrap: 'break-word', + }), cardContentSection: cssObj({ py: '$2', }), diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index aa6525556b..ba21764dd7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -29,6 +29,8 @@ overrides: elliptic@>=2.0.0 <=6.5.6: '>=6.5.7' elliptic@>=5.2.1 <=6.5.6: '>=6.5.7' micromatch@<4.0.8: '>=4.0.8' + send@<0.19.0: '>=0.19.0' + serve-static@<1.16.0: '>=1.16.0' importers: @@ -10762,7 +10764,7 @@ packages: /@react-native-community/cli-debugger-ui@13.6.6: resolution: {integrity: sha512-Vv9u6eS4vKSDAvdhA0OiQHoA7y39fiPIgJ6biT32tN4avHDtxlc6TWZGiqv7g98SBvDWvoVAmdPLcRf3kU+c8g==} dependencies: - serve-static: 1.15.0 + serve-static: 1.16.0 transitivePeerDependencies: - supports-color @@ -10840,7 +10842,7 @@ packages: errorhandler: 1.5.1 nocache: 3.0.4 pretty-format: 26.6.2 - serve-static: 1.15.0 + serve-static: 1.16.0 ws: 6.2.3 transitivePeerDependencies: - bufferutil @@ -11102,7 +11104,7 @@ packages: nullthrows: 1.1.1 open: 7.4.2 selfsigned: 2.4.1 - serve-static: 1.15.0 + serve-static: 1.16.0 temp-dir: 2.0.0 ws: 6.2.3 transitivePeerDependencies: @@ -19803,8 +19805,8 @@ packages: qs: 6.11.0 range-parser: 1.2.1 safe-buffer: 5.2.1 - send: 0.18.0 - serve-static: 1.15.0 + send: 0.19.0 + serve-static: 1.16.0 setprototypeof: 1.2.0 statuses: 2.0.1 type-is: 1.6.18 @@ -20711,7 +20713,7 @@ packages: source-map: 0.6.1 wordwrap: 1.0.0 optionalDependencies: - uglify-js: 3.19.2 + uglify-js: 3.19.3 dev: true /handlebars@4.7.8: @@ -26731,8 +26733,8 @@ packages: engines: {node: '>=10'} hasBin: true - /send@0.18.0: - resolution: {integrity: sha512-qqWzuOjSFOuqPjFe4NOsMLafToQQwBSOEpS+FwEt3A2V3vKubTquT3vmLTQpFgMXp8AlFWFuP1qKaJZOtPpVXg==} + /send@0.19.0: + resolution: {integrity: sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==} engines: {node: '>= 0.8.0'} dependencies: debug: 4.3.4 @@ -26767,14 +26769,14 @@ packages: randombytes: 2.1.0 dev: true - /serve-static@1.15.0: - resolution: {integrity: sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g==} + /serve-static@1.16.0: + resolution: {integrity: sha512-pDLK8zwl2eKaYrs8mrPZBJua4hMplRWJ1tIFksVC3FtBEBnl8dxgeHtsaMS8DhS9i4fLObaon6ABoc4/hQGdPA==} engines: {node: '>= 0.8.0'} dependencies: encodeurl: 1.0.2 escape-html: 1.0.3 parseurl: 1.3.3 - send: 0.18.0 + send: 0.19.0 transitivePeerDependencies: - supports-color @@ -28261,14 +28263,6 @@ packages: /ufo@1.5.3: resolution: {integrity: sha512-Y7HYmWaFwPUmkoQCUIAYpKqkOf+SbVj/2fJJZ4RJMCfZp0rTGwRbzQD+HghfnhKOjL9E01okqz+ncJskGYfBNw==} - /uglify-js@3.19.2: - resolution: {integrity: sha512-S8KA6DDI47nQXJSi2ctQ629YzwOVs+bQML6DAtvy0wgNdpi+0ySpQK0g2pxBq2xfF2z3YCscu7NNA8nXT9PlIQ==} - engines: {node: '>=0.8.0'} - hasBin: true - requiresBuild: true - dev: true - optional: true - /uglify-js@3.19.3: resolution: {integrity: sha512-v3Xu+yuwBXisp6QYTcH4UbH+xYJXqnq2m/LtQVWKWzYc1iehYnLixoQDN9FH6/j9/oybfd6W9Ghwkl8+UMKTKQ==} engines: {node: '>=0.8.0'}