From f28b641a440563a7ef1afe644161620957c0e120 Mon Sep 17 00:00:00 2001 From: Maksym Date: Thu, 14 Mar 2024 16:18:30 +0200 Subject: [PATCH] Use custom icons (#55) * Add new icons * Add generate icons script * Update components * Update icons usage * Add missing icons * Update navbar * Add script to package.json --- package.json | 3 +- scripts/generate-icons.mjs | 53 ++++++ .../icons/arrow-counter-clockwise-icon.svg | 3 + src/assets/icons/arrow-down-icon.svg | 3 + src/assets/icons/arrow-left-icon.svg | 3 + src/assets/icons/arrow-right-icon.svg | 3 + src/assets/icons/arrow-square-out-icon.svg | 3 + src/assets/icons/arrow-up-icon.svg | 3 + src/assets/icons/backspace-icon.svg | 3 + src/assets/icons/bell-fill-icon.svg | 3 + src/assets/icons/bell-icon.svg | 3 + src/assets/icons/calendar-blank-icon.svg | 3 + src/assets/icons/cardholder-fill-icon.svg | 3 + src/assets/icons/cardholder-icon.svg | 3 + src/assets/icons/caret-left-icon.svg | 3 + src/assets/icons/caret-right-icon.svg | 3 + src/assets/icons/caret-up-down-icon.svg | 3 + src/assets/icons/caret-up-icon.svg | 3 + src/assets/icons/carret-down-icon.svg | 3 + src/assets/icons/chart-bar-fill-icon.svg | 3 + src/assets/icons/chart-bar-icon.svg | 3 + src/assets/icons/chart-line-icon.svg | 3 + src/assets/icons/check-icon.svg | 3 + src/assets/icons/close-icon.svg | 3 + src/assets/icons/copy-simple-icon.svg | 3 + src/assets/icons/dots-six-vertical-icon.svg | 3 + src/assets/icons/dots-three-outline-icon.svg | 3 + src/assets/icons/fingerprint-icon.svg | 3 + src/assets/icons/flag-icon.svg | 3 + src/assets/icons/gift-fill-icon.svg | 3 + src/assets/icons/gift-icon.svg | 4 +- src/assets/icons/headset-icon.svg | 3 + src/assets/icons/history-icon.svg | 3 + src/assets/icons/house-simple-fill-icon.svg | 3 + src/assets/icons/house-simple-icon.svg | 3 + .../icons/identification-card-fill-icon.svg | 3 + src/assets/icons/identification-card-icon.svg | 3 + src/assets/icons/image-icon.svg | 3 + src/assets/icons/infinite-icon.svg | 3 + src/assets/icons/info-icon.svg | 3 + src/assets/icons/key-icon.svg | 3 + src/assets/icons/link-icon.svg | 3 + src/assets/icons/lock-fill-icon.svg | 3 + src/assets/icons/lock-icon.svg | 3 + src/assets/icons/logout-icon.svg | 3 + src/assets/icons/magnifying-glass-icon.svg | 3 + src/assets/icons/map-pin-icon.svg | 3 + src/assets/icons/moon-icon.svg | 3 + src/assets/icons/palette-icon.svg | 3 + src/assets/icons/password-icon.svg | 3 + src/assets/icons/pencil-simple-line-icon.svg | 3 + src/assets/icons/plus-icon.svg | 3 + src/assets/icons/qr-code-icon.svg | 3 + src/assets/icons/question-fill-icon.svg | 3 + src/assets/icons/question-icon.svg | 3 + src/assets/icons/seal-check-1-icon.svg | 3 + src/assets/icons/seal-check-icon.svg | 3 + src/assets/icons/share-1-icon.svg | 3 + src/assets/icons/share-icon.svg | 3 + src/assets/icons/shield-check-icon.svg | 3 + src/assets/icons/sliders-horizontal-icon.svg | 3 + src/assets/icons/stack-simple-fill-icon.svg | 4 + src/assets/icons/stack-simple-icon.svg | 3 + src/assets/icons/star-fill-icon.svg | 3 + src/assets/icons/star-four-icon.svg | 3 + src/assets/icons/star-icon.svg | 3 + .../icons/suitcase-simple-fill-icon.svg | 3 + src/assets/icons/suitcase-simple-icon.svg | 3 + src/assets/icons/sun-icon.svg | 10 + src/assets/icons/swap-icon.svg | 4 +- src/assets/icons/thumbs-down-icon.svg | 3 + src/assets/icons/thumbs-up-icon.svg | 3 + src/assets/icons/trash-simple-icon.svg | 3 + src/assets/icons/trophy-fill-icon.svg | 3 + src/assets/icons/trophy-icon.svg | 4 +- src/assets/icons/user-circle-icon.svg | 3 + src/assets/icons/user-focus-icon.svg | 3 + src/assets/icons/user-icon.svg | 8 +- src/assets/icons/user-plus-icon.svg | 3 + src/assets/icons/users-icon.svg | 3 + src/assets/icons/wallet-filled-icon.svg | 3 + src/assets/icons/wallet-icon.svg | 7 +- src/assets/icons/warning-icon.svg | 3 + src/assets/icons/x-circle-icon.svg | 3 + src/common/AppNavbar.tsx | 9 +- src/common/BackLink.tsx | 3 +- src/common/CredentialCard.tsx | 7 +- src/common/ErrorView.tsx | 3 +- src/common/NoDataView.tsx | 4 +- src/common/PageListFilters.tsx | 3 +- src/common/ProfileMenu.tsx | 10 +- src/contexts/toasts-manager/index.tsx | 10 +- src/enums/icons.ts | 173 +++++++++--------- .../CredentialsId/components/ActionButton.tsx | 3 +- .../Credentials/pages/CredentialsId/index.tsx | 34 +--- .../components/ClaimVCsModal.tsx | 3 +- .../pages/CredentialsRequests/index.tsx | 4 +- .../pages/OrgGroupsId/components/List.tsx | 3 +- .../OrgGroups/pages/OrgGroupsId/index.tsx | 3 +- .../OrgRoot/components/EditLinksDrawer.tsx | 4 +- .../pages/OrgRoot/components/LinkForm.tsx | 5 +- .../pages/OrgRoot/components/LinkItem.tsx | 2 +- .../pages/OrgRoot/components/LinksBlock.tsx | 3 +- .../pages/OrgRoot/components/OrgOverview.tsx | 3 +- .../OrgRoot/components/VerifyProofsBlock.tsx | 3 +- .../Orgs/pages/OrgsId/pages/OrgRoot/index.tsx | 4 +- .../pages/OrgsList/components/ListCard.tsx | 4 +- .../pages/OrgsNew/components/MetadataForm.tsx | 7 +- src/pages/Rewards/pages/EventId/index.tsx | 4 +- .../RewardsRoot/components/BalanceBlock.tsx | 2 +- .../RewardsRoot/components/ClaimWarning.tsx | 5 +- src/pages/Rewards/pages/RewardsRoot/index.tsx | 4 +- src/pages/UiKit/UiKitButtons.tsx | 35 ++-- src/pages/UiKit/UiKitFields.tsx | 17 +- src/pages/UiKit/UiKitOther.tsx | 10 +- src/pages/Wallet/components/SendModal.tsx | 16 +- src/pages/Wallet/index.tsx | 20 +- src/theme/components.ts | 5 - src/ui/UiCopyField.tsx | 3 +- src/ui/UiDialog.tsx | 4 +- src/ui/UiIcon.tsx | 2 +- src/ui/UiImageUploader.tsx | 3 +- src/ui/UiInfoAlert.tsx | 9 +- src/ui/UiSearchField.tsx | 3 +- src/ui/UiSelect.tsx | 5 + 125 files changed, 511 insertions(+), 265 deletions(-) create mode 100644 scripts/generate-icons.mjs create mode 100644 src/assets/icons/arrow-counter-clockwise-icon.svg create mode 100644 src/assets/icons/arrow-down-icon.svg create mode 100644 src/assets/icons/arrow-left-icon.svg create mode 100644 src/assets/icons/arrow-right-icon.svg create mode 100644 src/assets/icons/arrow-square-out-icon.svg create mode 100644 src/assets/icons/arrow-up-icon.svg create mode 100644 src/assets/icons/backspace-icon.svg create mode 100644 src/assets/icons/bell-fill-icon.svg create mode 100644 src/assets/icons/bell-icon.svg create mode 100644 src/assets/icons/calendar-blank-icon.svg create mode 100644 src/assets/icons/cardholder-fill-icon.svg create mode 100644 src/assets/icons/cardholder-icon.svg create mode 100644 src/assets/icons/caret-left-icon.svg create mode 100644 src/assets/icons/caret-right-icon.svg create mode 100644 src/assets/icons/caret-up-down-icon.svg create mode 100644 src/assets/icons/caret-up-icon.svg create mode 100644 src/assets/icons/carret-down-icon.svg create mode 100644 src/assets/icons/chart-bar-fill-icon.svg create mode 100644 src/assets/icons/chart-bar-icon.svg create mode 100644 src/assets/icons/chart-line-icon.svg create mode 100644 src/assets/icons/check-icon.svg create mode 100644 src/assets/icons/close-icon.svg create mode 100644 src/assets/icons/copy-simple-icon.svg create mode 100644 src/assets/icons/dots-six-vertical-icon.svg create mode 100644 src/assets/icons/dots-three-outline-icon.svg create mode 100644 src/assets/icons/fingerprint-icon.svg create mode 100644 src/assets/icons/flag-icon.svg create mode 100644 src/assets/icons/gift-fill-icon.svg create mode 100644 src/assets/icons/headset-icon.svg create mode 100644 src/assets/icons/history-icon.svg create mode 100644 src/assets/icons/house-simple-fill-icon.svg create mode 100644 src/assets/icons/house-simple-icon.svg create mode 100644 src/assets/icons/identification-card-fill-icon.svg create mode 100644 src/assets/icons/identification-card-icon.svg create mode 100644 src/assets/icons/image-icon.svg create mode 100644 src/assets/icons/infinite-icon.svg create mode 100644 src/assets/icons/info-icon.svg create mode 100644 src/assets/icons/key-icon.svg create mode 100644 src/assets/icons/link-icon.svg create mode 100644 src/assets/icons/lock-fill-icon.svg create mode 100644 src/assets/icons/lock-icon.svg create mode 100644 src/assets/icons/logout-icon.svg create mode 100644 src/assets/icons/magnifying-glass-icon.svg create mode 100644 src/assets/icons/map-pin-icon.svg create mode 100644 src/assets/icons/moon-icon.svg create mode 100644 src/assets/icons/palette-icon.svg create mode 100644 src/assets/icons/password-icon.svg create mode 100644 src/assets/icons/pencil-simple-line-icon.svg create mode 100644 src/assets/icons/plus-icon.svg create mode 100644 src/assets/icons/qr-code-icon.svg create mode 100644 src/assets/icons/question-fill-icon.svg create mode 100644 src/assets/icons/question-icon.svg create mode 100644 src/assets/icons/seal-check-1-icon.svg create mode 100644 src/assets/icons/seal-check-icon.svg create mode 100644 src/assets/icons/share-1-icon.svg create mode 100644 src/assets/icons/share-icon.svg create mode 100644 src/assets/icons/shield-check-icon.svg create mode 100644 src/assets/icons/sliders-horizontal-icon.svg create mode 100644 src/assets/icons/stack-simple-fill-icon.svg create mode 100644 src/assets/icons/stack-simple-icon.svg create mode 100644 src/assets/icons/star-fill-icon.svg create mode 100644 src/assets/icons/star-four-icon.svg create mode 100644 src/assets/icons/star-icon.svg create mode 100644 src/assets/icons/suitcase-simple-fill-icon.svg create mode 100644 src/assets/icons/suitcase-simple-icon.svg create mode 100644 src/assets/icons/sun-icon.svg create mode 100644 src/assets/icons/thumbs-down-icon.svg create mode 100644 src/assets/icons/thumbs-up-icon.svg create mode 100644 src/assets/icons/trash-simple-icon.svg create mode 100644 src/assets/icons/trophy-fill-icon.svg create mode 100644 src/assets/icons/user-circle-icon.svg create mode 100644 src/assets/icons/user-focus-icon.svg create mode 100644 src/assets/icons/user-plus-icon.svg create mode 100644 src/assets/icons/users-icon.svg create mode 100644 src/assets/icons/wallet-filled-icon.svg create mode 100644 src/assets/icons/warning-icon.svg create mode 100644 src/assets/icons/x-circle-icon.svg diff --git a/package.json b/package.json index 30a5510b..5d998b01 100644 --- a/package.json +++ b/package.json @@ -28,7 +28,8 @@ "lint": "yarn lint:scripts", "lint:scripts": "eslint \"{src,config}/**/*.{js,ts,jsx,tsx}\" --cache --fix --max-warnings=0", "preview": "vite preview", - "rsc": "node scripts/release-sanity-check.mjs" + "rsc": "node scripts/release-sanity-check.mjs", + "generate-icons": "node scripts/generate-icons.mjs" }, "dependencies": { "@distributedlab/jac": "^1.0.0-rc.14", diff --git a/scripts/generate-icons.mjs b/scripts/generate-icons.mjs new file mode 100644 index 00000000..754d3627 --- /dev/null +++ b/scripts/generate-icons.mjs @@ -0,0 +1,53 @@ +/* eslint-disable no-console */ +import fs from 'fs' +import camelCase from 'lodash/camelCase.js' +import upperFirst from 'lodash/upperFirst.js' +import path, { dirname } from 'path' +import { fileURLToPath } from 'url' + +const __filename = fileURLToPath(import.meta.url) +const __dirname = dirname(__filename) + +const iconsDir = path.resolve(__dirname, '../src/assets/icons') +const iconsEnumFile = path.resolve(__dirname, '../src/enums/icons.ts') + +const ICONS_ENUM_FILE_TEMPLATE = `import { SvgIcon } from '@mui/material' + +export enum Icons { + %s +} + +export const ICON_COMPONENTS: Record = {} +` + +function generateIconsEnum() { + const iconNames = fs + .readdirSync(iconsDir) + .filter(file => file.endsWith('.svg')) + .map(file => file.replace('-icon.svg', '')) + + const iconEnum = iconNames + .map(iconName => `${upperFirst(camelCase(iconName))} = '${iconName}',`) + .join('\n ') + + fs.writeFileSync(iconsEnumFile, ICONS_ENUM_FILE_TEMPLATE.replace('%s', iconEnum)) + console.log(`Generated ${iconNames.length} icons.`) + console.log(`Icons enum saved to ${iconsEnumFile}`) +} + +function renameIconFiles() { + const iconsToRename = fs + .readdirSync(iconsDir) + .filter(file => file.endsWith('.svg')) + .filter(file => !file.endsWith('-icon.svg')) + + iconsToRename.forEach(file => { + const filePath = path.resolve(iconsDir, file) + const newFilePath = path.resolve(iconsDir, file.replace('.svg', '-icon.svg')) + fs.renameSync(filePath, newFilePath) + }) + console.log(`Renamed ${iconsToRename.length} icon files.`) +} + +renameIconFiles() +generateIconsEnum() diff --git a/src/assets/icons/arrow-counter-clockwise-icon.svg b/src/assets/icons/arrow-counter-clockwise-icon.svg new file mode 100644 index 00000000..2b362488 --- /dev/null +++ b/src/assets/icons/arrow-counter-clockwise-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/arrow-down-icon.svg b/src/assets/icons/arrow-down-icon.svg new file mode 100644 index 00000000..72495935 --- /dev/null +++ b/src/assets/icons/arrow-down-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/arrow-left-icon.svg b/src/assets/icons/arrow-left-icon.svg new file mode 100644 index 00000000..a8e93e9a --- /dev/null +++ b/src/assets/icons/arrow-left-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/arrow-right-icon.svg b/src/assets/icons/arrow-right-icon.svg new file mode 100644 index 00000000..c71e3de1 --- /dev/null +++ b/src/assets/icons/arrow-right-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/arrow-square-out-icon.svg b/src/assets/icons/arrow-square-out-icon.svg new file mode 100644 index 00000000..1983786c --- /dev/null +++ b/src/assets/icons/arrow-square-out-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/arrow-up-icon.svg b/src/assets/icons/arrow-up-icon.svg new file mode 100644 index 00000000..2a6c5e0a --- /dev/null +++ b/src/assets/icons/arrow-up-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/backspace-icon.svg b/src/assets/icons/backspace-icon.svg new file mode 100644 index 00000000..f1d635cd --- /dev/null +++ b/src/assets/icons/backspace-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/bell-fill-icon.svg b/src/assets/icons/bell-fill-icon.svg new file mode 100644 index 00000000..1f957787 --- /dev/null +++ b/src/assets/icons/bell-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/bell-icon.svg b/src/assets/icons/bell-icon.svg new file mode 100644 index 00000000..d325916f --- /dev/null +++ b/src/assets/icons/bell-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/calendar-blank-icon.svg b/src/assets/icons/calendar-blank-icon.svg new file mode 100644 index 00000000..7b19058e --- /dev/null +++ b/src/assets/icons/calendar-blank-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/cardholder-fill-icon.svg b/src/assets/icons/cardholder-fill-icon.svg new file mode 100644 index 00000000..03a2dadc --- /dev/null +++ b/src/assets/icons/cardholder-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/cardholder-icon.svg b/src/assets/icons/cardholder-icon.svg new file mode 100644 index 00000000..caf8ef3e --- /dev/null +++ b/src/assets/icons/cardholder-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/caret-left-icon.svg b/src/assets/icons/caret-left-icon.svg new file mode 100644 index 00000000..662fb074 --- /dev/null +++ b/src/assets/icons/caret-left-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/caret-right-icon.svg b/src/assets/icons/caret-right-icon.svg new file mode 100644 index 00000000..8d47b3df --- /dev/null +++ b/src/assets/icons/caret-right-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/caret-up-down-icon.svg b/src/assets/icons/caret-up-down-icon.svg new file mode 100644 index 00000000..0dcb0c44 --- /dev/null +++ b/src/assets/icons/caret-up-down-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/caret-up-icon.svg b/src/assets/icons/caret-up-icon.svg new file mode 100644 index 00000000..4536152c --- /dev/null +++ b/src/assets/icons/caret-up-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/carret-down-icon.svg b/src/assets/icons/carret-down-icon.svg new file mode 100644 index 00000000..dd8402d3 --- /dev/null +++ b/src/assets/icons/carret-down-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/chart-bar-fill-icon.svg b/src/assets/icons/chart-bar-fill-icon.svg new file mode 100644 index 00000000..83d8de3c --- /dev/null +++ b/src/assets/icons/chart-bar-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/chart-bar-icon.svg b/src/assets/icons/chart-bar-icon.svg new file mode 100644 index 00000000..3837be9f --- /dev/null +++ b/src/assets/icons/chart-bar-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/chart-line-icon.svg b/src/assets/icons/chart-line-icon.svg new file mode 100644 index 00000000..12bd312d --- /dev/null +++ b/src/assets/icons/chart-line-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/check-icon.svg b/src/assets/icons/check-icon.svg new file mode 100644 index 00000000..30bfe241 --- /dev/null +++ b/src/assets/icons/check-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/close-icon.svg b/src/assets/icons/close-icon.svg new file mode 100644 index 00000000..a245a374 --- /dev/null +++ b/src/assets/icons/close-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/copy-simple-icon.svg b/src/assets/icons/copy-simple-icon.svg new file mode 100644 index 00000000..d5325bd0 --- /dev/null +++ b/src/assets/icons/copy-simple-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/dots-six-vertical-icon.svg b/src/assets/icons/dots-six-vertical-icon.svg new file mode 100644 index 00000000..bab237f2 --- /dev/null +++ b/src/assets/icons/dots-six-vertical-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/dots-three-outline-icon.svg b/src/assets/icons/dots-three-outline-icon.svg new file mode 100644 index 00000000..b9f8a252 --- /dev/null +++ b/src/assets/icons/dots-three-outline-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/fingerprint-icon.svg b/src/assets/icons/fingerprint-icon.svg new file mode 100644 index 00000000..fd310627 --- /dev/null +++ b/src/assets/icons/fingerprint-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/flag-icon.svg b/src/assets/icons/flag-icon.svg new file mode 100644 index 00000000..52e81253 --- /dev/null +++ b/src/assets/icons/flag-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/gift-fill-icon.svg b/src/assets/icons/gift-fill-icon.svg new file mode 100644 index 00000000..a5e52e27 --- /dev/null +++ b/src/assets/icons/gift-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/gift-icon.svg b/src/assets/icons/gift-icon.svg index 2dd9579a..974d28a4 100644 --- a/src/assets/icons/gift-icon.svg +++ b/src/assets/icons/gift-icon.svg @@ -1,3 +1,3 @@ - - + + diff --git a/src/assets/icons/headset-icon.svg b/src/assets/icons/headset-icon.svg new file mode 100644 index 00000000..3e8cd8c9 --- /dev/null +++ b/src/assets/icons/headset-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/history-icon.svg b/src/assets/icons/history-icon.svg new file mode 100644 index 00000000..4ce56b4c --- /dev/null +++ b/src/assets/icons/history-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/house-simple-fill-icon.svg b/src/assets/icons/house-simple-fill-icon.svg new file mode 100644 index 00000000..78a9c75c --- /dev/null +++ b/src/assets/icons/house-simple-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/house-simple-icon.svg b/src/assets/icons/house-simple-icon.svg new file mode 100644 index 00000000..2deccb33 --- /dev/null +++ b/src/assets/icons/house-simple-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/identification-card-fill-icon.svg b/src/assets/icons/identification-card-fill-icon.svg new file mode 100644 index 00000000..aeb514b3 --- /dev/null +++ b/src/assets/icons/identification-card-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/identification-card-icon.svg b/src/assets/icons/identification-card-icon.svg new file mode 100644 index 00000000..feb4d3d9 --- /dev/null +++ b/src/assets/icons/identification-card-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/image-icon.svg b/src/assets/icons/image-icon.svg new file mode 100644 index 00000000..cd4f1d1e --- /dev/null +++ b/src/assets/icons/image-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/infinite-icon.svg b/src/assets/icons/infinite-icon.svg new file mode 100644 index 00000000..450db37d --- /dev/null +++ b/src/assets/icons/infinite-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/info-icon.svg b/src/assets/icons/info-icon.svg new file mode 100644 index 00000000..a26ca29c --- /dev/null +++ b/src/assets/icons/info-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/key-icon.svg b/src/assets/icons/key-icon.svg new file mode 100644 index 00000000..2bf173d8 --- /dev/null +++ b/src/assets/icons/key-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/link-icon.svg b/src/assets/icons/link-icon.svg new file mode 100644 index 00000000..dda100c5 --- /dev/null +++ b/src/assets/icons/link-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/lock-fill-icon.svg b/src/assets/icons/lock-fill-icon.svg new file mode 100644 index 00000000..fa5c01fa --- /dev/null +++ b/src/assets/icons/lock-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/lock-icon.svg b/src/assets/icons/lock-icon.svg new file mode 100644 index 00000000..018f1413 --- /dev/null +++ b/src/assets/icons/lock-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/logout-icon.svg b/src/assets/icons/logout-icon.svg new file mode 100644 index 00000000..aad25008 --- /dev/null +++ b/src/assets/icons/logout-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/magnifying-glass-icon.svg b/src/assets/icons/magnifying-glass-icon.svg new file mode 100644 index 00000000..e62ce3d3 --- /dev/null +++ b/src/assets/icons/magnifying-glass-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/map-pin-icon.svg b/src/assets/icons/map-pin-icon.svg new file mode 100644 index 00000000..31916db4 --- /dev/null +++ b/src/assets/icons/map-pin-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/moon-icon.svg b/src/assets/icons/moon-icon.svg new file mode 100644 index 00000000..27dc727e --- /dev/null +++ b/src/assets/icons/moon-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/palette-icon.svg b/src/assets/icons/palette-icon.svg new file mode 100644 index 00000000..fca68df7 --- /dev/null +++ b/src/assets/icons/palette-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/password-icon.svg b/src/assets/icons/password-icon.svg new file mode 100644 index 00000000..f5e42925 --- /dev/null +++ b/src/assets/icons/password-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/pencil-simple-line-icon.svg b/src/assets/icons/pencil-simple-line-icon.svg new file mode 100644 index 00000000..d829fab8 --- /dev/null +++ b/src/assets/icons/pencil-simple-line-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/plus-icon.svg b/src/assets/icons/plus-icon.svg new file mode 100644 index 00000000..6a2058d5 --- /dev/null +++ b/src/assets/icons/plus-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/qr-code-icon.svg b/src/assets/icons/qr-code-icon.svg new file mode 100644 index 00000000..cbc22051 --- /dev/null +++ b/src/assets/icons/qr-code-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/question-fill-icon.svg b/src/assets/icons/question-fill-icon.svg new file mode 100644 index 00000000..bbe258c4 --- /dev/null +++ b/src/assets/icons/question-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/question-icon.svg b/src/assets/icons/question-icon.svg new file mode 100644 index 00000000..f266c529 --- /dev/null +++ b/src/assets/icons/question-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/seal-check-1-icon.svg b/src/assets/icons/seal-check-1-icon.svg new file mode 100644 index 00000000..912f6388 --- /dev/null +++ b/src/assets/icons/seal-check-1-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/seal-check-icon.svg b/src/assets/icons/seal-check-icon.svg new file mode 100644 index 00000000..912f6388 --- /dev/null +++ b/src/assets/icons/seal-check-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/share-1-icon.svg b/src/assets/icons/share-1-icon.svg new file mode 100644 index 00000000..ef5ea982 --- /dev/null +++ b/src/assets/icons/share-1-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/share-icon.svg b/src/assets/icons/share-icon.svg new file mode 100644 index 00000000..fecac6a8 --- /dev/null +++ b/src/assets/icons/share-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/shield-check-icon.svg b/src/assets/icons/shield-check-icon.svg new file mode 100644 index 00000000..83b4a1bd --- /dev/null +++ b/src/assets/icons/shield-check-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/sliders-horizontal-icon.svg b/src/assets/icons/sliders-horizontal-icon.svg new file mode 100644 index 00000000..41d51b4f --- /dev/null +++ b/src/assets/icons/sliders-horizontal-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/stack-simple-fill-icon.svg b/src/assets/icons/stack-simple-fill-icon.svg new file mode 100644 index 00000000..921f8644 --- /dev/null +++ b/src/assets/icons/stack-simple-fill-icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/assets/icons/stack-simple-icon.svg b/src/assets/icons/stack-simple-icon.svg new file mode 100644 index 00000000..e3718cd5 --- /dev/null +++ b/src/assets/icons/stack-simple-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/star-fill-icon.svg b/src/assets/icons/star-fill-icon.svg new file mode 100644 index 00000000..57894436 --- /dev/null +++ b/src/assets/icons/star-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/star-four-icon.svg b/src/assets/icons/star-four-icon.svg new file mode 100644 index 00000000..bfa9ea1e --- /dev/null +++ b/src/assets/icons/star-four-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/star-icon.svg b/src/assets/icons/star-icon.svg new file mode 100644 index 00000000..bde53d40 --- /dev/null +++ b/src/assets/icons/star-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/suitcase-simple-fill-icon.svg b/src/assets/icons/suitcase-simple-fill-icon.svg new file mode 100644 index 00000000..edd8b9d4 --- /dev/null +++ b/src/assets/icons/suitcase-simple-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/suitcase-simple-icon.svg b/src/assets/icons/suitcase-simple-icon.svg new file mode 100644 index 00000000..f8b53ede --- /dev/null +++ b/src/assets/icons/suitcase-simple-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/sun-icon.svg b/src/assets/icons/sun-icon.svg new file mode 100644 index 00000000..3645b9b8 --- /dev/null +++ b/src/assets/icons/sun-icon.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/assets/icons/swap-icon.svg b/src/assets/icons/swap-icon.svg index 70eae161..cca3bc65 100644 --- a/src/assets/icons/swap-icon.svg +++ b/src/assets/icons/swap-icon.svg @@ -1,3 +1,3 @@ - - + + diff --git a/src/assets/icons/thumbs-down-icon.svg b/src/assets/icons/thumbs-down-icon.svg new file mode 100644 index 00000000..bfd26c06 --- /dev/null +++ b/src/assets/icons/thumbs-down-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/thumbs-up-icon.svg b/src/assets/icons/thumbs-up-icon.svg new file mode 100644 index 00000000..631998a0 --- /dev/null +++ b/src/assets/icons/thumbs-up-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/trash-simple-icon.svg b/src/assets/icons/trash-simple-icon.svg new file mode 100644 index 00000000..27f6f10a --- /dev/null +++ b/src/assets/icons/trash-simple-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/trophy-fill-icon.svg b/src/assets/icons/trophy-fill-icon.svg new file mode 100644 index 00000000..26678f85 --- /dev/null +++ b/src/assets/icons/trophy-fill-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/trophy-icon.svg b/src/assets/icons/trophy-icon.svg index 169e73f8..a2dac757 100644 --- a/src/assets/icons/trophy-icon.svg +++ b/src/assets/icons/trophy-icon.svg @@ -1,3 +1,3 @@ - - + + diff --git a/src/assets/icons/user-circle-icon.svg b/src/assets/icons/user-circle-icon.svg new file mode 100644 index 00000000..361d1180 --- /dev/null +++ b/src/assets/icons/user-circle-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/user-focus-icon.svg b/src/assets/icons/user-focus-icon.svg new file mode 100644 index 00000000..d00d08ec --- /dev/null +++ b/src/assets/icons/user-focus-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/user-icon.svg b/src/assets/icons/user-icon.svg index eaaef992..56d126ae 100644 --- a/src/assets/icons/user-icon.svg +++ b/src/assets/icons/user-icon.svg @@ -1,7 +1,3 @@ - - - - - - + + diff --git a/src/assets/icons/user-plus-icon.svg b/src/assets/icons/user-plus-icon.svg new file mode 100644 index 00000000..d46920ff --- /dev/null +++ b/src/assets/icons/user-plus-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/users-icon.svg b/src/assets/icons/users-icon.svg new file mode 100644 index 00000000..6c420b83 --- /dev/null +++ b/src/assets/icons/users-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/wallet-filled-icon.svg b/src/assets/icons/wallet-filled-icon.svg new file mode 100644 index 00000000..8f957fd1 --- /dev/null +++ b/src/assets/icons/wallet-filled-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/wallet-icon.svg b/src/assets/icons/wallet-icon.svg index 4bb45c98..7c5c69db 100644 --- a/src/assets/icons/wallet-icon.svg +++ b/src/assets/icons/wallet-icon.svg @@ -1,8 +1,3 @@ - - - - - - + diff --git a/src/assets/icons/warning-icon.svg b/src/assets/icons/warning-icon.svg new file mode 100644 index 00000000..7b4cd968 --- /dev/null +++ b/src/assets/icons/warning-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/x-circle-icon.svg b/src/assets/icons/x-circle-icon.svg new file mode 100644 index 00000000..ef2f56f8 --- /dev/null +++ b/src/assets/icons/x-circle-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/common/AppNavbar.tsx b/src/common/AppNavbar.tsx index a0702a00..4d3e6d72 100644 --- a/src/common/AppNavbar.tsx +++ b/src/common/AppNavbar.tsx @@ -54,11 +54,11 @@ const AppNavbar = () => { { route: RoutePaths.Dashboard, iconComponent: }, { route: RoutePaths.Credentials, - iconComponent: , + iconComponent: , }, { route: RoutePaths.Wallet, - iconComponent: , + iconComponent: , }, { route: RoutePaths.Rewards, iconComponent: }, ], @@ -94,10 +94,7 @@ const AppNavbar = () => { - + diff --git a/src/common/BackLink.tsx b/src/common/BackLink.tsx index 337c829d..08ba0ae5 100644 --- a/src/common/BackLink.tsx +++ b/src/common/BackLink.tsx @@ -1,6 +1,7 @@ import { Button, ButtonProps } from '@mui/material' import { NavLink, useLocation } from 'react-router-dom' +import { Icons } from '@/enums' import { UiIcon } from '@/ui' interface Props extends ButtonProps { @@ -17,7 +18,7 @@ export default function BackLink({ to, ...rest }: Props) { variant='text' color='secondary' size='small' - startIcon={} + startIcon={} {...rest} sx={{ width: 'fit-content', ...rest.sx }} > diff --git a/src/common/CredentialCard.tsx b/src/common/CredentialCard.tsx index ad217240..9e0817cc 100644 --- a/src/common/CredentialCard.tsx +++ b/src/common/CredentialCard.tsx @@ -3,6 +3,7 @@ import { W3CCredential } from '@rarimo/rarime-connector' import startCase from 'lodash/startCase' import { formatCredentialType, getCredentialViewProperty, IssuerDetails } from '@/api/modules/zkp' +import { Icons } from '@/enums' import { formatDateMY } from '@/helpers' import { UiIcon } from '@/ui' @@ -70,7 +71,7 @@ export default function CredentialCard({ vc, issuerDetails, ...rest }: Props) { p={2} > {/*TODO: define map for credential types*/} - + @@ -100,11 +101,11 @@ export default function CredentialCard({ vc, issuerDetails, ...rest }: Props) { {vc.expirationDate ? ( <> - + {formatDateMY(vc.expirationDate)} ) : ( - + )} diff --git a/src/common/ErrorView.tsx b/src/common/ErrorView.tsx index f7313c92..662c576c 100644 --- a/src/common/ErrorView.tsx +++ b/src/common/ErrorView.tsx @@ -1,6 +1,7 @@ import { Stack, StackProps, Typography, useTheme } from '@mui/material' import { ReactNode } from 'react' +import { Icons } from '@/enums' import { UiIcon } from '@/ui' interface Props extends StackProps { @@ -11,7 +12,7 @@ interface Props extends StackProps { } export default function ErrorView({ - icon = , + icon = , title = 'Error', description, action, diff --git a/src/common/NoDataView.tsx b/src/common/NoDataView.tsx index c2d854f9..57697324 100644 --- a/src/common/NoDataView.tsx +++ b/src/common/NoDataView.tsx @@ -1,8 +1,6 @@ import { Stack, StackProps, Typography, useTheme } from '@mui/material' import { ReactNode } from 'react' -import { UiIcon } from '@/ui' - interface Props extends StackProps { icon?: ReactNode title?: string @@ -11,7 +9,7 @@ interface Props extends StackProps { } export default function NoDataView({ - icon = , + icon = 📁, title = 'No data', description, action, diff --git a/src/common/PageListFilters.tsx b/src/common/PageListFilters.tsx index 517d95ab..d54505c0 100644 --- a/src/common/PageListFilters.tsx +++ b/src/common/PageListFilters.tsx @@ -3,6 +3,7 @@ import debounce from 'lodash/debounce' import type { ReactNode } from 'react' import { useTranslation } from 'react-i18next' +import { Icons } from '@/enums' import { UiIcon, UiIconButton, UiNavTabs, UiSearchField } from '@/ui' interface Props extends StackProps { @@ -32,7 +33,7 @@ export default function PageListFilters({ tabs, onSearchInput, actionBar, ...res {/* TODO: add filters here */} - + {actionBar && ( diff --git a/src/common/ProfileMenu.tsx b/src/common/ProfileMenu.tsx index 9107be98..aa3d4b8d 100644 --- a/src/common/ProfileMenu.tsx +++ b/src/common/ProfileMenu.tsx @@ -14,7 +14,7 @@ import { Link } from 'react-router-dom' import { zkpSnap } from '@/api/clients' import { UserAvatar } from '@/common' import { config } from '@/config' -import { BusEvents } from '@/enums' +import { BusEvents, Icons } from '@/enums' import { bus, ErrorHandler, formatDid } from '@/helpers' import { useAuth, useCopyToClipboard } from '@/hooks' import { UiIcon, UiIconButton } from '@/ui' @@ -96,7 +96,7 @@ export default function ProfileMenu({ userDid }: ProfileMenuProps) { {formatDid(userDid)} - + @@ -104,7 +104,7 @@ export default function ProfileMenu({ userDid }: ProfileMenuProps) { {/*TODO: Add handler*/} - + {isExporting ? 'Exporting...' : 'Export Identity'} @@ -118,13 +118,13 @@ export default function ProfileMenu({ userDid }: ProfileMenuProps) { sx={menuItemSx} > - + Help Center - + Disconnect diff --git a/src/contexts/toasts-manager/index.tsx b/src/contexts/toasts-manager/index.tsx index d66b5650..2fed8df9 100644 --- a/src/contexts/toasts-manager/index.tsx +++ b/src/contexts/toasts-manager/index.tsx @@ -47,12 +47,12 @@ function ToastsManagerController({ children }: PropsWithChildren) { [t], ) - const defaultIcons = useMemo>( + const defaultIcons = useMemo>( () => ({ - [BusEvents.success]: 'check', - [BusEvents.error]: 'errorOutline', - [BusEvents.warning]: 'warningAmber', - [BusEvents.info]: 'info', + [BusEvents.success]: Icons.Check, + [BusEvents.error]: Icons.Warning, + [BusEvents.warning]: Icons.Warning, + [BusEvents.info]: Icons.Info, }), [], ) diff --git a/src/enums/icons.ts b/src/enums/icons.ts index b2022e5e..36160999 100644 --- a/src/enums/icons.ts +++ b/src/enums/icons.ts @@ -1,102 +1,95 @@ -import AccountCircleIcon from '@mui/icons-material/AccountCircle' -import Add from '@mui/icons-material/Add' -import AddPhotoAlternateOutlined from '@mui/icons-material/AddPhotoAlternateOutlined' -import AllInclusiveOutlinedIcon from '@mui/icons-material/AllInclusiveOutlined' -import ArrowBack from '@mui/icons-material/ArrowBack' -import ArrowDownward from '@mui/icons-material/ArrowDownward' -import ArrowForward from '@mui/icons-material/ArrowForward' -import ArrowUpward from '@mui/icons-material/ArrowUpward' -import CalendarTodayOutlinedIcon from '@mui/icons-material/CalendarTodayOutlined' -import CheckIcon from '@mui/icons-material/Check' -import ChevronLeft from '@mui/icons-material/ChevronLeft' -import ChevronRight from '@mui/icons-material/ChevronRight' -import Close from '@mui/icons-material/Close' -import ContentCopy from '@mui/icons-material/ContentCopy' -import DarkModeOutlined from '@mui/icons-material/DarkModeOutlined' -import DeleteIcon from '@mui/icons-material/Delete' -import DeleteOutlined from '@mui/icons-material/DeleteOutlined' -import DragIndicator from '@mui/icons-material/DragIndicator' -import DriveFileRenameOutlineOutlined from '@mui/icons-material/DriveFileRenameOutlineOutlined' -import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline' -import FingerPrint from '@mui/icons-material/Fingerprint' -import FolderOff from '@mui/icons-material/FolderOff' -import History from '@mui/icons-material/History' -import InfoIcon from '@mui/icons-material/Info' -import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined' -import Key from '@mui/icons-material/Key' -import KeyboardArrowDownOutlinedIcon from '@mui/icons-material/KeyboardArrowDownOutlined' -import Layers from '@mui/icons-material/Layers' -import LightModeOutlined from '@mui/icons-material/LightModeOutlined' -import Link from '@mui/icons-material/Link' -import Logout from '@mui/icons-material/Logout' -import MoreHoriz from '@mui/icons-material/MoreHoriz' -import Notifications from '@mui/icons-material/Notifications' -import OpenInNew from '@mui/icons-material/OpenInNew' -import QrCode from '@mui/icons-material/QrCode' -import Search from '@mui/icons-material/Search' -import ShareOutlined from '@mui/icons-material/ShareOutlined' -import ShowChart from '@mui/icons-material/ShowChart' -import Tune from '@mui/icons-material/Tune' -import Verified from '@mui/icons-material/Verified' -import WarningAmberIcon from '@mui/icons-material/WarningAmber' -import Work from '@mui/icons-material/Work' +import { SvgIcon } from '@mui/material' export enum Icons { + ArrowCounterClockwise = 'arrow-counter-clockwise', + ArrowDown = 'arrow-down', + ArrowLeft = 'arrow-left', + ArrowRight = 'arrow-right', + ArrowSquareOut = 'arrow-square-out', + ArrowUp = 'arrow-up', + Backspace = 'backspace', + BellFill = 'bell-fill', + Bell = 'bell', + CalendarBlank = 'calendar-blank', + CardholderFill = 'cardholder-fill', + Cardholder = 'cardholder', + CaretLeft = 'caret-left', + CaretRight = 'caret-right', + CaretUpDown = 'caret-up-down', + CaretUp = 'caret-up', + CarretDown = 'carret-down', + ChartBarFill = 'chart-bar-fill', + ChartBar = 'chart-bar', + ChartLine = 'chart-line', + Check = 'check', + Close = 'close', + CopySimple = 'copy-simple', + DotsSixVertical = 'dots-six-vertical', + DotsThreeOutline = 'dots-three-outline', Facebook = 'facebook', + Fingerprint = 'fingerprint', + Flag = 'flag', + GiftFill = 'gift-fill', + Gift = 'gift', + Headset = 'headset', + History = 'history', House = 'house', + HouseSimpleFill = 'house-simple-fill', + HouseSimple = 'house-simple', + IdentificationCardFill = 'identification-card-fill', + IdentificationCard = 'identification-card', + Image = 'image', + Infinite = 'infinite', + Info = 'info', Instagram = 'instagram', + Key = 'key', + Link = 'link', + LockFill = 'lock-fill', + Lock = 'lock', + Logout = 'logout', + MagnifyingGlass = 'magnifying-glass', + MapPin = 'map-pin', Metamask = 'metamask', - Rarimo = 'rarimo', + Moon = 'moon', + Palette = 'palette', + Password = 'password', + PencilSimpleLine = 'pencil-simple-line', + Plus = 'plus', + QrCode = 'qr-code', + QuestionFill = 'question-fill', + Question = 'question', Rarime = 'rarime', + Rarimo = 'rarimo', + SealCheck1 = 'seal-check-1', + SealCheck = 'seal-check', + Share1 = 'share-1', + Share = 'share', + ShieldCheck = 'shield-check', + SlidersHorizontal = 'sliders-horizontal', + StackSimpleFill = 'stack-simple-fill', + StackSimple = 'stack-simple', + StarFill = 'star-fill', + StarFour = 'star-four', + Star = 'star', + SuitcaseSimpleFill = 'suitcase-simple-fill', + SuitcaseSimple = 'suitcase-simple', + Sun = 'sun', + Swap = 'swap', + ThumbsDown = 'thumbs-down', + ThumbsUp = 'thumbs-up', + TrashSimple = 'trash-simple', + TrophyFill = 'trophy-fill', + Trophy = 'trophy', Twitter = 'twitter', + UserCircle = 'user-circle', + UserFocus = 'user-focus', User = 'user', + UserPlus = 'user-plus', + Users = 'users', + WalletFilled = 'wallet-filled', Wallet = 'wallet', - Gift = 'gift', - Swap = 'swap', - Trophy = 'trophy', + Warning = 'warning', + XCircle = 'x-circle', } -export const ICON_COMPONENTS = { - accountCircle: AccountCircleIcon, - add: Add, - addPhotoAlternativeOutlined: AddPhotoAlternateOutlined, - arrowForward: ArrowForward, - arrowDownward: ArrowDownward, - arrowUpward: ArrowUpward, - arrowBack: ArrowBack, - check: CheckIcon, - chevronLeft: ChevronLeft, - chevronRight: ChevronRight, - contentCopy: ContentCopy, - close: Close, - darkModeOutlined: DarkModeOutlined, - delete: DeleteIcon, - deleteOutlined: DeleteOutlined, - dragIndicator: DragIndicator, - driveFileRenameOutlineOutlined: DriveFileRenameOutlineOutlined, - errorOutline: ErrorOutlineIcon, - folderOff: FolderOff, - history: History, - info: InfoIcon, - infoOutlined: InfoOutlinedIcon, - key: Key, - keyboardArrowDownOutlined: KeyboardArrowDownOutlinedIcon, - layers: Layers, - lightModeOutlined: LightModeOutlined, - link: Link, - logOut: Logout, - notifications: Notifications, - openInNew: OpenInNew, - qrCode: QrCode, - search: Search, - shareOutlined: ShareOutlined, - tune: Tune, - verified: Verified, - warningAmber: WarningAmberIcon, - work: Work, - fingerprint: FingerPrint, - calendarTodayOutlinedIcon: CalendarTodayOutlinedIcon, - allInclusiveOutlinedIcon: AllInclusiveOutlinedIcon, - moreHoriz: MoreHoriz, - showChart: ShowChart, -} +export const ICON_COMPONENTS: Record = {} diff --git a/src/pages/Credentials/pages/CredentialsId/components/ActionButton.tsx b/src/pages/Credentials/pages/CredentialsId/components/ActionButton.tsx index db895366..8f198474 100644 --- a/src/pages/Credentials/pages/CredentialsId/components/ActionButton.tsx +++ b/src/pages/Credentials/pages/CredentialsId/components/ActionButton.tsx @@ -43,10 +43,11 @@ export default function ActionButton({ > diff --git a/src/pages/Credentials/pages/CredentialsId/index.tsx b/src/pages/Credentials/pages/CredentialsId/index.tsx index 745a8100..d7d40902 100644 --- a/src/pages/Credentials/pages/CredentialsId/index.tsx +++ b/src/pages/Credentials/pages/CredentialsId/index.tsx @@ -5,7 +5,7 @@ import { generatePath, NavLink, useLocation, useParams } from 'react-router-dom' import { zkpSnap } from '@/api/clients' import { getClaimIdFromVC } from '@/api/modules/zkp' import { CredentialCard, NoDataView } from '@/common' -import { RoutePaths } from '@/enums' +import { Icons, RoutePaths } from '@/enums' import { ErrorHandler } from '@/helpers' import { useCredentialsState } from '@/store' import { UiIcon } from '@/ui' @@ -93,7 +93,7 @@ export default function CredentialsId() { direction='row' alignItems='center' > - + Back @@ -108,11 +108,7 @@ export default function CredentialsId() { to={prevVCPath} visibility={isFirstVC ? 'hidden' : 'visible'} > - + @@ -120,36 +116,22 @@ export default function CredentialsId() { - + - + Generate proof - + Get info + ))} diff --git a/src/pages/Credentials/pages/CredentialsRequests/index.tsx b/src/pages/Credentials/pages/CredentialsRequests/index.tsx index e0fc29d6..2cebb552 100644 --- a/src/pages/Credentials/pages/CredentialsRequests/index.tsx +++ b/src/pages/Credentials/pages/CredentialsRequests/index.tsx @@ -5,7 +5,7 @@ import { NavLink } from 'react-router-dom' import { OrgGroupRequestStatuses, OrgGroupRequestWithClaims } from '@/api/modules/orgs' import { PageTitles } from '@/common' -import { BusEvents, RoutePaths } from '@/enums' +import { BusEvents, Icons, RoutePaths } from '@/enums' import { bus } from '@/helpers' import { UiButton, UiIcon } from '@/ui' @@ -37,7 +37,7 @@ export default function CredentialsRequests({ ...rest }: Props) { - + Back diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/components/List.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/components/List.tsx index 73dbb344..71c8ffc0 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/components/List.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/components/List.tsx @@ -7,6 +7,7 @@ import { OrgGroupRequestFiltersMap, OrgGroupRequestStatuses, } from '@/api/modules/orgs' +import { Icons } from '@/enums' import { useLoading } from '@/hooks' import { UiButton, UiIcon } from '@/ui' @@ -109,7 +110,7 @@ export default function List({ filter, ...rest }: Props) { Member Details setIsDrawerShown(false)}> - + {drawerContent} diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/index.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/index.tsx index 50cf3bde..9432ea07 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/index.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgGroups/pages/OrgGroupsId/index.tsx @@ -14,7 +14,7 @@ import { RoutePaths } from '@/enums' import { useLoading, useNestedRoutes } from '@/hooks' import { useOrgDetails } from '@/pages/Orgs/pages/OrgsId/hooks' import { useOrgGroupDetails } from '@/pages/Orgs/pages/OrgsId/pages/OrgGroups/hooks' -import { UiButton, UiIcon } from '@/ui' +import { UiButton } from '@/ui' import { InviteMemberForm, List } from './components' @@ -155,7 +155,6 @@ export default function OrgGroupsId() { } sx={{ ml: 'auto' }} onClick={() => setIsInviteDrawerShown(true)} > diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/EditLinksDrawer.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/EditLinksDrawer.tsx index 2d07f4e8..5b4369cd 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/EditLinksDrawer.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/EditLinksDrawer.tsx @@ -4,7 +4,7 @@ import { useFieldArray } from 'react-hook-form' import { OrgMetadataLink, updateOrgMetadata } from '@/api/modules/orgs' import VerticalDraggableContext from '@/contexts/vertical-draggable' -import { BusEvents } from '@/enums' +import { BusEvents, Icons } from '@/enums' import { bus, ErrorHandler } from '@/helpers' import { useForm } from '@/hooks' import { useOrgDetails } from '@/pages/Orgs/pages/OrgsId/hooks' @@ -100,7 +100,7 @@ export default function EditLinksDrawer({ links, onLinksUpdate, ...rest }: Props variant='text' color='secondary' size='medium' - startIcon={} + startIcon={} onClick={() => append({ title: '', url: '' })} sx={{ mt: fields.length ? 4 : 0 }} > diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkForm.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkForm.tsx index be326dea..a374a8d0 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkForm.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkForm.tsx @@ -5,6 +5,7 @@ import { useMemo } from 'react' import { Controller, FieldArrayWithId, FieldPath } from 'react-hook-form' import { OrgMetadataLink } from '@/api/modules/orgs' +import { Icons } from '@/enums' import { Form } from '@/hooks' import { UiIcon, UiIconButton, UiTextField } from '@/ui' @@ -63,10 +64,10 @@ export default function LinkForm({ field, index, form, onRemove }: Props) { {hasManyLinks && ( - + - + )} diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkItem.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkItem.tsx index 92f10ff2..a3a1a7e1 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkItem.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinkItem.tsx @@ -20,7 +20,7 @@ export default function LinkItem({ link }: Props) { const { palette } = useTheme() const iconProps = useMemo>(() => { - const defaultProps: ComponentProps = { componentName: 'link' } + const defaultProps: ComponentProps = { name: Icons.Link } try { const host = new URL(link.url).host.replace(/^www\./, '') diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinksBlock.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinksBlock.tsx index 3933b69c..987970a8 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinksBlock.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/LinksBlock.tsx @@ -2,6 +2,7 @@ import { Stack, Typography, useTheme } from '@mui/material' import { useState } from 'react' import { NoDataView } from '@/common' +import { Icons } from '@/enums' import { useOrgDetails } from '@/pages/Orgs/pages/OrgsId/hooks' import { UiButton, UiIcon } from '@/ui' @@ -30,7 +31,7 @@ export default function LinksBlock() { variant='text' size='medium' color='secondary' - startIcon={} + startIcon={} onClick={() => setIsLinkDrawerShown(true)} > Edit diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/OrgOverview.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/OrgOverview.tsx index b492fc4a..5b26212c 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/OrgOverview.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/OrgOverview.tsx @@ -1,6 +1,7 @@ import { Avatar, Stack, Typography, useTheme } from '@mui/material' import { OrgsStatuses } from '@/api/modules/orgs' +import { Icons } from '@/enums' import { useOrgDetails } from '@/pages/Orgs/pages/OrgsId/hooks' import { UiIcon } from '@/ui' @@ -37,7 +38,7 @@ export default function OrgOverview() { {org.status.value === OrgsStatuses.Verified && ( - + )} diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/VerifyProofsBlock.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/VerifyProofsBlock.tsx index af9eaee3..26ea0ee6 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/VerifyProofsBlock.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/components/VerifyProofsBlock.tsx @@ -2,6 +2,7 @@ import { Grid, Stack, Typography, useTheme } from '@mui/material' import { useState } from 'react' import { useLinkProofs } from '@/api/modules/link' +import { Icons } from '@/enums' import { UiIcon, UiTooltip } from '@/ui' import ProofFieldForm from './ProofFieldForm' @@ -30,7 +31,7 @@ export default function VerifyProofsBlock() { 'Please use Verify to check whether the source officially represents Rarimo. Email address, phone number, Discord ID, Twitter account or Telegram ID.' } > - + diff --git a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/index.tsx b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/index.tsx index 2fa721d7..4ea72abf 100644 --- a/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/index.tsx +++ b/src/pages/Orgs/pages/OrgsId/pages/OrgRoot/index.tsx @@ -1,7 +1,7 @@ import { Box, Stack, Typography, useTheme } from '@mui/material' import { NavLink } from 'react-router-dom' -import { RoutePaths } from '@/enums' +import { Icons, RoutePaths } from '@/enums' import { useOrgDetails } from '@/pages/Orgs/pages/OrgsId/hooks' import { UiIcon } from '@/ui' @@ -22,7 +22,7 @@ export default function OrgRoot() { spacing={2} color={palette.text.secondary} > - + View all organizations diff --git a/src/pages/Orgs/pages/OrgsList/components/ListCard.tsx b/src/pages/Orgs/pages/OrgsList/components/ListCard.tsx index 939cf802..4bead4e8 100644 --- a/src/pages/Orgs/pages/OrgsList/components/ListCard.tsx +++ b/src/pages/Orgs/pages/OrgsList/components/ListCard.tsx @@ -2,7 +2,7 @@ import { Avatar, Card, CardProps, Grid, Stack, Typography, useTheme } from '@mui import { generatePath, NavLink } from 'react-router-dom' import { Organization, OrgsStatuses } from '@/api/modules/orgs' -import { RoutePaths } from '@/enums' +import { Icons, RoutePaths } from '@/enums' import { Transitions } from '@/theme/constants' import { UiIcon } from '@/ui' @@ -37,7 +37,7 @@ export default function ListCard({ org, ...rest }: Props) { {org.metadata.name} {org.status.value === OrgsStatuses.Verified && ( - + )} diff --git a/src/pages/Orgs/pages/OrgsNew/components/MetadataForm.tsx b/src/pages/Orgs/pages/OrgsNew/components/MetadataForm.tsx index d535e870..4e56afe2 100644 --- a/src/pages/Orgs/pages/OrgsNew/components/MetadataForm.tsx +++ b/src/pages/Orgs/pages/OrgsNew/components/MetadataForm.tsx @@ -3,6 +3,7 @@ import { HTMLAttributes, useCallback } from 'react' import { Controller } from 'react-hook-form' import { createOrg, Organization } from '@/api/modules/orgs' +import { Icons } from '@/enums' import { ErrorHandler } from '@/helpers' import { useForm } from '@/hooks' import { useIdentityState } from '@/store' @@ -137,11 +138,7 @@ export default function MetadataForm({ formProps, onOrgCreated, ...rest }: Props /> - } - > + }> Create diff --git a/src/pages/Rewards/pages/EventId/index.tsx b/src/pages/Rewards/pages/EventId/index.tsx index e7a3f1c6..789579d9 100644 --- a/src/pages/Rewards/pages/EventId/index.tsx +++ b/src/pages/Rewards/pages/EventId/index.tsx @@ -4,7 +4,7 @@ import { NavLink, useNavigate, useParams } from 'react-router-dom' import { getEventById } from '@/api/modules/points' import { BackLink, ErrorView, NoDataView } from '@/common' -import { RoutePaths } from '@/enums' +import { Icons, RoutePaths } from '@/enums' import { useCopyToClipboard, useLoading } from '@/hooks' import { UiIcon } from '@/ui' @@ -40,7 +40,7 @@ export default function EventId() { variant='text' color='secondary' size='small' - startIcon={} + startIcon={} sx={{ width: 'fit-content' }} onClick={() => copy(window.location.href)} > diff --git a/src/pages/Rewards/pages/RewardsRoot/components/BalanceBlock.tsx b/src/pages/Rewards/pages/RewardsRoot/components/BalanceBlock.tsx index bcba784b..f0245daa 100644 --- a/src/pages/Rewards/pages/RewardsRoot/components/BalanceBlock.tsx +++ b/src/pages/Rewards/pages/RewardsRoot/components/BalanceBlock.tsx @@ -37,7 +37,7 @@ export default function BalanceBlock() { {balance?.rank ?? ''} Leaderboard - + diff --git a/src/pages/Rewards/pages/RewardsRoot/components/ClaimWarning.tsx b/src/pages/Rewards/pages/RewardsRoot/components/ClaimWarning.tsx index 2690ef5e..23f7397b 100644 --- a/src/pages/Rewards/pages/RewardsRoot/components/ClaimWarning.tsx +++ b/src/pages/Rewards/pages/RewardsRoot/components/ClaimWarning.tsx @@ -1,6 +1,7 @@ import { Button, Stack, StackProps, Typography, useTheme } from '@mui/material' import { MouseEvent } from 'react' +import { Icons } from '@/enums' import { UiIcon } from '@/ui' interface Props extends StackProps { @@ -22,13 +23,13 @@ export default function ClaimWarning({ onAction, ...rest }: Props) { {...rest} > - + You have to reach Level 2 to claim } + endIcon={} onClick={onAction} > Earn diff --git a/src/pages/Rewards/pages/RewardsRoot/index.tsx b/src/pages/Rewards/pages/RewardsRoot/index.tsx index 35bfaa5c..eac6b557 100644 --- a/src/pages/Rewards/pages/RewardsRoot/index.tsx +++ b/src/pages/Rewards/pages/RewardsRoot/index.tsx @@ -3,7 +3,7 @@ import { useMemo } from 'react' import { NavLink } from 'react-router-dom' import { PageTitles } from '@/common' -import { RoutePaths } from '@/enums' +import { Icons, RoutePaths } from '@/enums' import { useLoading } from '@/hooks' import { rewardsStore, useRewardsState } from '@/store' import { UiIcon } from '@/ui' @@ -36,7 +36,7 @@ export default function RewardsRoot() { variant='text' size='small' color='secondary' - startIcon={} + startIcon={} > Earn History diff --git a/src/pages/UiKit/UiKitButtons.tsx b/src/pages/UiKit/UiKitButtons.tsx index 9a1f97fc..457fdf24 100644 --- a/src/pages/UiKit/UiKitButtons.tsx +++ b/src/pages/UiKit/UiKitButtons.tsx @@ -1,5 +1,6 @@ import { Stack, Typography } from '@mui/material' +import { Icons } from '@/enums' import { UiButton, UiIcon, UiIconButton } from '@/ui' export default function UiKitButtons() { @@ -47,21 +48,21 @@ export default function UiKitButtons() { {/*ICONS*/} - }> + }> Text - }> + }> Text } - endIcon={} + startIcon={} + endIcon={} > Text - + @@ -107,21 +108,21 @@ export default function UiKitButtons() { {/*ICONS*/} - }> + }> Text - }> + }> Text } - endIcon={} + startIcon={} + endIcon={} > Text - + @@ -167,21 +168,21 @@ export default function UiKitButtons() { {/*ICONS*/} - }> + }> Text - }> + }> Text } - endIcon={} + startIcon={} + endIcon={} > Text - + @@ -193,10 +194,10 @@ export default function UiKitButtons() { justifyContent='flex-start' > - + - + diff --git a/src/pages/UiKit/UiKitFields.tsx b/src/pages/UiKit/UiKitFields.tsx index 78c3ce80..45ad6b65 100644 --- a/src/pages/UiKit/UiKitFields.tsx +++ b/src/pages/UiKit/UiKitFields.tsx @@ -1,6 +1,7 @@ import { InputAdornment, Stack, Typography } from '@mui/material' import { useState } from 'react' +import { Icons } from '@/enums' import { UiCheckbox, UiIcon, UiRadioGroup, UiSelect, UiSwitch, UiTextField } from '@/ui' const SELECT_OPTIONS = [ @@ -70,7 +71,7 @@ export default function UiKitFields() { InputProps={{ startAdornment: ( - + ), }} @@ -81,7 +82,7 @@ export default function UiKitFields() { InputProps={{ endAdornment: ( - + ), }} @@ -92,12 +93,12 @@ export default function UiKitFields() { InputProps={{ startAdornment: ( - + ), endAdornment: ( - + ), }} @@ -136,7 +137,7 @@ export default function UiKitFields() { label='label' options={SELECT_OPTIONS.map(el => ({ ...el, - adornmentLeft: , + adornmentLeft: , }))} value={selectedValue} updateValue={setSelectedValue} @@ -146,7 +147,7 @@ export default function UiKitFields() { label='label' options={SELECT_OPTIONS.map(el => ({ ...el, - adornmentRight: , + adornmentRight: , }))} value={selectedValue} updateValue={setSelectedValue} @@ -156,8 +157,8 @@ export default function UiKitFields() { label='label' options={SELECT_OPTIONS.map(el => ({ ...el, - adornmentLeft: , - adornmentRight: , + adornmentLeft: , + adornmentRight: , }))} value={selectedValue} updateValue={setSelectedValue} diff --git a/src/pages/UiKit/UiKitOther.tsx b/src/pages/UiKit/UiKitOther.tsx index 13764f7d..b351ffe9 100644 --- a/src/pages/UiKit/UiKitOther.tsx +++ b/src/pages/UiKit/UiKitOther.tsx @@ -60,8 +60,8 @@ export default function UiKitOther() { justifyContent='flex-start' > - - + + @@ -71,13 +71,13 @@ export default function UiKitOther() { Popup} menuItems={[ - }> + }> Item 1 , - }> + }> Item 2 , - }> + }> Item 3 , ]} diff --git a/src/pages/Wallet/components/SendModal.tsx b/src/pages/Wallet/components/SendModal.tsx index 8d71c8f6..f3c322de 100644 --- a/src/pages/Wallet/components/SendModal.tsx +++ b/src/pages/Wallet/components/SendModal.tsx @@ -17,14 +17,7 @@ import { BusEvents } from '@/enums' import { bus, ErrorHandler, formatAmount } from '@/helpers' import { useForm } from '@/hooks' import { useWalletState } from '@/store' -import { - UiDialogActions, - UiDialogContent, - UiDialogTitle, - UiIcon, - UiInfoAlert, - UiTextField, -} from '@/ui' +import { UiDialogActions, UiDialogContent, UiDialogTitle, UiInfoAlert, UiTextField } from '@/ui' type Props = DialogProps & { onSend?: () => void @@ -159,13 +152,6 @@ export default function SendModal({ onSend, ...rest }: Props) { - - - ), - }} label={FieldNames.Address} errorMessage={getErrorMessage(FieldNames.Address)} disabled={isFormDisabled} diff --git a/src/pages/Wallet/index.tsx b/src/pages/Wallet/index.tsx index bbf72202..5dc2febc 100644 --- a/src/pages/Wallet/index.tsx +++ b/src/pages/Wallet/index.tsx @@ -89,7 +89,7 @@ export default function Wallet() { } + startIcon={} onClick={() => setIsReceiveModalShown(true)} > Receive @@ -101,7 +101,7 @@ export default function Wallet() { } + startIcon={} onClick={() => setIsSendModalShown(true)} > Send @@ -116,17 +116,7 @@ export default function Wallet() { - } + startIcon={} color='secondary' variant='text' > @@ -155,7 +145,7 @@ export default function Wallet() { - + @@ -164,7 +154,7 @@ export default function Wallet() { History - + diff --git a/src/theme/components.ts b/src/theme/components.ts index 5d84d2ad..6d3943f2 100644 --- a/src/theme/components.ts +++ b/src/theme/components.ts @@ -1,7 +1,5 @@ import { AlertColor, alpha, Components, Theme } from '@mui/material' -import { ICON_COMPONENTS } from '@/enums' - import { Transitions } from './constants' import { vh } from './helpers' import { typography } from './typography' @@ -220,9 +218,6 @@ export const components: Components> = { }, }), }, - defaultProps: { - IconComponent: ICON_COMPONENTS.keyboardArrowDownOutlined, - }, }, MuiIconButton: { defaultProps: { diff --git a/src/ui/UiCopyField.tsx b/src/ui/UiCopyField.tsx index 16a2d976..3fed625d 100644 --- a/src/ui/UiCopyField.tsx +++ b/src/ui/UiCopyField.tsx @@ -1,5 +1,6 @@ import { Paper, Stack, Typography, useTheme } from '@mui/material' +import { Icons } from '@/enums' import { useCopyToClipboard } from '@/hooks' import { UiIcon, UiIconButton } from '@/ui/index' @@ -22,7 +23,7 @@ export default function UiCopyField({ label, value }: Props) { {value} copy(value)}> diff --git a/src/ui/UiDialog.tsx b/src/ui/UiDialog.tsx index 5f91dc73..fd84a4ec 100644 --- a/src/ui/UiDialog.tsx +++ b/src/ui/UiDialog.tsx @@ -9,6 +9,8 @@ import { useTheme, } from '@mui/material' +import { Icons } from '@/enums' + import UiIcon from './UiIcon' import UiIconButton from './UiIconButton' @@ -38,7 +40,7 @@ export function UiDialogTitle({ children, onClose, ...rest }: UiDialogTitleProps aria-label='close' onClick={e => onClose?.(e, 'backdropClick')} > - + ) diff --git a/src/ui/UiIcon.tsx b/src/ui/UiIcon.tsx index e2005707..362fe0f8 100644 --- a/src/ui/UiIcon.tsx +++ b/src/ui/UiIcon.tsx @@ -40,7 +40,7 @@ const UiIcon = forwardRef(({ size = 6, ...props }, ref) => return ( )} ref={ref} component='svg' sx={sx} diff --git a/src/ui/UiImageUploader.tsx b/src/ui/UiImageUploader.tsx index 8a773c46..ce363b6e 100644 --- a/src/ui/UiImageUploader.tsx +++ b/src/ui/UiImageUploader.tsx @@ -9,6 +9,7 @@ import { } from '@mui/material' import { ChangeEvent, forwardRef, useCallback, useMemo } from 'react' +import { Icons } from '@/enums' import { UiIcon } from '@/ui' interface Props extends Omit { @@ -68,7 +69,7 @@ const UiImageUploader = forwardRef( bgcolor={palette.background.default} borderRadius='50%' > - + )} {value?.name || label || 'Upload image'} diff --git a/src/ui/UiInfoAlert.tsx b/src/ui/UiInfoAlert.tsx index 495b5375..d47cda22 100644 --- a/src/ui/UiInfoAlert.tsx +++ b/src/ui/UiInfoAlert.tsx @@ -1,6 +1,7 @@ import { Stack, StackProps, Typography, useTheme } from '@mui/material' import { ReactNode, useMemo } from 'react' +import { Icons } from '@/enums' import { UiIcon } from '@/ui/index' type Props = StackProps & { @@ -35,10 +36,10 @@ export default function UiInfoAlert({ icon, message, severity, ...rest }: Props) () => icon || { - error: , - info: , - success: , - warning: , + error: , + info: , + success: , + warning: , }[severity], [icon, severity], ) diff --git a/src/ui/UiSearchField.tsx b/src/ui/UiSearchField.tsx index 76352cac..8d683308 100644 --- a/src/ui/UiSearchField.tsx +++ b/src/ui/UiSearchField.tsx @@ -1,6 +1,7 @@ import { InputAdornment, useTheme } from '@mui/material' import { ComponentProps, forwardRef } from 'react' +import { Icons } from '@/enums' import { Transitions } from '@/theme/constants' import UiIcon from './UiIcon' @@ -22,7 +23,7 @@ const UiSearchField = forwardRef((props: ComponentProps, ref ...props.InputProps, startAdornment: ( - + ), sx: { diff --git a/src/ui/UiSelect.tsx b/src/ui/UiSelect.tsx index a944fca1..0d98dbb8 100644 --- a/src/ui/UiSelect.tsx +++ b/src/ui/UiSelect.tsx @@ -10,6 +10,10 @@ import { import { ComponentProps, forwardRef, ReactNode, useMemo } from 'react' import { v4 as uuidv4 } from 'uuid' +import { Icons } from '@/enums' + +import UiIcon from './UiIcon' + type Props = Omit>, 'error'> & { options: { value: string @@ -47,6 +51,7 @@ const UiSelect = forwardRef( id={id} labelId={labelId} value={rest.value || ''} + IconComponent={() => } onChange={handleChange} > {options.map(({ value, label, adornmentLeft, adornmentRight }, idx) => (