From bff317ff803630d36a6a6f5dad2e4a49c57a9af8 Mon Sep 17 00:00:00 2001 From: Mathanraj Date: Sun, 25 Aug 2024 17:36:02 +0530 Subject: [PATCH 1/2] AddecCheckbox and Profile Icon --- package-lock.json | 29 +++++++-------- package.json | 2 +- src/components/Conditions/Conditions.css | 13 +++++++ src/components/Conditions/Conditions.tsx | 36 +++++++++++++++++++ src/components/NavBar/NavBar.tsx | 2 ++ src/components/Profile/Profile.css | 16 +++++++++ src/components/Profile/Profile.tsx | 14 ++++++++ .../SecretPhraseGrid/SecretPhraseGrid.css | 23 +++++++----- .../SecretPhraseInput/SecretPhraseInput.css | 5 +++ src/components/WalletItem/WalletItem.css | 7 ---- src/components/WalletItem/WalletItem.tsx | 10 ++++++ src/components/WalletKey/WalletKey.css | 2 +- src/components/WalletKey/WalletKey.tsx | 2 +- 13 files changed, 125 insertions(+), 36 deletions(-) create mode 100644 src/components/Conditions/Conditions.css create mode 100644 src/components/Conditions/Conditions.tsx create mode 100644 src/components/Profile/Profile.css create mode 100644 src/components/Profile/Profile.tsx diff --git a/package-lock.json b/package-lock.json index ac5302a..c37799e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,7 @@ "name": "wallet", "version": "0.0.0", "dependencies": { - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@mui/icons-material": "^5.16.7", "@mui/material": "^5.16.7", @@ -431,15 +431,14 @@ "license": "MIT" }, "node_modules/@emotion/react": { - "version": "11.13.0", - "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.0.tgz", - "integrity": "sha512-WkL+bw1REC2VNV1goQyfxjx1GYJkcc23CRQkXX+vZNLINyfI7o+uUn/rTGPt/xJ3bJHd5GcljgnxHf4wRw5VWQ==", - "license": "MIT", + "version": "11.13.3", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz", + "integrity": "sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==", "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.12.0", "@emotion/cache": "^11.13.0", - "@emotion/serialize": "^1.3.0", + "@emotion/serialize": "^1.3.1", "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0", "@emotion/utils": "^1.4.0", "@emotion/weak-memoize": "^0.4.0", @@ -455,14 +454,13 @@ } }, "node_modules/@emotion/serialize": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.0.tgz", - "integrity": "sha512-jACuBa9SlYajnpIVXB+XOXnfJHyckDfe6fOpORIM6yhBDlqGuExvDdZYHDQGoDf3bZXGv7tNr+LpLjJqiEQ6EA==", - "license": "MIT", + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.1.tgz", + "integrity": "sha512-dEPNKzBPU+vFPGa+z3axPRn8XVDetYORmDC0wAiej+TNcOZE70ZMJa0X7JdeoM6q/nWTMZeLpN/fTnD9o8MQBA==", "dependencies": { "@emotion/hash": "^0.9.2", "@emotion/memoize": "^0.9.0", - "@emotion/unitless": "^0.9.0", + "@emotion/unitless": "^0.10.0", "@emotion/utils": "^1.4.0", "csstype": "^3.0.2" } @@ -477,7 +475,6 @@ "version": "11.13.0", "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz", "integrity": "sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==", - "license": "MIT", "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.12.0", @@ -497,10 +494,9 @@ } }, "node_modules/@emotion/unitless": { - "version": "0.9.0", - "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.9.0.tgz", - "integrity": "sha512-TP6GgNZtmtFaFcsOgExdnfxLLpRDla4Q66tnenA9CktvVSdNKDvMVuUah4QvWPIpNjrWsGg3qeGo9a43QooGZQ==", - "license": "MIT" + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz", + "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==" }, "node_modules/@emotion/use-insertion-effect-with-fallbacks": { "version": "1.1.0", @@ -1141,7 +1137,6 @@ "version": "5.16.7", "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.16.7.tgz", "integrity": "sha512-cwwVQxBhK60OIOqZOVLFt55t01zmarKJiJUWbk0+8s/Ix5IaUzAShqlJchxsIQ4mSrWqgcKCCXKtIlG5H+/Jmg==", - "license": "MIT", "dependencies": { "@babel/runtime": "^7.23.9", "@mui/core-downloads-tracker": "^5.16.7", diff --git a/package.json b/package.json index 7cbbee9..da3938b 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "deploy": "gh-pages -d dist" }, "dependencies": { - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@mui/icons-material": "^5.16.7", "@mui/material": "^5.16.7", diff --git a/src/components/Conditions/Conditions.css b/src/components/Conditions/Conditions.css new file mode 100644 index 0000000..eb7ab02 --- /dev/null +++ b/src/components/Conditions/Conditions.css @@ -0,0 +1,13 @@ +.conditions { + display: flex; + align-items: flex-start; + gap: 0.5rem; + padding: 0.25rem; +} + +.conditions > p { + font-weight: 500; + color: var(--text-900); + text-wrap: wrap; + line-break: loose; +} diff --git a/src/components/Conditions/Conditions.tsx b/src/components/Conditions/Conditions.tsx new file mode 100644 index 0000000..eff53c1 --- /dev/null +++ b/src/components/Conditions/Conditions.tsx @@ -0,0 +1,36 @@ +import { Checkbox } from "@mui/material"; +import Theme from "../../Utility/Theme"; +import { useState } from "react"; +import "./Conditions.css"; + +interface ConditionsProps { + value: string; + onChange: any; +} + +function Conditions({ value, onChange }: ConditionsProps) { + const [checked, setChecked] = useState(true); + + const handleChange = () => { + setChecked(!checked); + onChange(checked); + }; + return ( +
+ +

{value}

+
+ ); +} + +export default Conditions; diff --git a/src/components/NavBar/NavBar.tsx b/src/components/NavBar/NavBar.tsx index 82ac504..d3e0612 100644 --- a/src/components/NavBar/NavBar.tsx +++ b/src/components/NavBar/NavBar.tsx @@ -5,6 +5,7 @@ import CloseIcon from "@mui/icons-material/Close"; import "./NavBar.css"; import useMobile from "../../Utility/Hooks/setMobile"; import logo from "../../assets/logo.png"; +import Profile from "../Profile/Profile"; function NavBar() { const menus = [ @@ -70,6 +71,7 @@ function NavBar() {
+ {isMobile && (
- {isCopyable && ( + {isCopyable && isShow && (
From 07efe1acf0d64466de9524af7c3ae8813d80f97e Mon Sep 17 00:00:00 2001 From: Mathanraj Date: Sun, 25 Aug 2024 17:38:53 +0530 Subject: [PATCH 2/2] Resolved Lint Errors --- src/components/Profile/Profile.tsx | 6 +++++- src/components/WalletItem/WalletItem.tsx | 2 +- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/components/Profile/Profile.tsx b/src/components/Profile/Profile.tsx index 558d628..6a3ebbb 100644 --- a/src/components/Profile/Profile.tsx +++ b/src/components/Profile/Profile.tsx @@ -1,6 +1,10 @@ import "./Profile.css"; -function Profile({ name }) { +interface ProfileProps { + name: string; +} + +function Profile({ name }: ProfileProps) { const IconText = ( name.split(" ")[0][0] + name.split(" ")[1][0] ).toUpperCase(); diff --git a/src/components/WalletItem/WalletItem.tsx b/src/components/WalletItem/WalletItem.tsx index c71779b..4d343dc 100644 --- a/src/components/WalletItem/WalletItem.tsx +++ b/src/components/WalletItem/WalletItem.tsx @@ -35,7 +35,7 @@ function WalletItem() { // }, ]; - const handleChecked = (e) => { + const handleChecked = (e: boolean) => { console.log(e, "checked"); };