refactor: import components from '@coreui/react' instead of '@coreui/react-ts'

src/components/AppBreadcrumb.js

@@ -3,7 +3,7 @@ import { useLocation } from 'react-router-dom'
 
 import routes from '../routes'
 
-import { CBreadcrumb, CBreadcrumbItem } from '@coreui/react-ts'
+import { CBreadcrumb, CBreadcrumbItem } from '@coreui/react'
 
 const AppBreadcrumb = () => {
   const currentLocation = useLocation().pathname

src/components/AppFooter.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CFooter } from '@coreui/react-ts'
+import { CFooter } from '@coreui/react'
 
 const AppFooter = () => {
   return (
@@ -8,7 +8,7 @@ const AppFooter = () => {
         <a href="https://coreui.io" target="_blank" rel="noopener noreferrer">
           CoreUI
         </a>
-        <span className="ms-1">&copy; 2020 creativeLabs.</span>
+        <span className="ms-1">&copy; 2021 creativeLabs.</span>
       </div>
       <div className="ms-auto">
         <span className="me-1">Powered by</span>

src/components/AppHeader.js

@@ -10,7 +10,7 @@ import {
   CHeaderToggler,
   CNavLink,
   CNavItem,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 import {

src/components/AppSidebar.js

@@ -7,7 +7,7 @@ import {
   CSidebarNav,
   CSidebarToggler,
   CCreateNavItem,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 
 import CIcon from '@coreui/icons-react'
 
@@ -27,10 +27,8 @@ const AppSidebar = () => {
       show={sidebarShow}
       onShow={() => console.log('show')}
       onHide={() => {
-        console.log('hide')
         dispatch({ type: 'set', sidebarShow: false })
       }}
-      // onShowChange={(val) => dispatch({type: 'set', sidebarShow: val })}
     >
       <CSidebarBrand className="d-md-down-none" to="/">
         <CIcon className="sidebar-brand-full" name="logo-negative" height={35} />

src/components/header/AppHeaderDropdown.js

@@ -8,7 +8,7 @@ import {
   CDropdownItem,
   CDropdownMenu,
   CDropdownToggle,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const AppHeaderDropdown = () => {

src/components/header/AppHeaderDropdownMssg.js

@@ -6,8 +6,7 @@ import {
   CDropdownItem,
   CDropdownMenu,
   CDropdownToggle,
-  CImage,
+} from '@coreui/react'
-} from '@coreui/react-ts'
 import CIcon from '@coreui/icons-react'
 
 const AppHeaderDropdownMssg = () => {

src/components/header/AppHeaderDropdownNotif.js

@@ -6,7 +6,7 @@ import {
   CDropdownMenu,
   CDropdownToggle,
   CProgress,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const AppHeaderDropdownNotif = () => {

src/components/header/AppHeaderDropdownTasks.js

@@ -6,7 +6,7 @@ import {
   CDropdownMenu,
   CDropdownToggle,
   CProgress,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const AppHeaderDropdownTasks = () => {

src/containers/TheContent.js

@@ -1,6 +1,6 @@
 import React, { Suspense } from 'react'
 import { Redirect, Route, Switch } from 'react-router-dom'
-import { CContainer, CFade } from '@coreui/react-ts'
+import { CContainer, CFade } from '@coreui/react'
 
 // routes config
 import routes from '../routes'
@@ -14,7 +14,7 @@ const loading = (
 const TheContent = () => {
   return (
     <main className="c-main">
-      <CContainer>
+      <CContainer lg>
         <Suspense fallback={loading}>
           <Switch>
             {routes.map((route, idx) => {

src/reusable/DocsLink.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CLink } from '@coreui/react-ts'
+import { CLink } from '@coreui/react'
 
 const DocsLink = (props) => {
   const { name, text, ...rest } = props

src/views/base/breadcrumbs/Breadcrumbs.js

@@ -8,7 +8,7 @@ import {
   CCol,
   CRow,
   CLink,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Breadcrumbs = () => {

src/views/base/cards/Cards.js

@@ -8,7 +8,7 @@ import {
   CCol,
   CFormCheck,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { DocsLink } from 'src/reusable'
 

src/views/base/carousels/Carousels.js

@@ -11,7 +11,7 @@ import {
   CCarouselItem,
   CCol,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const slides = [

src/views/base/collapses/Collapses.js

@@ -1,15 +1,5 @@
 import React, { useState } from 'react'
-import {
+import { CButton, CCard, CCardBody, CCardHeader, CCol, CCollapse, CRow } from '@coreui/react'
-  CButton,
-  CCard,
-  CCardBody,
-  CCardFooter,
-  CCardHeader,
-  CCol,
-  CCollapse,
-  CFade,
-  CRow,
-} from '@coreui/react-ts'
 import { DocsLink } from 'src/reusable'
 
 const Collapses = () => {

src/views/base/forms/BasicForms.js

@@ -22,7 +22,7 @@ import {
   CInputGroup,
   CInputGroupText,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { DocsLink } from 'src/reusable'
 

src/views/base/jumbotrons/Jumbotrons.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CButton, CCard, CCardBody, CCardHeader, CCol, CContainer, CRow } from '@coreui/react-ts'
+import { CButton, CCard, CCardBody, CCardHeader, CCol, CContainer, CRow } from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Jumbotrons = () => {

src/views/base/list-groups/ListGroups.js

@@ -10,7 +10,7 @@ import {
   CRow,
   CTabContent,
   CTabPane,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const ListGroups = () => {

src/views/base/navbars/Navbars.js

@@ -18,7 +18,7 @@ import {
   CNavLink,
   CDropdown,
   CButton,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const CNavbars = () => {

src/views/base/navs/Navs.js

@@ -12,7 +12,7 @@ import {
   CNav,
   CNavItem,
   CNavLink,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Navs = () => {

src/views/base/paginations/Pagnations.js

@@ -1,10 +1,8 @@
-import React, { useState } from 'react'
+import React from 'react'
-import { CCard, CCardBody, CCardHeader, CPagination, CPaginationItem } from '@coreui/react-ts'
+import { CCard, CCardBody, CCardHeader, CPagination, CPaginationItem } from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Paginations = () => {
-  const [currentPage, setCurrentPage] = useState(2)
-
   return (
     <>
       <CCard className="mb-4">

src/views/base/popovers/Popovers.js

@@ -1,14 +1,5 @@
 import React from 'react'
-import {
+import { CButton, CCard, CCardBody, CCardHeader, CLink, CPopover, CRow, CCol } from '@coreui/react'
-  CButton,
-  CCard,
-  CCardBody,
-  CCardHeader,
-  CLink,
-  CPopover,
-  CRow,
-  CCol,
-} from '@coreui/react-ts'
 import { DocsLink } from 'src/reusable'
 
 const Popovers = () => {

src/views/base/progress-bar/ProgressBar.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CCard, CCardBody, CCardHeader, CProgress, CProgressBar } from '@coreui/react-ts'
+import { CCard, CCardBody, CCardHeader, CProgress, CProgressBar } from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const ProgressBar = () => {

src/views/base/tables/Tables.js

@@ -12,7 +12,7 @@ import {
   CTableHead,
   CTableHeaderCell,
   CTableRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Tables = () => {

src/views/base/tabs/Tabs.js

@@ -10,7 +10,7 @@ import {
   CCard,
   CCardBody,
   CCardHeader,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Tabs = () => {

src/views/base/tooltips/Tooltips.js

@@ -1,14 +1,5 @@
 import React from 'react'
-import {
+import { CButton, CCard, CCardBody, CCardHeader, CLink, CTooltip, CRow, CCol } from '@coreui/react'
-  CButton,
-  CCard,
-  CCardBody,
-  CCardHeader,
-  CLink,
-  CTooltip,
-  CRow,
-  CCol,
-} from '@coreui/react-ts'
 import { DocsLink } from 'src/reusable'
 
 const Tooltips = () => {

src/views/buttons/button-dropdowns/ButtonDropdowns.js

@@ -16,7 +16,7 @@ import {
   CFormLabel,
   CFormControl,
   CFormCheck,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const ButtonDropdowns = () => {

src/views/buttons/button-groups/ButtonGroups.js

@@ -16,7 +16,7 @@ import {
   CInputGroup,
   CInputGroupText,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const ButtonGroups = () => {

src/views/buttons/buttons/Buttons.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CButton, CCard, CCardBody, CCardHeader, CCol, CRow } from '@coreui/react-ts'
+import { CButton, CCard, CCardBody, CCardHeader, CCol, CRow } from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { DocsLink } from 'src/reusable'
 

src/views/charts/Charts.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CCard, CCardBody, CCol, CCardHeader, CRow } from '@coreui/react-ts'
+import { CCard, CCardBody, CCol, CCardHeader, CRow } from '@coreui/react'
 import {
   CChartBar,
   CChartLine,

src/views/icons/brands/Brands.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CCard, CCardBody, CCardHeader, CCol, CRow } from '@coreui/react-ts'
+import { CCard, CCardBody, CCardHeader, CCol, CRow } from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { brandSet } from '@coreui/icons'
 import { DocsLink } from 'src/reusable'

src/views/icons/coreui-icons/CoreUIIcons.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CCard, CCardBody, CCardHeader, CRow } from '@coreui/react-ts'
+import { CCard, CCardBody, CCardHeader, CRow } from '@coreui/react'
 import { freeSet } from '@coreui/icons'
 import { getIconsView } from '../brands/Brands.js'
 import { DocsLink } from 'src/reusable'

src/views/icons/flags/Flags.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CCard, CCardBody, CCardHeader, CRow } from '@coreui/react-ts'
+import { CCard, CCardBody, CCardHeader, CRow } from '@coreui/react'
 import { getIconsView } from '../brands/Brands.js'
 import { flagSet } from '@coreui/icons'
 import { DocsLink } from 'src/reusable'

src/views/notifications/alerts/Alerts.js

@@ -10,7 +10,7 @@ import {
   CLink,
   CProgress,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Alerts = () => {

src/views/notifications/badges/Badges.js

@@ -8,7 +8,7 @@ import {
   CCol,
   CBadge,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Badges = () => {

src/views/notifications/modals/Modals.js

@@ -11,7 +11,7 @@ import {
   CModalHeader,
   CModalTitle,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Modals = () => {

src/views/notifications/toaster/Toaster.js

@@ -13,10 +13,8 @@ import {
   CCol,
   CFormLabel,
   CToast,
-  CToastBody,
-  CToastHeader,
   CToaster,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Toaster = () => {
@@ -35,10 +33,10 @@ const Toaster = () => {
   const [toasts, setToasts] = useState([
     { placement: 'static' },
     { placement: 'static' },
-    { placement: 'top-right', autohide: 3000 },
+    { placement: 'top-end', autohide: 3000 },
   ])
 
-  const [placement, setPlacement] = useState('top-right')
+  const [placement, setPlacement] = useState('top-end')
   const [autohide, setAutohide] = useState(true)
   const [autohideValue, setAutohideValue] = useState(5000)
   const [closeButton, setCloseButton] = useState(true)

src/views/pages/login/Login.js

@@ -12,7 +12,7 @@ import {
   CInputGroup,
   CInputGroupText,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const Login = () => {

src/views/pages/page404/Page404.js

@@ -7,7 +7,7 @@ import {
   CInputGroup,
   CInputGroupText,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const Page404 = () => {

src/views/pages/page500/Page500.js

@@ -7,7 +7,7 @@ import {
   CInputGroup,
   CInputGroupText,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const Page500 = () => {

src/views/pages/register/Register.js

@@ -11,7 +11,7 @@ import {
   CInputGroup,
   CInputGroupText,
   CRow,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 
 const Register = () => {

src/views/theme/colors/Colors.js

@@ -1,6 +1,6 @@
 import React, { useEffect, useState, createRef } from 'react'
 import classNames from 'classnames'
-import { CRow, CCol, CCard, CCardHeader, CCardBody } from '@coreui/react-ts'
+import { CRow, CCol, CCard, CCardHeader, CCardBody } from '@coreui/react'
 import { rgbToHex } from '@coreui/utils'
 import { DocsLink } from 'src/reusable'
 

src/views/theme/typography/Typography.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CCard, CCardHeader, CCardBody } from '@coreui/react-ts'
+import { CCard, CCardHeader, CCardBody } from '@coreui/react'
 import { DocsLink } from 'src/reusable'
 
 const Typography = () => {

src/views/widgets/Widgets.js

@@ -8,7 +8,7 @@ import {
   CWidgetProgress,
   CWidgetProgressIcon,
   CWidgetSimple,
-} from '@coreui/react-ts'
+} from '@coreui/react'
 
 import WidgetsBrand from './WidgetsBrand'
 import WidgetsDropdown from './WidgetsDropdown'