fix: styles

This commit is contained in:
Koosha Lahouti
2025-08-12 02:48:58 +03:30
parent 09e4dfa917
commit a782043767
11 changed files with 352 additions and 595 deletions

554
package-lock.json generated
View File

@@ -8,14 +8,21 @@
"name": "harmony-club",
"version": "0.0.0",
"dependencies": {
"@date-io/dayjs": "^3.2.0",
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.1",
"@mui/material": "^7.2.0",
"@mui/stylis-plugin-rtl": "^7.2.0",
"@rkheftan/harmony-ui": "^0.1.5",
"@mui/x-date-pickers": "^8.9.0",
"@mui/x-date-pickers-pro": "^8.9.0",
"date-fns": "^4.1.0",
"date-fns-jalali": "^4.0.0-0",
"dayjs": "^1.11.13",
"i18next": "^25.3.0",
"i18next-browser-languagedetector": "^8.2.0",
"i18next-http-backend": "^3.0.2",
"iconsax-react": "^0.0.8",
"react": "^19.1.0",
"react-dom": "^19.1.0",
"react-i18next": "^15.6.0",
@@ -337,6 +344,29 @@
"node": ">=6.9.0"
}
},
"node_modules/@date-io/core": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/@date-io/core/-/core-3.2.0.tgz",
"integrity": "sha512-hqwXvY8/YBsT9RwQITG868ZNb1MVFFkF7W1Ecv4P472j/ZWa7EFcgSmxy8PUElNVZfvhdvfv+a8j6NWJqOX5mA==",
"license": "MIT"
},
"node_modules/@date-io/dayjs": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/@date-io/dayjs/-/dayjs-3.2.0.tgz",
"integrity": "sha512-+3LV+3N+cpQbEtmrFo8odg07k02AFY7diHgbi2EKYYANOOCPkDYUjDr2ENiHuYNidTs3tZwzDKckZoVNN4NXxg==",
"license": "MIT",
"dependencies": {
"@date-io/core": "^3.2.0"
},
"peerDependencies": {
"dayjs": "^1.8.17"
},
"peerDependenciesMeta": {
"dayjs": {
"optional": true
}
}
},
"node_modules/@emotion/babel-plugin": {
"version": "11.13.5",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz",
@@ -1093,61 +1123,6 @@
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
}
},
"node_modules/@fast-csv/format": {
"version": "4.3.5",
"resolved": "https://registry.npmjs.org/@fast-csv/format/-/format-4.3.5.tgz",
"integrity": "sha512-8iRn6QF3I8Ak78lNAa+Gdl5MJJBM5vRHivFtMRUWINdevNo00K7OXxS2PshawLKTejVwieIlPmK5YlLu6w4u8A==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/node": "^14.0.1",
"lodash.escaperegexp": "^4.1.2",
"lodash.isboolean": "^3.0.3",
"lodash.isequal": "^4.5.0",
"lodash.isfunction": "^3.0.9",
"lodash.isnil": "^4.0.0"
}
},
"node_modules/@fast-csv/format/node_modules/@types/node": {
"version": "14.18.63",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.63.tgz",
"integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ==",
"license": "MIT",
"peer": true
},
"node_modules/@fast-csv/parse": {
"version": "4.3.6",
"resolved": "https://registry.npmjs.org/@fast-csv/parse/-/parse-4.3.6.tgz",
"integrity": "sha512-uRsLYksqpbDmWaSmzvJcuApSEe38+6NQZBUsuAyMZKqHxH0g1wcJgsKUvN3WC8tewaqFjBMMGrkHmC+T7k8LvA==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/node": "^14.0.1",
"lodash.escaperegexp": "^4.1.2",
"lodash.groupby": "^4.6.0",
"lodash.isfunction": "^3.0.9",
"lodash.isnil": "^4.0.0",
"lodash.isundefined": "^3.0.1",
"lodash.uniq": "^4.5.0"
}
},
"node_modules/@fast-csv/parse/node_modules/@types/node": {
"version": "14.18.63",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.63.tgz",
"integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ==",
"license": "MIT",
"peer": true
},
"node_modules/@fingerprintjs/fingerprintjs": {
"version": "3.4.2",
"resolved": "https://registry.npmjs.org/@fingerprintjs/fingerprintjs/-/fingerprintjs-3.4.2.tgz",
"integrity": "sha512-3Ncze6JsJpB7BpYhqIgvBpfvEX1jsEKrad5hQBpyRQxtoAp6hx3+R46zqfsuQG4D9egQZ+xftQ0u4LPFMB7Wmg==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.4.1"
}
},
"node_modules/@humanfs/core": {
"version": "0.19.1",
"resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
@@ -1476,203 +1451,6 @@
}
}
},
"node_modules/@mui/x-data-grid": {
"version": "8.10.0",
"resolved": "https://registry.npmjs.org/@mui/x-data-grid/-/x-data-grid-8.10.0.tgz",
"integrity": "sha512-NMOZyDcE9vqn0qEv0z6DqkXwzIOj4ZFy4QC0RcUjEvBmjwdRc3KCh9XSWAuqmpc23B4M9cydVVkt0CBfOJKwsQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.28.2",
"@mui/utils": "^7.2.0",
"@mui/x-internals": "8.10.0",
"@mui/x-virtualizer": "0.1.1",
"clsx": "^2.1.1",
"prop-types": "^15.8.1",
"use-sync-external-store": "^1.5.0"
},
"engines": {
"node": ">=14.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/mui-org"
},
"peerDependencies": {
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
"@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0",
"@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0",
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@emotion/react": {
"optional": true
},
"@emotion/styled": {
"optional": true
}
}
},
"node_modules/@mui/x-data-grid-premium": {
"version": "8.10.0",
"resolved": "https://registry.npmjs.org/@mui/x-data-grid-premium/-/x-data-grid-premium-8.10.0.tgz",
"integrity": "sha512-oNDmzDNoaxVNDSG+vY88okGoVF6hhJ4acpQlb+SYC63hQUnZlB6nQpgVGsDFF6V7A8lq2lDLTnTEZnWlMjuZZw==",
"license": "SEE LICENSE IN LICENSE",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.28.2",
"@mui/utils": "^7.2.0",
"@mui/x-data-grid": "8.10.0",
"@mui/x-data-grid-pro": "8.10.0",
"@mui/x-internals": "8.10.0",
"@mui/x-license": "8.10.0",
"@types/format-util": "^1.0.4",
"clsx": "^2.1.1",
"exceljs": "^4.4.0",
"prop-types": "^15.8.1"
},
"engines": {
"node": ">=14.0.0"
},
"peerDependencies": {
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
"@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0",
"@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0",
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@emotion/react": {
"optional": true
},
"@emotion/styled": {
"optional": true
}
}
},
"node_modules/@mui/x-data-grid-pro": {
"version": "8.10.0",
"resolved": "https://registry.npmjs.org/@mui/x-data-grid-pro/-/x-data-grid-pro-8.10.0.tgz",
"integrity": "sha512-jg5WZakq8QVnYgF1KQ6EFWqtjPXl5Aww4o9bJQOiq1I5IGXqQJdVm9VGdDK0Xywn+FdNiU4VbdQhS++B601b5w==",
"license": "SEE LICENSE IN LICENSE",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.28.2",
"@mui/utils": "^7.2.0",
"@mui/x-data-grid": "8.10.0",
"@mui/x-internals": "8.10.0",
"@mui/x-license": "8.10.0",
"@types/format-util": "^1.0.4",
"clsx": "^2.1.1",
"prop-types": "^15.8.1"
},
"engines": {
"node": ">=14.0.0"
},
"peerDependencies": {
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
"@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0",
"@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0",
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@emotion/react": {
"optional": true
},
"@emotion/styled": {
"optional": true
}
}
},
"node_modules/@mui/x-internals": {
"version": "8.10.0",
"resolved": "https://registry.npmjs.org/@mui/x-internals/-/x-internals-8.10.0.tgz",
"integrity": "sha512-stYhWBeCKfV2/ltAWShZ3ZJ51otbqpMpC+krWWoIsxM8TuvGzwXw5YMU9L2fTb8hRstsiOCQfEzIn12Ii7+N0Q==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.28.2",
"@mui/utils": "^7.2.0",
"reselect": "^5.1.1",
"use-sync-external-store": "^1.5.0"
},
"engines": {
"node": ">=14.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/mui-org"
},
"peerDependencies": {
"react": "^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/@mui/x-license": {
"version": "8.10.0",
"resolved": "https://registry.npmjs.org/@mui/x-license/-/x-license-8.10.0.tgz",
"integrity": "sha512-N6grkf44ESMmQp8bqSNKmWLIsf7IfsfJUr2PKDH07PVfJHTwvyQpUKBF+mLUtcd/GNDyUhqyDK98zx9AwGzSwA==",
"license": "SEE LICENSE IN LICENSE",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.28.2",
"@mui/utils": "^7.2.0",
"@mui/x-internals": "8.10.0",
"@mui/x-telemetry": "8.5.3"
},
"engines": {
"node": ">=14.0.0"
},
"peerDependencies": {
"react": "^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/@mui/x-telemetry": {
"version": "8.5.3",
"resolved": "https://registry.npmjs.org/@mui/x-telemetry/-/x-telemetry-8.5.3.tgz",
"integrity": "sha512-vBLVBXCBWY44HonjRefpYjowEXa25k2AtAXkWk2tHfL3/unnnexrYPosuo/p4giIWer0pMy/bPqGY2qM0xlM+g==",
"hasInstallScript": true,
"license": "SEE LICENSE IN LICENSE",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.27.6",
"@fingerprintjs/fingerprintjs": "^3.4.2",
"ci-info": "^4.2.0",
"conf": "^11.0.2",
"is-docker": "^3.0.0",
"node-machine-id": "^1.1.12"
},
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/@mui/x-virtualizer": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/@mui/x-virtualizer/-/x-virtualizer-0.1.1.tgz",
"integrity": "sha512-pZ84wPu/97Z6g2HF7D4t8X5GSgc+Gr3EoJJpGv1SP3mAX2OcZtYhXiUyQzvHPm2jvDQuxIIzwXT3hMIEgdDPPQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/runtime": "^7.27.4",
"@mui/utils": "^7.2.0",
"@mui/x-internals": "8.10.0"
},
"engines": {
"node": ">=14.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/mui-org"
},
"peerDependencies": {
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/@nodelib/fs.scandir": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -2483,48 +2261,6 @@
"url": "https://github.com/sponsors/epoberezkin"
}
},
"node_modules/ajv-formats": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.1.tgz",
"integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
"license": "MIT",
"peer": true,
"dependencies": {
"ajv": "^8.0.0"
},
"peerDependencies": {
"ajv": "^8.0.0"
},
"peerDependenciesMeta": {
"ajv": {
"optional": true
}
}
},
"node_modules/ajv-formats/node_modules/ajv": {
"version": "8.17.1",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
"integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
"license": "MIT",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.3",
"fast-uri": "^3.0.1",
"json-schema-traverse": "^1.0.0",
"require-from-string": "^2.0.2"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/epoberezkin"
}
},
"node_modules/ajv-formats/node_modules/json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"license": "MIT",
"peer": true
},
"node_modules/ansi-styles": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -2622,23 +2358,6 @@
"dev": true,
"license": "Python-2.0"
},
"node_modules/async": {
"version": "3.2.6",
"resolved": "https://registry.npmjs.org/async/-/async-3.2.6.tgz",
"integrity": "sha512-htCUDlxyyCLMgaM3xXg0C0LW2xqfuQ6p05pCEIsXuyQ+a1koYKTuBMzRNwmybfLgvJDMd0r1LTn4+E0Ti6C2AA==",
"license": "MIT",
"peer": true
},
"node_modules/atomically": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/atomically/-/atomically-2.0.3.tgz",
"integrity": "sha512-kU6FmrwZ3Lx7/7y3hPS5QnbJfaohcIul5fGqf7ok+4KklIEk9tJ0C2IQPdacSbVUWv6zVHXEBWoWd6NrVMT7Cw==",
"peer": true,
"dependencies": {
"stubborn-fs": "^1.2.5",
"when-exit": "^2.1.1"
}
},
"node_modules/babel-plugin-macros": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
@@ -2894,22 +2613,6 @@
"url": "https://github.com/chalk/chalk?sponsor=1"
}
},
"node_modules/ci-info": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ci-info/-/ci-info-4.3.0.tgz",
"integrity": "sha512-l+2bNRMiQgcfILUi33labAZYIWlH1kWDp+ecNo5iisRKrbm0xcRyCww71/YU0Fkw0mAFpz9bJayXPjey6vkmaQ==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/sibiraj-s"
}
],
"license": "MIT",
"peer": true,
"engines": {
"node": ">=8"
}
},
"node_modules/clsx": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
@@ -2961,66 +2664,6 @@
"integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
"license": "MIT"
},
"node_modules/conf": {
"version": "11.0.2",
"resolved": "https://registry.npmjs.org/conf/-/conf-11.0.2.tgz",
"integrity": "sha512-jjyhlQ0ew/iwmtwsS2RaB6s8DBifcE2GYBEaw2SJDUY/slJJbNfY4GlDVzOs/ff8cM/Wua5CikqXgbFl5eu85A==",
"license": "MIT",
"peer": true,
"dependencies": {
"ajv": "^8.12.0",
"ajv-formats": "^2.1.1",
"atomically": "^2.0.0",
"debounce-fn": "^5.1.2",
"dot-prop": "^7.2.0",
"env-paths": "^3.0.0",
"json-schema-typed": "^8.0.1",
"semver": "^7.3.8"
},
"engines": {
"node": ">=14.16"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/conf/node_modules/ajv": {
"version": "8.17.1",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
"integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
"license": "MIT",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.3",
"fast-uri": "^3.0.1",
"json-schema-traverse": "^1.0.0",
"require-from-string": "^2.0.2"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/epoberezkin"
}
},
"node_modules/conf/node_modules/json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"license": "MIT",
"peer": true
},
"node_modules/conf/node_modules/semver": {
"version": "7.7.2",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
"integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
"license": "ISC",
"peer": true,
"bin": {
"semver": "bin/semver.js"
},
"engines": {
"node": ">=10"
}
},
"node_modules/convert-source-map": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -3159,6 +2802,43 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/date-fns": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
"license": "MIT",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/kossnocorp"
}
},
"node_modules/date-fns-jalali": {
"version": "4.0.0-0",
"resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-4.0.0-0.tgz",
"integrity": "sha512-EczB+gWceuWCRlacE4T+WmdP+BV/IUQpjQW9aBa9DNcXkKuZFv3WBDqeP2Ew+6YFBtPRRcH5U22+C6gcpwgG8A==",
"license": "MIT"
},
"node_modules/dayjs": {
"version": "1.11.13",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.13.tgz",
"integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==",
"license": "MIT"
},
"node_modules/debounce-fn": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/debounce-fn/-/debounce-fn-5.1.2.tgz",
"integrity": "sha512-Sr4SdOZ4vw6eQDvPYNxHogvrxmCIld/VenC5JbNrFwMiwd7lY/Z18ZFfo+EWNG4DD9nFlAujWAo/wGuOPHmy5A==",
"license": "MIT",
"dependencies": {
"mimic-fn": "^4.0.0"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/debug": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
@@ -3193,65 +2873,6 @@
"csstype": "^3.0.2"
}
},
"node_modules/dot-prop": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-7.2.0.tgz",
"integrity": "sha512-Ol/IPXUARn9CSbkrdV4VJo7uCy1I3VuSiWCaFSg+8BdUOzF9n3jefIpcgAydvUZbTdEBZs2vEiTiS9m61ssiDA==",
"license": "MIT",
"peer": true,
"dependencies": {
"type-fest": "^2.11.2"
},
"engines": {
"node": "^12.20.0 || ^14.13.1 || >=16.0.0"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/duplexer2": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
"integrity": "sha512-asLFVfWWtJ90ZyOUHMqk7/S2w2guQKxUI2itj3d92ADHhxUSbCMGi1f1cBcJ7xM1To+pE/Khbwo1yuNbMEPKeA==",
"license": "BSD-3-Clause",
"peer": true,
"dependencies": {
"readable-stream": "^2.0.2"
}
},
"node_modules/duplexer2/node_modules/readable-stream": {
"version": "2.3.8",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
"integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
"license": "MIT",
"peer": true,
"dependencies": {
"core-util-is": "~1.0.0",
"inherits": "~2.0.3",
"isarray": "~1.0.0",
"process-nextick-args": "~2.0.0",
"safe-buffer": "~5.1.1",
"string_decoder": "~1.1.1",
"util-deprecate": "~1.0.1"
}
},
"node_modules/duplexer2/node_modules/safe-buffer": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
"integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
"license": "MIT",
"peer": true
},
"node_modules/duplexer2/node_modules/string_decoder": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
"license": "MIT",
"peer": true,
"dependencies": {
"safe-buffer": "~5.1.0"
}
},
"node_modules/electron-to-chromium": {
"version": "1.5.178",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.178.tgz",
@@ -3282,6 +2903,18 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/env-paths": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/env-paths/-/env-paths-3.0.0.tgz",
"integrity": "sha512-dtJUTepzMW3Lm/NPxRf3wP4642UWhjL2sQxc+ym2YMj1m/H2zDNQOlezafzkHwn6sMstjHTwG6iQQsctDW/b1A==",
"license": "MIT",
"engines": {
"node": "^12.20.0 || ^14.13.1 || >=16.0.0"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/error-ex": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
@@ -4221,13 +3854,6 @@
"dev": true,
"license": "MIT"
},
"node_modules/json-schema-typed": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/json-schema-typed/-/json-schema-typed-8.0.1.tgz",
"integrity": "sha512-XQmWYj2Sm4kn4WeTYvmpKEbyPsL7nBsb647c7pMe6l02/yx2+Jfc4dT6UZkEXnIUb5LhD55r2HPsJ1milQ4rDg==",
"license": "BSD-2-Clause",
"peer": true
},
"node_modules/json-stable-stringify-without-jsonify": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
@@ -4648,13 +4274,6 @@
}
}
},
"node_modules/node-machine-id": {
"version": "1.1.12",
"resolved": "https://registry.npmjs.org/node-machine-id/-/node-machine-id-1.1.12.tgz",
"integrity": "sha512-QNABxbrPa3qEIfrE6GOJ7BYIuignnJw7iQ2YPbc3Nla1HzRJjXzZOiikfF8m7eAMfichLt3M4VgLOetqgDmgGQ==",
"license": "MIT",
"peer": true
},
"node_modules/node-releases": {
"version": "2.0.19",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz",
@@ -5149,6 +4768,21 @@
"license": "MIT",
"peer": true
},
"node_modules/require-from-string": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
"integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
"license": "MIT",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/reselect": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/reselect/-/reselect-5.1.1.tgz",
"integrity": "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w==",
"license": "MIT"
},
"node_modules/resolve": {
"version": "1.22.10",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",

View File

@@ -11,14 +11,21 @@
"preview": "vite preview"
},
"dependencies": {
"@date-io/dayjs": "^3.2.0",
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.1",
"@mui/material": "^7.2.0",
"@mui/stylis-plugin-rtl": "^7.2.0",
"@rkheftan/harmony-ui": "^0.1.5",
"@mui/x-date-pickers": "^8.9.0",
"@mui/x-date-pickers-pro": "^8.9.0",
"date-fns": "^4.1.0",
"date-fns-jalali": "^4.0.0-0",
"dayjs": "^1.11.13",
"i18next": "^25.3.0",
"i18next-browser-languagedetector": "^8.2.0",
"i18next-http-backend": "^3.0.2",
"iconsax-react": "^0.0.8",
"react": "^19.1.0",
"react-dom": "^19.1.0",
"react-i18next": "^15.6.0",

View File

@@ -0,0 +1,38 @@
import { useState, useMemo } from 'react';
import { DatePicker } from '@mui/x-date-pickers/DatePicker';
import { LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import { AdapterDateFnsJalali } from '@mui/x-date-pickers/AdapterDateFnsJalali';
import { useTranslation } from 'react-i18next';
export function DateOfBirth() {
const { t, i18n } = useTranslation('completionForm');
const isFarsi = i18n.language === 'fa' || i18n.language === 'fa-IR';
const [birthDate, setBirthDate] = useState<Date | null>(null);
const Adapter = useMemo(() => {
return isFarsi ? AdapterDateFnsJalali : AdapterDateFns;
}, [isFarsi]);
return (
<LocalizationProvider dateAdapter={Adapter}>
<DatePicker
label={t('completion.dateOfBirth')}
value={birthDate}
onChange={(newValue) => setBirthDate(newValue)}
slotProps={{
textField: {
fullWidth: true,
sx: {
width: {
xs: '100%',
sm: '70%',
md: '309px',
},
},
},
}}
/>
</LocalizationProvider>
);
}

View File

@@ -56,27 +56,42 @@ export function EmailSection({
return (
<>
<FormGroup>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1, px: 6 }}>
<Box
sx={{
display: 'flex',
alignItems: 'center',
gap: 1,
px: { xs: 2, sm: 6 },
}}
>
<Switch checked={showEmail} onChange={handleToggleEmail} />
<Typography sx={{ color: showEmail ? '#2979FF' : 'black' }}>
<Typography
sx={{ color: showEmail ? 'primary.main' : 'text.primary' }}
>
{t('completion.determineEmail')}
</Typography>
</Box>
</FormGroup>
{showEmail && (
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, px: 6 }}>
<Box sx={{ display: 'flex', gap: 4 }}>
<Box sx={{ display: 'flex', flexDirection: 'column' }}>
<Box
sx={{
display: 'flex',
flexDirection: 'column',
gap: 2,
px: { xs: 2, sm: 6 },
}}
>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }}>
<Box sx={{ flex: 1, minWidth: '260px', maxWidth: '634px' }}>
<TextField
label={t('completion.email')}
variant="outlined"
fullWidth
value={email}
onChange={(e) => setEmail(e.target.value)}
error={!correctEmail}
sx={{
width: !isVerifyingCode && !emailVerified ? '446px' : '634px',
transition: 'width 0.3s',
}}
error={email.length > 0 && !correctEmail}
sx={{ maxWidth: '462px' }}
InputProps={{
startAdornment:
!isVerifyingCode && emailVerified ? (
@@ -114,46 +129,54 @@ export function EmailSection({
/>
{email && (
<Typography
sx={{ color: correctEmail ? 'green' : 'red' }}
sx={{ color: correctEmail ? 'success.main' : 'error.main' }}
variant="caption"
>
{correctEmail ? '' : t('completion.emailCorrectForm')}
</Typography>
)}
</Box>
{!isVerifyingCode && !emailVerified && (
<Button
variant="text"
onClick={handleSendCode}
sx={{ width: '156px' }}
// disabled={
// buttonState === 'sent' ||
// buttonState === 'counting' ||
// !correctEmail
// }
sx={{
minWidth: '140px',
width: { xs: '100%', sm: '156px' },
alignSelf: 'center',
}}
>
{getButtonLabel()}
</Button>
)}
</Box>
{!emailVerified && codeSent && (
<Box sx={{ display: 'flex', gap: 4 }}>
<Box
sx={{
display: 'flex',
flexDirection: { xs: 'column', sm: 'row' },
gap: 2,
}}
>
<TextField
label={t('completion.verificationCode')}
variant="outlined"
value={verificationCode}
onChange={(e) => setVerificationCode(e.target.value)}
sx={{ width: '446px' }}
fullWidth={false}
sx={{ flex: 1 }}
disabled={isVerifyingCode}
/>
<Button
variant="contained"
sx={{
width: '156px',
border: 0.5,
}}
onClick={handleVerifyCode}
disabled={isVerifyingCode}
sx={{
width: { xs: '100%', sm: '156px' },
border: 0.5,
}}
>
{isVerifyingCode ? (
<Box

View File

@@ -54,26 +54,29 @@ export function PasswordSection({
setShowPasswordSection(e.target.checked);
};
const handleTogglePasswordEye = () => {
setShowPasswordText((prev) => !prev);
};
const handleTogglePasswordRepetitionEye = () => {
const handleTogglePasswordEye = () => setShowPasswordText((prev) => !prev);
const handleTogglePasswordRepetitionEye = () =>
setShowPasswordRepetitionText((prev) => !prev);
};
return (
<>
<FormGroup>
<Box sx={{ display: 'flex', gap: 0.5, px: 6, alignItems: 'center' }}>
<Box dir="ltr">
<Switch
checked={showPasswordSection}
onChange={handleTogglePasswordSection}
/>
</Box>
<Box
sx={{
display: 'flex',
gap: 0.5,
px: { xs: 2, sm: 6 },
alignItems: 'center',
}}
>
<Switch
checked={showPasswordSection}
onChange={handleTogglePasswordSection}
/>
<Typography
sx={{ color: showPasswordSection ? '#2979FF' : 'text.primary' }}
sx={{
color: showPasswordSection ? 'primary.main' : 'text.primary',
}}
>
{t('completion.determinePassword')}
</Typography>
@@ -81,15 +84,23 @@ export function PasswordSection({
</FormGroup>
{showPasswordSection && (
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, px: 6 }}>
<Box sx={{ display: 'flex', gap: 2 }}>
<Box
sx={{
display: 'flex',
flexDirection: 'column',
gap: 2,
px: { xs: 2, sm: 6 },
}}
>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }}>
<TextField
label={t('completion.password')}
value={password}
onChange={(e) => setPassword(e.target.value)}
variant="outlined"
type={showPasswordText ? 'text' : 'password'}
sx={{ width: '309px' }}
fullWidth
sx={{ maxWidth: '309px', flex: 1 }}
InputProps={{
endAdornment: (
<InputAdornment position="end" sx={{ height: 'unset' }}>
@@ -144,7 +155,8 @@ export function PasswordSection({
? t('completion.notCompatibility')
: ' '
}
sx={{ width: '309px' }}
fullWidth
sx={{ maxWidth: '309px', flex: 1 }}
type={showPasswordRepititonText ? 'text' : 'password'}
InputProps={{
endAdornment: (
@@ -156,8 +168,8 @@ export function PasswordSection({
width: '100%',
}}
>
{confirmPassword.length > 0 ? (
matchPassword ? (
{confirmPassword.length > 0 &&
(matchPassword ? (
<TickCircle
size="24"
color="#14AE5C"
@@ -179,8 +191,7 @@ export function PasswordSection({
marginRight: '16px',
}}
/>
)
) : null}
))}
<IconButton
onClick={handleTogglePasswordRepetitionEye}
@@ -213,10 +224,12 @@ export function PasswordSection({
</Box>
{password && showValidations && (
<Box sx={{ display: 'flex', gap: 2 }}>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }}>
<Box
sx={{
width: '317px',
flex: 1,
minWidth: '260px',
maxWidth: '317px',
display: 'flex',
flexDirection: 'column',
}}
@@ -232,7 +245,9 @@ export function PasswordSection({
</Box>
<Box
sx={{
width: '317px',
flex: 1,
minWidth: '260px',
maxWidth: '317px',
display: 'flex',
flexDirection: 'column',
}}

View File

@@ -11,13 +11,29 @@ export function PasswordValidationItem({
label,
}: ValidationItemProps) {
return (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1, mb: 0.5 }}>
<Box
sx={{
display: 'flex',
alignItems: 'center',
gap: 1,
mb: 0.5,
flexWrap: 'wrap',
}}
>
<TickCircle
size="16"
color={isValid ? '#14AE5C' : '#2979FF'}
variant={isValid ? 'Bold' : 'Outline'}
/>
<Typography variant="body2" color="text.primary">
<Typography
variant="body2"
color="text.primary"
sx={{
fontSize: { xs: '0.85rem', sm: '0.875rem' },
wordBreak: 'break-word',
flex: 1,
}}
>
{label}
</Typography>
</Box>

View File

@@ -10,6 +10,8 @@ import {
import { useTranslation } from 'react-i18next';
import { Woman, Man } from 'iconsax-react';
import { useState } from 'react';
import { DateOfBirth } from './DateOfBirth';
import { countries } from '../data/Countries';
interface PersonalInfoFieldsProps {
sex: string;
@@ -27,39 +29,6 @@ export function PersonalInfoFields({
const { t } = useTranslation('completionForm');
const [countryError, setCountryError] = useState(false);
const countries = [
{ name: 'Afghanistan', fa: 'افغانستان', flag: 'af' },
{ name: 'Albania', fa: 'آلبانی', flag: 'al' },
{ name: 'Algeria', fa: 'الجزایر', flag: 'dz' },
{ name: 'Argentina', fa: 'آرژانتین', flag: 'ar' },
{ name: 'Armenia', fa: 'ارمنستان', flag: 'am' },
{ name: 'Australia', fa: 'استرالیا', flag: 'au' },
{ name: 'Austria', fa: 'اتریش', flag: 'at' },
{ name: 'Bahrain', fa: 'بحرین', flag: 'bh' },
{ name: 'Canada', fa: 'کانادا', flag: 'ca' },
{ name: 'China', fa: 'چین', flag: 'cn' },
{ name: 'France', fa: 'فرانسه', flag: 'fr' },
{ name: 'Germany', fa: 'آلمان', flag: 'de' },
{ name: 'India', fa: 'هند', flag: 'in' },
{ name: 'Iran', fa: 'ایران', flag: 'ir' },
{ name: 'Iraq', fa: 'عراق', flag: 'iq' },
{ name: 'Italy', fa: 'ایتالیا', flag: 'it' },
{ name: 'Japan', fa: 'ژاپن', flag: 'jp' },
{ name: 'Netherlands', fa: 'هلند', flag: 'nl' },
{ name: 'Pakistan', fa: 'پاکستان', flag: 'pk' },
{ name: 'Qatar', fa: 'قطر', flag: 'qa' },
{ name: 'Russia', fa: 'روسیه', flag: 'ru' },
{ name: 'Saudi Arabia', fa: 'عربستان سعودی', flag: 'sa' },
{ name: 'Spain', fa: 'اسپانیا', flag: 'es' },
{ name: 'Sweden', fa: 'سوئد', flag: 'se' },
{ name: 'Switzerland', fa: 'سوئیس', flag: 'ch' },
{ name: 'Turkey', fa: 'ترکیه', flag: 'tr' },
{ name: 'United Arab Emirates', fa: 'امارات متحده عربی', flag: 'ae' },
{ name: 'United Kingdom', fa: 'بریتانیا', flag: 'gb' },
{ name: 'United States', fa: 'ایالات متحده آمریکا', flag: 'us' },
{ name: 'Yemen', fa: 'یمن', flag: 'ye' },
];
const handleChangeSex = (e: any) => {
setSex(e.target.value);
};
@@ -68,43 +37,46 @@ export function PersonalInfoFields({
setCountry(newValue ? newValue.name : '');
setCountryError(false);
};
const handleCountryBlur = (e: React.FocusEvent<HTMLInputElement>) => {
const inputValue = e.target.value.trim();
const exists = countries.some((c) => c.fa === inputValue);
if (inputValue && !exists) {
setCountryError(true);
} else {
setCountryError(false);
}
};
const handleInputChange = (_: any, value: string) => {
const exists = countries.some((c) => c.fa === value.trim());
if (value.trim() && !exists) {
setCountryError(true);
} else {
setCountryError(false);
}
setCountryError(Boolean(inputValue && !exists));
};
const handleInputChange = (_: any, value: string) => {
const exists = countries.some((c) => c.fa === value.trim());
setCountryError(Boolean(value.trim() && !exists));
};
const fieldSx = { width: { xs: '100%', sm: '48%', md: '48%' } };
return (
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, px: 6 }}>
<Box sx={{ display: 'flex', gap: 2 }}>
<Box
sx={{
display: 'flex',
flexDirection: 'column',
gap: 2,
px: { xs: 2, sm: 4, md: 6 },
}}
>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }}>
<TextField
label={t('completion.name')}
placeholder={t('completion.name')}
variant="outlined"
sx={{ width: '309px' }}
sx={fieldSx}
/>
<TextField
label={t('completion.familyName')}
placeholder={t('completion.familyName')}
variant="outlined"
sx={{ width: '309px' }}
sx={fieldSx}
/>
</Box>
<Box sx={{ display: 'flex', gap: 2 }}>
<FormControl sx={{ width: '309px' }}>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }}>
<FormControl sx={fieldSx}>
<InputLabel>{t('completion.gender')}</InputLabel>
<Select
value={sex}
@@ -130,11 +102,11 @@ export function PersonalInfoFields({
label={t('completion.optionalNationalCode')}
placeholder={t('completion.optionalNationalCode')}
variant="outlined"
sx={{ width: '309px' }}
sx={fieldSx}
/>
</Box>
<Box sx={{ display: 'flex', gap: 2 }}>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }}>
<Autocomplete
options={countries}
getOptionLabel={(c) => (typeof c === 'string' ? c : c.fa)}
@@ -169,15 +141,12 @@ export function PersonalInfoFields({
onBlur={handleCountryBlur}
/>
)}
sx={{ width: '309px' }}
sx={fieldSx}
/>
<TextField
label={t('completion.dateOfBirth')}
placeholder={t('completion.dateOfBirth')}
variant="outlined"
sx={{ width: '309px' }}
/>
<Box sx={fieldSx}>
<DateOfBirth />
</Box>
</Box>
</Box>
);

View File

@@ -5,13 +5,30 @@ export function SubmitSection() {
const { t } = useTranslation('completionForm');
return (
<Box sx={{ display: 'flex', gap: 2, px: 6, mb: '17px' }}>
<Box
sx={{
display: 'flex',
flexDirection: { xs: 'column', sm: 'row' },
alignItems: { xs: 'stretch', sm: 'center' },
gap: 2,
px: { xs: 2, sm: 4, md: 6 },
mb: '17px',
}}
>
<Typography variant="body2" sx={{ flex: 1 }} color="text.primary">
{t('completion.agreementPart1')}
<Link target="_blank">{t('completion.agreementLinkText')}</Link>{' '}
<Link target="_blank" rel="noopener" href="#">
{t('completion.agreementLinkText')}
</Link>{' '}
{t('completion.agreementPart2')}
</Typography>
<Button variant="contained" sx={{ width: '247px' }}>
<Button
variant="contained"
sx={{
width: { xs: '100%', sm: '247px' },
alignSelf: { xs: 'stretch', sm: 'auto' },
}}
>
{t('completion.registerButton')}
</Button>
</Box>

View File

@@ -19,7 +19,7 @@ export function UserCompletionForm() {
const [verificationCode, setVerificationCode] = useState('');
const [buttonState, setButtonState] = useState<
'default' | 'counting' | 'sent'
>('default'); // default | counting | sent
>('default');
const [countdown, setCountdown] = useState(60);
const [emailVerified, setEmailVerified] = useState(false);
const [isVerifyingCode, setIsVerifyingCode] = useState(false);
@@ -32,7 +32,6 @@ export function UserCompletionForm() {
const validPassword =
hasNumber && hasMinLength && hasUpperAndLower && hasSpecialChar;
const [showPasswordValidations, setShowPasswordValidations] = useState(false);
const correctEmail = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
useEffect(() => {
@@ -40,9 +39,7 @@ export function UserCompletionForm() {
if (!validPassword) {
setShowPasswordValidations(true);
} else {
const timer = setTimeout(() => {
setShowPasswordValidations(false);
}, 1000);
const timer = setTimeout(() => setShowPasswordValidations(false), 1000);
return () => clearTimeout(timer);
}
} else {
@@ -71,8 +68,7 @@ export function UserCompletionForm() {
if (buttonState === 'counting') {
const minutes = String(Math.floor(countdown / 60)).padStart(2, '0');
const seconds = String(countdown % 60).padStart(2, '0');
const time = `${minutes}:${seconds}`;
return toPersianDigits(time);
return toPersianDigits(`${minutes}:${seconds}`);
}
return t('completion.vericationCodeButton');
};
@@ -103,41 +99,38 @@ export function UserCompletionForm() {
return (
<Box
sx={{
backgroundColor: '#F5F5F5',
backgroundColor: 'background.default',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
p: 2,
p: { xs: 1, sm: 2, md: 3 },
}}
>
<Box
sx={{
width: '730px',
backgroundColor: '#FFFFFF',
width: '100%',
maxWidth: '730px',
backgroundColor: 'background.paper',
border: '1px solid #ccc',
display: 'flex',
flexDirection: 'column',
gap: 2,
px: { xs: 2, sm: 4, md: 6 },
py: { xs: 3, sm: 4 },
}}
>
<Box
sx={{
display: 'flex',
flexDirection: 'column',
px: 4,
width: '100%',
maxWidth: '666px',
height: '92px',
mt: '32px',
gap: 1,
}}
>
<Typography
variant="h5"
color="text.primary"
sx={{ mt: '16px', px: 2 }}
>
<Typography variant="h5" color="text.primary">
{t('completion.title')}
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ px: 2 }}>
<Typography variant="body2" color="text.secondary">
{t('completion.description')}
</Typography>
</Box>

View File

@@ -0,0 +1,33 @@
// components/CountryList.ts
export const countries = [
{ name: 'Afghanistan', fa: 'افغانستان', flag: 'af' },
{ name: 'Albania', fa: 'آلبانی', flag: 'al' },
{ name: 'Algeria', fa: 'الجزایر', flag: 'dz' },
{ name: 'Argentina', fa: 'آرژانتین', flag: 'ar' },
{ name: 'Armenia', fa: 'ارمنستان', flag: 'am' },
{ name: 'Australia', fa: 'استرالیا', flag: 'au' },
{ name: 'Austria', fa: 'اتریش', flag: 'at' },
{ name: 'Bahrain', fa: 'بحرین', flag: 'bh' },
{ name: 'Canada', fa: 'کانادا', flag: 'ca' },
{ name: 'China', fa: 'چین', flag: 'cn' },
{ name: 'France', fa: 'فرانسه', flag: 'fr' },
{ name: 'Germany', fa: 'آلمان', flag: 'de' },
{ name: 'India', fa: 'هند', flag: 'in' },
{ name: 'Iran', fa: 'ایران', flag: 'ir' },
{ name: 'Iraq', fa: 'عراق', flag: 'iq' },
{ name: 'Italy', fa: 'ایتالیا', flag: 'it' },
{ name: 'Japan', fa: 'ژاپن', flag: 'jp' },
{ name: 'Netherlands', fa: 'هلند', flag: 'nl' },
{ name: 'Pakistan', fa: 'پاکستان', flag: 'pk' },
{ name: 'Qatar', fa: 'قطر', flag: 'qa' },
{ name: 'Russia', fa: 'روسیه', flag: 'ru' },
{ name: 'Saudi Arabia', fa: 'عربستان سعودی', flag: 'sa' },
{ name: 'Spain', fa: 'اسپانیا', flag: 'es' },
{ name: 'Sweden', fa: 'سوئد', flag: 'se' },
{ name: 'Switzerland', fa: 'سوئیس', flag: 'ch' },
{ name: 'Turkey', fa: 'ترکیه', flag: 'tr' },
{ name: 'United Arab Emirates', fa: 'امارات متحده عربی', flag: 'ae' },
{ name: 'United Kingdom', fa: 'بریتانیا', flag: 'gb' },
{ name: 'United States', fa: 'ایالات متحده آمریکا', flag: 'us' },
{ name: 'Yemen', fa: 'یمن', flag: 'ye' },
];

View File

@@ -13,6 +13,18 @@ export const CustomThemeProvider: React.FC<{ children: React.ReactNode }> = ({
const direction = i18n.dir(i18n.language);
return createTheme({
components: {
MuiSelect: {
styleOverrides: {
root: {
textAlign: 'left',
},
select: {
textAlign: 'left',
},
},
},
},
direction: direction,
colorSchemes: {
light: {