From 1df8c15030d45779f6adc5031153eaff09701d97 Mon Sep 17 00:00:00 2001 From: woothu <32914662+woothu@users.noreply.github.com> Date: Mon, 1 Jun 2020 18:34:07 +0200 Subject: [PATCH] refacotor: template updates --- package-lock.json | 29 +++++++----- package.json | 6 +-- src/assets/icons/index.js | 10 ++++- src/containers/TheHeader.js | 2 +- src/containers/TheHeaderDropdown.js | 2 +- src/containers/TheHeaderDropdownMssg.js | 2 +- src/containers/TheHeaderDropdownNotif.js | 4 +- src/containers/TheHeaderDropdownTasks.js | 2 +- src/containers/TheSidebar.js | 2 +- src/views/base/cards/Cards.js | 2 +- src/views/base/forms/BasicForms.js | 2 +- src/views/base/list-groups/ListGroups.js | 22 +++++---- src/views/base/navbars/Navbars.js | 2 +- src/views/base/tabs/Tabs.js | 4 +- .../buttons/brand-buttons/BrandButtons.js | 2 +- src/views/buttons/buttons/Buttons.js | 2 +- src/views/charts/ChartBarSimple.js | 4 +- src/views/charts/ChartLineSimple.js | 4 +- src/views/charts/Charts.js | 21 ++++++--- src/views/charts/MainChartExample.js | 45 +++---------------- src/views/dashboard/Dashboard.js | 2 +- src/views/icons/brands/Brands.js | 6 +-- src/views/icons/flags/Flags.js | 2 +- src/views/notifications/modals/Modals.js | 22 ++++----- src/views/pages/login/Login.js | 2 +- src/views/pages/page404/Page404.js | 2 +- src/views/pages/page500/Page500.js | 2 +- src/views/pages/register/Register.js | 2 +- src/views/users/User.js | 2 +- src/views/widgets/Widgets.js | 2 +- src/views/widgets/WidgetsBrand.js | 2 +- src/views/widgets/WidgetsDropdown.js | 2 +- 32 files changed, 103 insertions(+), 114 deletions(-) diff --git a/package-lock.json b/package-lock.json index 15f950f..a4726eb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1204,21 +1204,21 @@ "integrity": "sha512-DAlvdHRC+HHecdy52vskbNzNKEpu6wHDvSlsHGrwOqNxQl1YLhGEtqAW4sKpyVE3GgysNCywUWZGFlLp8I3LgA==" }, "@coreui/icons-react": { - "version": "1.0.0-beta.1", - "resolved": "https://registry.npmjs.org/@coreui/icons-react/-/icons-react-1.0.0-beta.1.tgz", - "integrity": "sha512-lYhZb5rsA4BE+EgQI5fVTafTbwi55LhKwGPXhSxrN6wgJNQaXfOZMORbx0aRCMbWkX9jNOBJ40qYpO+BWd6U0Q==", + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@coreui/icons-react/-/icons-react-1.0.0.tgz", + "integrity": "sha512-rcd/Ezld2Eb8aBdzZ/mv+0lNZ5V0h5bp5ccxuF2jKsw/V77BXH6HP+8uxFwTDNODBovyD5vKNcSjPDk2xyhtqQ==", "requires": { "classnames": "^2.2.6", "prop-types": "^15.7.2" } }, "@coreui/react": { - "version": "3.0.0-beta.6", - "resolved": "https://registry.npmjs.org/@coreui/react/-/react-3.0.0-beta.6.tgz", - "integrity": "sha512-TsPtiKMUuiVdK9pXZk/5pGOgz0xAIlA8LkeowObnF6sfgdlpumzJT9RxSI/ttBYeg9g+U0O+zL2+anUeVbu2Dw==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@coreui/react/-/react-3.0.0.tgz", + "integrity": "sha512-5VwE8qL+6Jn86HFj+FpnPfD5RcjAEgkK7nXl91hwZhvlWV5zkKRPvaoKYM/nXxSDG6tqU6NSjkFLM87vrQqOXw==", "requires": { - "@coreui/icons": "^1.0.1", - "@coreui/icons-react": "^1.0.0-beta.1", + "@coreui/icons": "2.0.0-beta.3", + "@coreui/icons-react": "^1.0.0", "@coreui/utils": "~1.3.1", "@popperjs/core": "~2.4.0", "classnames": "~2.2.6", @@ -1227,12 +1227,19 @@ "prop-types": "~15.7.2", "react-transition-group": "~4.4.1", "tippy.js": "~6.2.3" + }, + "dependencies": { + "@coreui/icons": { + "version": "2.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@coreui/icons/-/icons-2.0.0-beta.3.tgz", + "integrity": "sha512-ZUP4Z8Nh8PfU/g5DMMkU0BPN8vJLSzuOUHKJzOkQvdPv7Zm+ftK5OA491LYn9ybG5QBAZGkpXF/i3cry3PmtUw==" + } } }, "@coreui/react-chartjs": { - "version": "1.0.0-alpha.3", - "resolved": "https://registry.npmjs.org/@coreui/react-chartjs/-/react-chartjs-1.0.0-alpha.3.tgz", - "integrity": "sha512-BBPegbPaXREwpx+Mp3phUKfq6Tsmrb7EzlCoU41s9wBXqCifeCKNl942k411bmeFN5Cx7zdi79pzfp1fManDEw==", + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@coreui/react-chartjs/-/react-chartjs-1.0.0.tgz", + "integrity": "sha512-Td+VpOHpzXiGGkimt0G5fCqmgrrPerAF7iNodVmhY4DyrX5s/Le77TJbkQQbRW2eHsZsQrPyRqGWxOQu7XF7jA==", "requires": { "@coreui/chartjs": "^2.0.0", "chart.js": "^2.9.3", diff --git a/package.json b/package.json index e656f24..74444c0 100644 --- a/package.json +++ b/package.json @@ -26,9 +26,9 @@ "@coreui/chartjs": "^2.0.0", "@coreui/coreui": "^3.2.0", "@coreui/icons": "^1.0.1", - "@coreui/icons-react": "^1.0.0-beta.1", - "@coreui/react": "^3.0.0-beta.6", - "@coreui/react-chartjs": "^1.0.0-alpha.1", + "@coreui/icons-react": "^1.0.0", + "@coreui/react": "^3.0.0", + "@coreui/react-chartjs": "^1.0.0", "@coreui/utils": "^1.3.1", "classnames": "^2.2.6", "core-js": "^3.6.5", diff --git a/src/assets/icons/index.js b/src/assets/icons/index.js index dd25d05..b268b23 100644 --- a/src/assets/icons/index.js +++ b/src/assets/icons/index.js @@ -42,6 +42,8 @@ import { cilAlignRight, cilApplicationsSettings, cilArrowRight, + cilArrowTop, + cilAsterisk, cilBan, cilBasket, cilBell, @@ -104,6 +106,7 @@ import { cilPrint, cilPuzzle, cilSave, + cilScrubber, cilSettings, cilShare, cilShareAll, @@ -122,6 +125,7 @@ import { cilUserFemale, cilUserFollow, cilUserUnfollow, + cilX, cilXCircle, cilWarning } from '@coreui/icons' @@ -136,6 +140,8 @@ export const icons = Object.assign({}, { cilAlignRight, cilApplicationsSettings, cilArrowRight, + cilArrowTop, + cilAsterisk, cilBan, cilBasket, cilBell, @@ -163,12 +169,12 @@ export const icons = Object.assign({}, { cilEnvelopeLetter, cilEnvelopeOpen, cilEuro, - cilGraph, cilGlobeAlt, cilGrid, cilFile, cilFullscreen, cilFullscreenExit, + cilGraph, cilHome, cilInbox, cilIndentDecrease, @@ -198,6 +204,7 @@ export const icons = Object.assign({}, { cilPrint, cilPuzzle, cilSave, + cilScrubber, cilSettings, cilShare, cilShareAll, @@ -216,6 +223,7 @@ export const icons = Object.assign({}, { cilUserFemale, cilUserFollow, cilUserUnfollow, + cilX, cilXCircle, cilWarning }, { diff --git a/src/containers/TheHeader.js b/src/containers/TheHeader.js index 9346ff3..f4fbf44 100644 --- a/src/containers/TheHeader.js +++ b/src/containers/TheHeader.js @@ -11,7 +11,7 @@ import { CBreadcrumbRouter, CLink } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' // routes config import routes from '../routes' diff --git a/src/containers/TheHeaderDropdown.js b/src/containers/TheHeaderDropdown.js index bfdef64..7905080 100644 --- a/src/containers/TheHeaderDropdown.js +++ b/src/containers/TheHeaderDropdown.js @@ -7,7 +7,7 @@ import { CDropdownToggle, CImg } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const TheHeaderDropdown = () => { return ( diff --git a/src/containers/TheHeaderDropdownMssg.js b/src/containers/TheHeaderDropdownMssg.js index 0888cc0..b7f2af5 100644 --- a/src/containers/TheHeaderDropdownMssg.js +++ b/src/containers/TheHeaderDropdownMssg.js @@ -7,7 +7,7 @@ import { CDropdownToggle, CImg } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const TheHeaderDropdownMssg = () => { const itemsCount = 4 diff --git a/src/containers/TheHeaderDropdownNotif.js b/src/containers/TheHeaderDropdownNotif.js index 7ab45d0..261ccff 100644 --- a/src/containers/TheHeaderDropdownNotif.js +++ b/src/containers/TheHeaderDropdownNotif.js @@ -7,7 +7,7 @@ import { CDropdownToggle, CProgress } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const TheHeaderDropdownNotif = () => { const itemsCount = 5 @@ -31,7 +31,7 @@ const TheHeaderDropdownNotif = () => { New user registered User deleted - Sales report is ready + Sales report is ready New client Server overloaded { const itemsCount = 5 diff --git a/src/containers/TheSidebar.js b/src/containers/TheSidebar.js index 62c3264..3a9403e 100644 --- a/src/containers/TheSidebar.js +++ b/src/containers/TheSidebar.js @@ -12,7 +12,7 @@ import { CSidebarNavItem, } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' // sidebar nav config import navigation from './_nav' diff --git a/src/views/base/cards/Cards.js b/src/views/base/cards/Cards.js index 61de578..6404457 100644 --- a/src/views/base/cards/Cards.js +++ b/src/views/base/cards/Cards.js @@ -12,7 +12,7 @@ import { CSwitch, CLink } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Cards = () => { const [collapsed, setCollapsed] = React.useState(true) diff --git a/src/views/base/forms/BasicForms.js b/src/views/base/forms/BasicForms.js index 7310fa7..7f04893 100644 --- a/src/views/base/forms/BasicForms.js +++ b/src/views/base/forms/BasicForms.js @@ -30,7 +30,7 @@ import { CSelect, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const BasicForms = () => { const [collapsed, setCollapsed] = React.useState(true) diff --git a/src/views/base/list-groups/ListGroups.js b/src/views/base/list-groups/ListGroups.js index 5a857a3..2653b58 100644 --- a/src/views/base/list-groups/ListGroups.js +++ b/src/views/base/list-groups/ListGroups.js @@ -7,8 +7,6 @@ import { CCol, CListGroup, CListGroupItem, - CListGroupItemHeading, - CListGroupItemText, CRow, CTabContent, CTabPane @@ -189,27 +187,27 @@ const ListGroups = () => { - +
List group item heading 3 days ago - - +
+
Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit. Donec id elit non mi porta. - +
- List group item heading - +
List group item heading
+
Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit. - +
Small. - List group item heading - +
List group item heading
+
Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit. - +
Small. diff --git a/src/views/base/navbars/Navbars.js b/src/views/base/navbars/Navbars.js index b9bf4f1..9575dd3 100644 --- a/src/views/base/navbars/Navbars.js +++ b/src/views/base/navbars/Navbars.js @@ -19,7 +19,7 @@ import { CButton, CImg } from '@coreui/react' -// import { CIcon } from '@coreui/icons-react' +// import CIcon from '@coreui/icons-react' const CNavbars = () => { const [isOpen, setIsOpen] = useState(false) diff --git a/src/views/base/tabs/Tabs.js b/src/views/base/tabs/Tabs.js index 8cea443..9347e91 100644 --- a/src/views/base/tabs/Tabs.js +++ b/src/views/base/tabs/Tabs.js @@ -12,9 +12,7 @@ import { CTabs, CCardHeader } from '@coreui/react' -import { - CIcon -} from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Tabs = () => { const [active, setActive] = useState(1) diff --git a/src/views/buttons/brand-buttons/BrandButtons.js b/src/views/buttons/brand-buttons/BrandButtons.js index 74f2798..58327d5 100644 --- a/src/views/buttons/brand-buttons/BrandButtons.js +++ b/src/views/buttons/brand-buttons/BrandButtons.js @@ -7,7 +7,7 @@ import { CCol, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const BrandButtons = () => { return ( diff --git a/src/views/buttons/buttons/Buttons.js b/src/views/buttons/buttons/Buttons.js index 2c2d483..7a81375 100644 --- a/src/views/buttons/buttons/Buttons.js +++ b/src/views/buttons/buttons/Buttons.js @@ -7,7 +7,7 @@ import { CCol, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Buttons = () => { return ( diff --git a/src/views/charts/ChartBarSimple.js b/src/views/charts/ChartBarSimple.js index 1b07eb9..485ff95 100644 --- a/src/views/charts/ChartBarSimple.js +++ b/src/views/charts/ChartBarSimple.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import { getColor } from '@coreui/utils/src' -import { CCharts } from '@coreui/react-chartjs' +import { CChartBar } from '@coreui/react-chartjs' const ChartBarSimple = props => { @@ -46,7 +46,7 @@ const ChartBarSimple = props => { // render return ( - { @@ -121,7 +121,7 @@ const ChartLineSimple = props => { // render return ( - { @@ -21,7 +28,7 @@ const Charts = () => { - { Doughnut Chart - { Line Chart - { Pie Chart - { Polar Area Chart - { Radar Chart - { - - const { - borderColor, - backgroundColor, - pointHoverBackgroundColor, - dataPoints, - label, - pointed, - ...attributes - } = props +const brandSuccess = getStyle('success') || '#4dbd74' +const brandInfo = getStyle('info') || '#20a8d8' +const brandDanger = getStyle('danger') || '#f86c6b' +const MainChartExample = attributes => { const random = (min, max)=>{ return Math.floor(Math.random() * (max - min + 1) + min) } const defaultDatasets = (()=>{ - const brandSuccess = getColor('success') || '#4dbd74' - const brandInfo = getColor('info') || '#20a8d8' - const brandDanger = getColor('danger') || '#f86c6b' let elements = 27 const data1 = [] const data2 = [] @@ -99,34 +88,14 @@ const MainChartExample = props => { // render return ( - ) - } -MainChartExample.propTypes = { - tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), - className: PropTypes.string, - // - borderColor: PropTypes.string, - backgroundColor: PropTypes.string, - pointHoverBackgroundColor: PropTypes.string, - dataPoints: PropTypes.array, - label: PropTypes.string, - pointed: PropTypes.bool -}; - -MainChartExample.defaultProps = { - borderColor: 'rgba(255,255,255,.55)', - backgroundColor: 'transparent', - dataPoints: [10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12], - label: 'Sales' -}; export default MainChartExample diff --git a/src/views/dashboard/Dashboard.js b/src/views/dashboard/Dashboard.js index 8a7ac65..38cad02 100644 --- a/src/views/dashboard/Dashboard.js +++ b/src/views/dashboard/Dashboard.js @@ -12,7 +12,7 @@ import { CRow, CCallout } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' import MainChartExample from '../charts/MainChartExample.js' diff --git a/src/views/icons/brands/Brands.js b/src/views/icons/brands/Brands.js index 4029c79..3168e8b 100644 --- a/src/views/icons/brands/Brands.js +++ b/src/views/icons/brands/Brands.js @@ -1,6 +1,6 @@ import React from 'react' import { CCard, CCardBody, CCardHeader, CCol, CRow } from '@coreui/react' -import { CIconRaw } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' import { brandSet } from '@coreui/icons' const toKebabCase = (str) => { @@ -10,7 +10,7 @@ const toKebabCase = (str) => { export const getIconsView = iconset => { return Object.entries(iconset).map(([name, value]) => ( - +
{toKebabCase(name)}
 )) @@ -20,7 +20,7 @@ const CoreUIIcons = () => { return ( - Brand Icons / as CIconRaw{' '} + Brand Icons / as CIcon{' '}
Github diff --git a/src/views/icons/flags/Flags.js b/src/views/icons/flags/Flags.js index 6693df2..1927600 100644 --- a/src/views/icons/flags/Flags.js +++ b/src/views/icons/flags/Flags.js @@ -7,7 +7,7 @@ const CoreUIIcons = () => { return ( - Flag Icons / as CIconRaw{' '} + Flag Icons / as CIcon{' '}
Github diff --git a/src/views/notifications/modals/Modals.js b/src/views/notifications/modals/Modals.js index 66e90df..c3c8de8 100644 --- a/src/views/notifications/modals/Modals.js +++ b/src/views/notifications/modals/Modals.js @@ -36,6 +36,12 @@ const Modals = () => { onClick={() => setModal(!modal)} className="mr-1" >Launch demo modal + setLarge(!large)} className="mr-1"> + Launch large modal + + setSmall(!large)} className="mr-1"> + Launch small modal + { - setLarge(!large)} className="mr-1"> - Launch large modal - + setLarge(!large)} @@ -83,9 +87,6 @@ const Modals = () => { - setLarge(!large)} className="mr-1"> - Launch small modal - setSmall(!small)} @@ -112,6 +113,11 @@ const Modals = () => { setPrimary(!primary)} className="mr-1"> Primary modal + setSuccess(!success)} className="mr-1">Success modal + setWarning(!warning)} className="mr-1">Warning modal + setDanger(!danger)} className="mr-1">Danger modal + setInfo(!info)} className="mr-1">Info modal + setPrimary(!primary)} @@ -137,7 +143,6 @@ const Modals = () => { - setSuccess(!success)} className="mr-1">Success modal setSuccess(!success)} @@ -159,7 +164,6 @@ const Modals = () => { - setWarning(!warning)} className="mr-1">Warning modal setWarning(!warning)} @@ -181,7 +185,6 @@ const Modals = () => { - setDanger(!danger)} className="mr-1">Danger modal setDanger(!danger)} @@ -203,7 +206,6 @@ const Modals = () => { - setInfo(!info)} className="mr-1">Info modal setInfo(!info)} diff --git a/src/views/pages/login/Login.js b/src/views/pages/login/Login.js index 43fb8db..7f90972 100644 --- a/src/views/pages/login/Login.js +++ b/src/views/pages/login/Login.js @@ -14,7 +14,7 @@ import { CInputGroupText, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Login = () => { return ( diff --git a/src/views/pages/page404/Page404.js b/src/views/pages/page404/Page404.js index 057972e..4461e64 100644 --- a/src/views/pages/page404/Page404.js +++ b/src/views/pages/page404/Page404.js @@ -10,7 +10,7 @@ import { CInputGroupText, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Page404 = () => { return ( diff --git a/src/views/pages/page500/Page500.js b/src/views/pages/page500/Page500.js index 2ee200e..1ea3998 100644 --- a/src/views/pages/page500/Page500.js +++ b/src/views/pages/page500/Page500.js @@ -10,7 +10,7 @@ import { CInputGroupText, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Page500 = () => { return ( diff --git a/src/views/pages/register/Register.js b/src/views/pages/register/Register.js index de0d1aa..6837ae6 100644 --- a/src/views/pages/register/Register.js +++ b/src/views/pages/register/Register.js @@ -13,7 +13,7 @@ import { CInputGroupText, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Register = () => { return ( diff --git a/src/views/users/User.js b/src/views/users/User.js index 83b640c..330d154 100644 --- a/src/views/users/User.js +++ b/src/views/users/User.js @@ -1,6 +1,6 @@ import React from 'react' import { CCard, CCardBody, CCardHeader, CCol, CRow } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' import usersData from './UsersData' diff --git a/src/views/widgets/Widgets.js b/src/views/widgets/Widgets.js index 7ab3b37..f072de7 100644 --- a/src/views/widgets/Widgets.js +++ b/src/views/widgets/Widgets.js @@ -17,7 +17,7 @@ import WidgetsDropdown from './WidgetsDropdown' import ChartLineSimple from '../charts/ChartLineSimple' import ChartBarSimple from '../charts/ChartBarSimple' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' const Widgets = () => { return ( diff --git a/src/views/widgets/WidgetsBrand.js b/src/views/widgets/WidgetsBrand.js index 05af1a2..4cf0719 100644 --- a/src/views/widgets/WidgetsBrand.js +++ b/src/views/widgets/WidgetsBrand.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { CWidgetBrand, CRow, CCol } from '@coreui/react'; -import { CIcon } from '@coreui/icons-react'; +import CIcon from '@coreui/icons-react'; import ChartLineSimple from '../charts/ChartLineSimple'; const WidgetsBrand = ({withCharts})=>{ diff --git a/src/views/widgets/WidgetsDropdown.js b/src/views/widgets/WidgetsDropdown.js index efebaab..3d0d86f 100644 --- a/src/views/widgets/WidgetsDropdown.js +++ b/src/views/widgets/WidgetsDropdown.js @@ -8,7 +8,7 @@ import { CDropdownItem, CDropdownToggle } from '@coreui/react' -import { CIcon } from '@coreui/icons-react' +import CIcon from '@coreui/icons-react' import ChartLineSimple from '../charts/ChartLineSimple' import ChartBarSimple from '../charts/ChartBarSimple'