From dc76caadef848e70c2121473fa88d38c5e874add Mon Sep 17 00:00:00 2001 From: Victor Frunze Date: Wed, 18 Dec 2024 10:03:51 +0200 Subject: [PATCH] custom-icons-page: add page and icons --- .../frontend/src/layouts/app/config.js | 54 +++------- .../frontend/src/pages/app/icons/index.js | 98 +++++++++++++++++++ 2 files changed, 112 insertions(+), 40 deletions(-) create mode 100644 mapping_workbench/frontend/src/pages/app/icons/index.js diff --git a/mapping_workbench/frontend/src/layouts/app/config.js b/mapping_workbench/frontend/src/layouts/app/config.js index d3fd32d0..de9e09ea 100644 --- a/mapping_workbench/frontend/src/layouts/app/config.js +++ b/mapping_workbench/frontend/src/layouts/app/config.js @@ -1,20 +1,18 @@ +import {useTranslation} from 'react-i18next'; + +import DvrIcon from '@mui/icons-material/Dvr'; import ArchiveIcon from '@mui/icons-material/Archive'; import TaskAltIcon from '@mui/icons-material/TaskAlt'; -import ModeStandbyIcon from '@mui/icons-material/ModeStandby'; import VerifiedIcon from '@mui/icons-material/Verified'; -import {useTranslation} from 'react-i18next'; - -import SvgIcon from '@mui/material/SvgIcon'; +import ModeStandbyIcon from '@mui/icons-material/ModeStandby'; +import LightbulbCircleIcon from '@mui/icons-material/LightbulbCircle'; +import HomeSmileIcon from 'src/icons/ui/duocolor/home-smile'; -import SettingsApplicationsIcon from '@mui/icons-material/SettingsApplications'; import ApiIcon from '@mui/icons-material/Api'; -import LightbulbCircleIcon from '@mui/icons-material/LightbulbCircle'; -import DvrIcon from '@mui/icons-material/Dvr'; +import SvgIcon from '@mui/material/SvgIcon'; -import HomeSmileIcon from 'src/icons/ui/duocolor/home-smile'; -import {tokens} from 'src/locales/tokens'; import {paths} from 'src/paths'; - +import {tokens} from 'src/locales/tokens'; export const useSections = () => { const {t} = useTranslation(); @@ -45,44 +43,28 @@ export const useSections = () => { items: [{ title: t(tokens.nav.elements_definition), path: paths.app.fields_and_nodes.develop.index, - icon: ( - - - - ), + icon: (), }] }], conceptualMappings: [{ items: [{ title: t(tokens.nav.conceptual_mappings), path: paths.app.conceptual_mapping_rules.develop.index, - icon: ( - - - - ), + icon: (), }] }], technical_mappings: [{ items: [{ title: t(tokens.nav.technical_mappings), path: paths.app.triple_map_fragments.index, - icon: ( - - - - ), + icon: (), }] }], quality_control: [{ items: [{ title: t(tokens.nav.quality_control), path: paths.app.sparql_test_suites.index, - icon: ( - - - - ), + icon: (), }] }], mappingPackages: [ @@ -91,11 +73,7 @@ export const useSections = () => { { title: t(tokens.nav.mapping_packages), path: paths.app.mapping_packages.index, - icon: ( - - - - ), + icon: (), }] } ], @@ -104,11 +82,7 @@ export const useSections = () => { { title: t(tokens.nav.process_monitor), path: paths.app.tasks.index, - icon: ( - - - - ) + icon: () }] }], }; diff --git a/mapping_workbench/frontend/src/pages/app/icons/index.js b/mapping_workbench/frontend/src/pages/app/icons/index.js new file mode 100644 index 00000000..92c5bee5 --- /dev/null +++ b/mapping_workbench/frontend/src/pages/app/icons/index.js @@ -0,0 +1,98 @@ +import Stack from '@mui/material/Stack'; +import SvgIcon from '@mui/material/SvgIcon'; +import Tooltip from '@mui/material/Tooltip'; +import {cloneElement} from 'react'; + +import AlignLeft02 from '../../../icons/ui/duocolor/align-left-02'; +import BarChartSquare02 from '../../../icons/ui/duocolor/bar-chart-square-02'; +import Building04 from '../../../icons/ui/duocolor/building-04'; +import CheckDone01 from '../../../icons/ui/duocolor/check-done-01'; +import CreditCard01 from '../../../icons/ui/duocolor/credit-card-01'; +import CurrencyBitcoinCircle from '../../../icons/ui/duocolor/currency-bitcoin-circle'; +import File01 from '../../../icons/ui/duocolor/file-01'; +import GraduationHat01 from '../../../icons/ui/duocolor/graduation-hat-01'; +import HomeSmile from '../../../icons/ui/duocolor/home-smile'; +import LayoutAlt02 from '../../../icons/ui/duocolor/layout-alt-02'; +import LineChartUp04 from '../../../icons/ui/duocolor/line-chart-up-04'; +import Lock011 from '../../../icons/ui/duocolor/lock-01-1'; +import LogOut01 from '../../../icons/ui/duocolor/log-out-01'; +import Mail03 from '../../../icons/ui/duocolor/mail-03'; +import MessageChatSquare from '../../../icons/ui/duocolor/message-chat-square'; +import ReceiptCheck from '../../../icons/ui/duocolor/receipt-check'; +import Share07 from '../../../icons/ui/duocolor/share-07'; +import ShoppingBag03 from '../../../icons/ui/duocolor/shopping-bag-03'; +import ShoppingCart01 from '../../../icons/ui/duocolor/shopping-cart-01'; +import Truck01 from '../../../icons/ui/duocolor/truck-01'; +import Upload04 from '../../../icons/ui/duocolor/upload-04'; +import Calendar from '../../../icons/ui/duocolor/calendar'; +import Users03 from '../../../icons/ui/duocolor/users-03'; +import XSquare from '../../../icons/ui/duocolor/x-square'; +import XSquare1 from '../../../icons/ui/duocolor/x-square-1'; +import File04 from '../../../icons/ui/duocolor/file-04'; +import Mail04 from '../../../icons/ui/duocolor/mail-04'; +import {Layout as AppLayout} from '../../../layouts/app'; + +const ICONS = [, + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + , + ] + +const Page = () => { + return ( + <> + + {ICONS.map((icon, idx) => { + return + + {cloneElement(icon, { + color: 'red', + fill: 'blue' + })} + + + })} + + + ) + + +// users-03.js +// share-07.js +// graduation-hat-01.js +// file-04.js +// mail-04.js +} + +Page.getLayout = (page) => ( + + {page} + +); + +export default Page;